【问题标题】:Correct use of JSONP正确使用 JSONP
【发布时间】:2016-04-29 22:20:31
【问题描述】:

要成功使用 JSONP(例如通过 jquery - $.ajax ...等),必须始终要求所请求的页面旨在提供与此格式对应的数据?

换句话说,如果我对纯静态内容(即没有 php、aspx 等)的页面执行请求,我也会收到错误吗?

这个问题对某些用户来说可能看起来微不足道,但我现在开始学习这些技术,事情有点复杂。

基于这些 (ref1ref2) 引用,似乎 JSONP 的请求与服务器响应的实现之间必须保持一致。

编辑

我有这个 jQuery 请求

$.ajax({
    url: "https://sites.google.com/site/problemsstore/javascript/test.js",
    type: 'GET',
    crossDomain: true,
    dataType: 'jsonp',
    dataCharset: 'jsonp',
    success: function (result) {
        console.log('request succeed');
    },
    error: function (result) {
        console.log('failed');
    }
});

我已经加载了https://sites.google.com/site/mysite/javascript/test.js?attredirects=0&d=1这个test.js文件:

function myCall(data) {
console.log('succeed');
}
myCall({ some : "data" });

当我连接时,我希望获得控制台的输出:succeed succeed

这就是我得到的:

succeed 
failed

编辑2

$.ajax({
    url: "https://sites.google.com/site/bentofelicianolopez/jscript-jsonp/test.js?attredirects=0&d=1",
    type: 'GET',
    crossDomain: true,
    dataType: 'jsonp',
    dataCharset: 'jsonp',
    jsonp: 'myCall',
    //contentType: 'application/json',
    success: function (result) {
        console.log('request succeed');
    },
    error: function (result) {
        console.log('failed');
    }
});

.js 文件:

myCall({ some : "data" });

输出:

failed test4.html:94:9
ReferenceError: myCall is not defined /*this is the syntactical error of which I said*/
 test.js:1:1

【问题讨论】:

  • JSONP 是一种通过利用脚本可以跨不同来源加载的事实来绕过同源策略的黑客。要使 hack 起作用,服务器和客户端之间必须有协议。
  • crossDomain: true, 阻止 jQuery 将标头添加到 XHR,它只为同源请求添加(以防同源将 HTTP 重定向到不同源)。对于开始是跨源并且对 JSONP 请求没有任何影响的请求是没有意义的(因为无法控制那里的标头)
  • dataCharset 不是 jQuery ajax 设置对象接受的属性

标签: javascript jsonp


【解决方案1】:

要成功使用 JSONP(例如通过 jquery - $ .ajax ... 等),所请求的页面必须始终设计为提供与此格式对应的数据?

是的。仅当响应以 JSONP 表示时,对 JSONP 的请求才会起作用。

也就是说,如果我对纯静态内容(即没有php、aspx等)的页面执行请求,也会报错?

你可以有一个符合 JSONP 格式的静态 JavaScript 程序(它需要硬编码回调函数名称),所以不一定。

【讨论】:

  • 那么是不是不可能使用这种方法来简单地检查网络连接的存在(使用任意域)?请求总是会返回错误?
  • 关于你的答案的第二部分,你能给我一个例子的参考吗?
  • @Bento — 错误。 example.js 的内容:someCallbackName({ "some: "data" })
  • 该站点必须提供一个返回 JSONP 数据的 URL。该 JavaScript 程序是 JSONP 数据。
  • 因为你不能把真正的 JavaScript 文件放在那里,它看起来是那样的。
猜你喜欢
  • 2013-10-15
  • 1970-01-01
  • 1970-01-01
  • 2012-06-20
  • 2018-05-12
  • 2013-01-17
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多