6

我需要在 chrome 扩展中进行跨域请求。我知道我可以通过消息传递来实现,但我宁愿只使用 jQuery 习语(所以我的 javascript 也可以作为<script src="">.

我做的是正常的:

$.getJSON("http://api.flickr.com/services/feeds/photos_public.gne?tags=cat&tagmode=any&format=json&jsoncallback=?", function(data) {
  console.log(data);
});

但在错误控制台中我看到:

Uncaught ReferenceError: jsonp1271044791817 is not defined

jQuery 是否没有将回调函数正确插入到文档中?我能做些什么来完成这项工作?

(如果我将代码粘贴到 chrome 控制台中,它可以正常工作,但如果我将其作为 page.js 放在扩展程序中,则会出现问题。)

4

5 回答 5

8

唉,这些都不起作用,所以我最终通过 background.html 进行通信。

背景.html

<script src="http://code.jquery.com/jquery-1.4.2.js"></script>
<script>
function onRequest(request, sender, callback) {
  if (request.action == 'getJSON') {
    $.getJSON(request.url, callback);
  }
}

chrome.extension.onRequest.addListener(onRequest);
</script>

javascripts/page.js

chrome_getJSON = function(url, callback) {
  console.log("sending RPC");
  chrome.extension.sendRequest({action:'getJSON',url:url}, callback);
}

$(function(){
  // use chrome_getJSON instead of $.getJSON
});
于 2010-04-13T10:22:22.493 回答
3

如果您在manifest.json文件中指定“api.flickr.com”,则不需要使用 JSONP 回调,跨域请求的脚本注入样式。

例如:

"permissions": ["http://api.flickr.com"],

这应该在您的代码中很好地工作。我会删除查询字符串参数“&jsoncallback”,因为不需要 JSONP 工作。

您当前代码不起作用的原因是您的代码正在注入页面 DOM,内容脚本可以访问 DOM 但无法访问 javascript 上下文,因此没有调用回调的方法。

于 2010-04-12T11:55:30.487 回答
2

我的印象是这会失败,因为 jQuery 回调函数是在 Chrome 扩展的“孤立世界”中创建的,并且在响应返回时无法访问:

http://code.google.com/chrome/extensions/content_scripts.html#execution-environment

由于各种原因,我使用 Prototype 和 jQuery,但我的快速修复应该很容易解析:

// Add the callback function to the page
s = new Element('script').update("function boom(e){console.log(e);}");
$$('body')[0].insert(s);

// Tell jQuery which method to call in the response
function shrink_link(oldLink, callback){
    jQuery.ajax({
        type: "POST",
        url: "http://api.awe.sm/url.json",
        data: {
            v: 3,
            url: oldLink,
            key: "5c8b1a212434c2153c2f2c2f2c765a36140add243bf6eae876345f8fd11045d9",
            tool: "mKU7uN",
            channel: "twitter"
        },
        dataType: "jsonp",
        jsonpCallback: callback
    });
}

// And make it so.
shrink_link('http://www.google.com', "boom");

或者,您可以尝试使用扩展 XHR 功能:

http://code.google.com/chrome/extensions/xhr.html

var xhr = new XMLHttpRequest();
xhr.open("GET", "http://api.example.com/data.json", true);
xhr.onreadystatechange = function() {
  if (xhr.readyState == 4) {
    // JSON.parse does not evaluate the attacker's scripts.
    var resp = JSON.parse(xhr.responseText);
  }
}
xhr.send();
于 2011-12-06T01:30:09.810 回答
0

语法有点不对劲。不需要那个callback(位。这完美无缺。在此 StackOverflow 页面(包括 jQuery)上的 Chrome 的 javascript 控制台中进行了测试:

$.getJSON("http://api.flickr.com/services/feeds/photos_public.gne?tags=cat&tagmode=any&format=json&jsoncallback=?", function(data) {
  console.log(data);
});
于 2010-04-12T04:25:29.777 回答
0

As many of you will know, Google Chrome doesn't support any of the handy GM_ functions at the moment.

As such, it is impossible to do cross site AJAX requests due to various sandbox restrictions (even using great tools like James Padolsey's Cross Domain Request Script)

I needed a way for users to know when my Greasemonkey script had been updated in Chrome (since Chrome doesn't do that either...). I came up with a solution which is documented here (and in use in my Lighthouse++ script) and worth a read for those of you wanting to version check your scripts:

http://blog.bandit.co.nz/post/1048347342/version-check-chrome-greasemonkey-script

于 2010-09-01T16:27:21.467 回答