Chrome擴展（回調/ localStorage的）

我想打一個Chrome擴展，做this（自動登錄到一個網站，可能不是最好的方法，因爲這是我第一次做JS），並有一個選項頁面，用戶可以在設置他的信息並保存（localstorage？），以便內容腳本可以訪問它以及選項頁面。Chrome擴展（回調/ localStorage的）

下面是我經過大量的研究後，來看看例子等： http://pastebin.com/yTiXp4VY（所有文件的源代碼那裏）。

最後我放棄了，只是用試錯所以有噸錯誤的存在。控制檯報告由於安全原因無法運行。請解釋一下這個版本有什麼問題。我不需要你修復我的代碼，我只是在學習JS。

來源

2012-05-21 Seren

奇怪......我發現[這]（http://stackoverflow.com/questions/3937000/chrome-extension-accessing-localstorage-in-content-script），並試圖他建議的例子，我得到它的安全消息......不知道爲什麼它的發生...... – Seren

這將有助於如果你確實引用了「安全信息」。 –

由於Content-Security-Policy拒絕執行內聯事件處理程序。 – Seren

對於大多數情況，你的代碼似乎是正確的。只有一個注意：你的選項頁面可以直接訪問localStorage，它不需要那個背景頁面。但主要問題似乎是內容腳本的構建方式 - 它假定用戶/密碼數據將立即（同步）可用。這不是它的工作原理：您正在向後臺頁面發送消息，最終後臺頁面將會回答，並且將在內容腳本中調用您的回調。最簡單的方法是延遲所有操作，直到發生這種情況並且您有數據。將一條消息發送給後臺頁面會給你所有的數據應該更容易。事情是這樣的：

var userName = null; 
var passWord = null; 

chrome.extension.sendRequest({ eventName: "getLogin" }, 
    function(response) { 
     userName = response.user; 
     passWord = response.pass; 

     // Now we can continue doing whatever we are doing 
     checkIfAutoUrl(); 
    } 
);

和消息處理你的背景頁是這樣的：

function onRequest(request, sender, sendResponse) { 
    if (request.eventName == "getLogin") { 
     sendResponse({user: getStorage("user"), pass: getStorage("pass")}); 
    } 
}

請注意，響應是具有兩個屬性user和pass這裏的對象 - 這樣的內容腳本可以在獲得響應後立即繼續，它具有所有必要的數據，並且不需要等待第二個響應。

更新：關於您收到的錯誤消息：Content Security Policy是爲了防止您的擴展程序被惡意網站利用。該保護的一部分不允許HTML中的內聯腳本 - 如onload="load_options()"。所有將運行的腳本都需要放在JavaScript文件中。因此，而不是這個onload屬性，你可以把下列options.js：

window.addEventListener("load", load_options, false);

見addEventListener documentation on MDN。

來源

2012-05-21 10:30:34

好吧，我試圖修改它根據您的信息，但我遇到了不相關的消息問題，但是，當我試圖讓從elementId提交按鈕它總是返回null。 [這是修改後的代碼]（http://pastebin.com/7vLamhNd），抱歉，我這麼晚回覆，過去幾天我一直很忙。 *注意*我在HTML中的腳本中嘗試了相同的代碼，它的工作原理？但那不是我想要的...... – Seren

@Seren：在完成加載之前不要訪問頁面... –

啊好的，我將添加事件監聽器到加載函數-.- – Seren

Chrome擴展（回調/ localStorage的）

回答

相關問題