Question

我的Chrome扩展程序中存在一个我无法解决的错误。当用户在安装扩展时提交数据时，它将与chrome.storage.sync.set（）一起存储。当用户点击Gmail中的“撰写”按钮时，内容脚本会发送一条消息，在响应中将输入的数据发送到该消息。我第一次加载Gmail时，数据会返回'undefined'。我能够修复它的唯一方法是添加'alert（）;'进入我的代码。这真的很不方便，我找不到任何其他方法来解决它。

background.js

var name, title, company, email, photo, phone;

chrome.runtime.onConnect.addListener(function(port) {
  console.assert(port.name == "knockknock");
  port.onMessage.addListener(function(msg) {


      chrome.storage.sync.get("name",function(data){
         name = data.name; 
      });

      chrome.storage.sync.get("title",function(data){
         title = data.title; 
      });

      chrome.storage.sync.get("company",function(data){
         company = data.company; 
      });

      chrome.storage.sync.get("email",function(data){
         email = data.email; 
      });

      chrome.storage.sync.get("photo",function(data){
         photo = data.photo; 
      });

      chrome.storage.sync.get("phone",function(data){
         phone = data.phone; 
      });

      alert();

    if (msg.reason == "getInfo"){

        port.postMessage({name: name, title: title, company: company, email: email, photo: photo, phone: phone});

    }
  });
});

setup.js（这是最初输入数据的地方）

 $('.ee-required').slideUp(400,function(){
                $('.ee-form-saved').slideDown();
                var name = document.getElementsByClassName('ee-form-name')[0].value;
                var title = document.getElementsByClassName('ee-form-title')[0].value;
                var company = document.getElementsByClassName('ee-form-company')[0].value;
                var email = document.getElementsByClassName('ee-form-email')[0].value;
                var photo = document.getElementsByClassName('ee-form-photo')[0].value;
                var phone = document.getElementsByClassName('ee-form-phone')[0].value;

                chrome.storage.sync.set({'name': name});
                chrome.storage.sync.set({'title': title});
                chrome.storage.sync.set({'company': company});
                chrome.storage.sync.set({'email': email});
                chrome.storage.sync.set({'photo': photo});
                chrome.storage.sync.set({'phone': phone},function(){
                    setTimeout(function(){window.close()},1000);
                });
            });

content.js（这将从chrome.runtime中的background.js中检索数据）

var name, title, company, email, photo, phone;

    function getSignature(){
        var port = chrome.runtime.connect({name: "knockknock"});
        port.postMessage({reason: "getInfo"});
        port.onMessage.addListener(function(msg) {

            name = msg.name;
            title = msg.title;
            company = msg.company;
            email = msg.email;
            photo = msg.photo;
            phone = msg.phone;
            console.log(name + " " + title + " " + company + " " + email + " " + photo + " " + phone);

        });
    }
    getSignature();

Answer 1

变量name, title, company, email, photo, phone未在background.js中设置，因为chrome.storage.sync.get是异步的。不是将每个变量都保存在自己的对象中，而是将它们保存在一个中。

//setup.js
var data = {
    "name": name,
    "title": title,
    "company": company,
    "email": email,
    "photo": photo,
    "phone": phone
};
chrome.storage.sync.set({'data': data},function(){
                    setTimeout(function(){window.close()},1000);
                });

//background.js
port.onMessage.addListener(function(msg) {
      if (msg.reason == "getInfo"){
          chrome.storage.sync.get("data",function(data){
              port.postMessage(data);
          });
      }
});

我的Chrome扩展程序中存在错误

1 个答案: