1

我正在使用後臺頁面,我需要在當前選項卡內容中注入一些代碼。用於Chrome擴展協議的XMLHttpRequest

,所以我下面的:

  • 定義browser_action
  • 通過chrome.tabs.executeScript

,並從頁面內容定義諸如通過content_scripts加載此chrome.browserAction.onClicked.addListener

  • 調用腳本監聽我需要加載HTML來自擴展文件夾內的資源。

    ,但使用這個XMLHttpRequest的給了我錯誤Cross origin requests are only supported for HTTP

    由錯誤NETWORK_ERR: XMLHttpRequest Exception 101

    通過XMLHttpRequest的處理,所以我應該怎麼解決呢?

    注:地址是像chrome-extension://someextensionid/file.html

  • +0

    也許你可以發送到後臺頁面,該頁面會做實際的數據取的請求。然後後臺頁面將這些數據發送到內容腳本。 – pimvdb

    +0

    以及如何通過'executeScript'發送DOMDocument類型的變量? –

    +0

    我想用「負載HTML資源」你的意思是HTML源代碼,這只是一個字符串。如果你在HTML中引用外部文件,那麼它可能會變得棘手。 – pimvdb

    回答

    2

    使用解決:

    btoa(loadXHR(chrome.extension.getURL('file.html'))) 
    

    其中

    • BTOA =串爲Base64
    • loadXHR =同步的XMLHttpRequest
    • chrome.extension。 getURL =以擴展摺疊解析地址呃

    這BACKGROUND_PAGE做了,並且使用

    chrome.tabs.executeScript 
    

    ,並在前臺傳遞給腳本的前景,腳本轉換字符串的HTML字符串,DOM對象

    var div = document.createElement('div'); 
    div.innerHTML = atob(tbr); 
    document.body.appendChild(div); 
    

    其中

    • document.createElement =創建新的「」元素
    • 的innerHTML = HTML DIV元素的值,所以將其設置將創建DOM解析的內容
    • ATOB = BASE64字符串解碼版本
    • document.appendChild =追加DIV與HTML內容主體元件
    1

    相反的:

    btoa(loadXHR(chrome.extension.getURL('file.html'))) 
    

    你應該能夠只使用:

    loadXHR('file.html') 
    

    as XMLHttpRequest瞭解相對路徑(根目錄是您的擴展文件夾)。

    +0

    是啊,你說得對。但在我的情況下,我不需要獲取的每個文件都放在與背景頁面相同的文件夾 –

    +0

    @Marek無所謂,'/'是您的擴展文件夾,如果您使用'/ dir1/dir2/file.html'喜歡。 'chrome.extension.getURL'僅適用於內容腳本,在背景頁面內可以使用相對路徑。在內容腳本 – serg

    +0

    你不能使用chrome.extension.getURL,不是嗎? –