chrome擴展javascript無法正常工作

Question

您好，我正在開發chrome擴展程序，我正在使用ebay搜索API ...以下是我的html代碼：

<html>
<head>
<title>eBay Search Results</title>
<style type="text/css">body { font-family: arial,sans-serif;} </style>
<script type="text/javascript" src="j.js"></script>
</head>
<body>
<h1>eBay Search Results</h1>
<div id="results"></div>
</body>
</html>

javascript

function _cb_findItemsByKeywords(root) {
var items = root.findItemsByKeywordsResponse[0].searchResult[0].item || [];
  var html = [];
  html.push('<table width="100%" border="0" cellspacing="0" cellpadding="3"><tbody>');
  for (var i = 0; i < items.length; ++i) {
    var item     = items[i];
    var title    = item.title;
    var pic      = item.galleryURL;
    var viewitem = item.viewItemURL;
    if (null != title && null != viewitem) {
      html.push('<tr><td>' + '<img src="' + pic + '" border="0">' + '</td>' + 
      '<td><a href="' + viewitem + '" target="_blank">' + title + '</a></td></tr>');
    }
  }
  html.push('</tbody></table>');
  document.getElementById("results").innerHTML = html.join("");
}  // End _cb_findItemsByKeywords() function
var url = "http://svcs.ebay.com/services/search/FindingService/v1";
    url += "?OPERATION-NAME=findItemsByKeywords";
    url += "&SERVICE-VERSION=1.0.0";
    url += "&SECURITY-APPNAME=myappid";
    url += "&GLOBAL-ID=EBAY-US";
    url += "&RESPONSE-DATA-FORMAT=JSON";
    url += "&callback=_cb_findItemsByKeywords";
    url += "&REST-PAYLOAD";
    url += "&keywords=harry%20potter";
    url += "&paginationInput.entriesPerPage=3";
    // Submit the request 
s=document.createElement('script'); // create script element
s.src= url;
debugger;
document.body.appendChild(s);

以下是manifest.json文件

{
  "manifest_version": 2,

  "name": "eBay",
  "description": "This extension demonstrates a 'browser action' with ebay products.",
  "version": "1.0",

  "browser_action": {
    "default_icon": "ebayicon.png",
    "default_popup": "MySample.html"
}

它給了我剛才的<h1>標簽作為輸出...。以下是發生的錯誤：

**未捕獲的TypeError：無法讀取null的屬性'appendChild'**

我不明白這是什么意思...請幫助我了解上述錯誤。

謝謝

Answer 1

問題：

您的代碼存在問題，因為Google Chrome擴展程序無法加載外部腳本。 如內容安全政策中所示，出於安全原因（例如，防止中間人攻擊），Chrome會限制可加載哪些腳本擴展。 這是導致您出現問題的代碼，因為您正試圖從Ebay加載腳本，這是外部腳本，因此不允許這樣做：

var url = "http://svcs.ebay.com/services/search/FindingService/v1";
    url += "?OPERATION-NAME=findItemsByKeywords";
    url += "&SERVICE-VERSION=1.0.0";
    url += "&SECURITY-APPNAME=myappid";
    url += "&GLOBAL-ID=EBAY-US";
    url += "&RESPONSE-DATA-FORMAT=JSON";
    url += "&callback=_cb_findItemsByKeywords";
    url += "&REST-PAYLOAD";
    url += "&keywords=harry%20potter";
    url += "&paginationInput.entriesPerPage=3";
    // Submit the request 
s=document.createElement('script'); // create script element
s.src= url;

解決方案：

第1步

更改URL以使用“ https：//”協議。 只需將不正確代碼的第一行替換為

var url = "http://svcs.ebay.com/services/search/FindingService/v1";

第2步

在manifest.json ，更改/添加content_security_policy行以匹配以下內容

"content_security_policy": "script-src 'self' https://svcs.ebay.com; object-src 'self'"

其他問題

那應該已經解決了Chrome Extension CSP的問題。

您在manifest.json也有一個問題，其中的括號沒有關閉。 只需在browser_action段之后和文件末尾之前插入一個額外的} 。

為了使您的腳本能夠訪問該頁面，您需要在manifest.json content_scripts下注冊該腳本。 這將允許腳本與頁面的document元素進行交互，但是將在隔離的環境中運行腳本，這意味着與頁面本身的全局JavaScript和擴展名的交互受到限制。

如果需要與頁面本身的全局JavaScript環境進行交互，則必須在要與之交互的頁面的document元素中注入<script>標記的<script> 。 消息傳遞可以通過短期或長期請求來完成，您可以在Google Developers文檔中探討消息傳遞。 只要確保不要使用不安全的eval ，並通過某種方式（例如origin或callback屬性）來驗證您的消息是真實的。

chrome擴展javascript無法正常工作

問題描述

1 個解決方案

解決方案1
0 2015-01-03 00:14:43

問題：

解決方案：

第1步

第2步

其他問題

chrome擴展javascript無法正常工作

問題描述

1 個解決方案

解決方案1 0 2015-01-03 00:14:43

問題：

解決方案：

第1步

第2步

其他問題

解決方案1
0 2015-01-03 00:14:43