Question

我在chrome扩展程序（内容脚本）中发出JSONP请求。当我作为网页运行 - 在我的浏览器中加载HTML文件时，一切都运行良好，但是当我将其作为chrome扩展加载时，当服务器给出响应时，jquery创建的jsonp回调函数似乎不存在

我的控制台说：

Uncaught ReferenceError: jQuery17105683612572029233_1323808231542 is not defined

这是我的ajax请求：

$.ajax({
    url: 'http://example.com',
    data: 
    {
        imgUrl: this.href,
        returnString:true
    },
    dataType: "jsonp",
    success: function(msg){
        newNode.src = msg.data;
    },
    error: function(msg){
        console.log(msg.data);
    }
})

Answer 1

问题是，实际页面捕获了JSONP响应，在Chrome内容脚本限制您的沙盒JavaScript代码之外。

jQuery17105683612572029233_1323808231542是jQuery JSONP调用为特定调用动态生成的回调函数的名称。此函数正在内容脚本可以访问的沙盒区域中定义。

我所知道的唯一可行的解决方法是从内容脚本进行XHR调用。从Chrome 13开始，您可以从内容脚本中进行跨域XHR调用（非常酷）。在清单文件中，您需要将外部URL添加到权限：

{
    ...
    "permissions": [
        "http://example.com"
    ]
}

然后您可以像这样进行XHR调用：

var xhr = new XMLHttpRequest();
xhr.open("GET", "http://example.com/", true);
xhr.onreadystatechange = function() {
    if (xhr.readyState == 4) {
       //handle the xhr response here
  }
}
xhr.send();

你需要做一些jQuery自动为你做的事情，比如将数据对象的值编码到XHR URL（在你的情况下是“imrUrl”和“returnString”）以及转换从xhr.responeText或xhr.reponseXML到对象的响应。

这种方法的缺点是，如果您在Chrome扩展程序和其他内容（如书签）之间共享此代码，则现在必须为Chrome用例提供不同的逻辑。

有关详细信息，请参阅：Chrome Extension XHR

Chrome扩展中的JSONP请求，回调函数不存在？

1 个答案: