我在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);
    }
})

最佳答案

问题是实际页面捕获了JSONP响应,而Chrome内容脚本也限制了您的沙盒JavaScript代码。
jQuery17105683612572029233_1323808231542是jQuery JSONP调用针对特定调用动态生成的回调函数的名称。该功能是在内容脚本有权访问的沙盒区域中定义的。

我知道的唯一对我有用的解决方法是从内容脚本进行XHR调用。从Chrome 13开始,您可以从内容脚本进行跨域XHR调用(非常酷)。在 list 文件中,您需要将外部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

07-24 09:38
查看更多