问题描述
我在码头服务器上执行了一段 javascript,该服务器正在向另一台服务器(wamp 服务器)上的 scoket 发送 XMLHTTPRequest.请求被发送到套接字,但是 XHR 响应似乎被阻塞了.
I have a piece of javascript executing on a jetty server which is sending a XMLHTTPRequest to a scoket on another server(wamp server). The request gets sent to the socket, however the XHR response seems to be getting blocked.
我听说我可以使用 JSONP 来解决这个问题.但是,由于我对 javascript 都很陌生,而且我从未使用过 JSONP 技术,在此之前我非常感谢有关如何使用这种技术的任何帮助?
I have heard that I can use JSONP to overcome this problem. However as I am new to both javascript and I have never used JSONP technique before I would greatly appreciate any help in how to use this technique?
function sendPost(url, postdata, callback) {
xmlHttp=GetXmlHttpObject()
if (xmlHttp==null) {
alert ("Browser does not support HTTP Request")
return
}
xmlHttp.onreadystatechange=callback
xmlHttp.open("POST",url,true)
xmlHttp.send(postdata);
}
function sendInitRQ(width, height) {
var post = "<?xml version="1.0" encoding="UTF-8"?><command type="init"><width>" + width + "</width><height>" + height + "</height></command>";
sendPost("http://localhost:80/socket.php", post, initReturned);
}
我知道 php 套接字正在接收帖子,因为当我检查服务器日志时,我在 get 请求中得到 200.
I know that the php socket is recieving the post as when i check the server log i get a 200 on the get request.
我只想知道如何使用 JSONP 方法?我已经看到了这种方法的例子,但我仍然不确定如何去做.
I just want to know how can I use the JSONP approach? I have seen exampples of the approach but Iam stilll unsure of how to do it.
推荐答案
JSONP 技术使用完全不同的机制向服务器发出 HTTP 请求并根据响应进行操作.它需要客户端页面和服务器上的协作代码.服务器必须有一个 URL 来响应 HTTPGET"请求,其中包含一个包裹在函数调用中的 JSON 块.因此,您不能只对任何旧服务器进行 JSONP 事务;它必须是明确提供该功能的服务器.
The JSONP technique uses a completely different mechanism for issuing HTTP requests to a server and acting on the response. It requires cooperating code in the client page and on the server. The server must have a URL that responds to HTTP "GET" requests with a block of JSON wrapped in a function call. Thus, you can't just do JSONP transactions to any old server; it must be a server that explicitly provides the functionality.
这个想法是您的客户端代码动态创建一个 块,并将src"属性设置为 JSONP 服务器的 URL.URL 应该包含一个参数,告诉服务器您希望它使用 JSON 数据调用的 Javascript 函数的名称.(具体使用什么参数名称取决于服务器;通常是回调",但我见过一些使用jsonp".)客户端当然必须在全局范围内具有该功能.换句话说,如果你有这样的功能
The idea is that your client-side code creates a <script>
block dynamically, with the "src" attribute set to the URL of the JSONP server. The URL should contain a parameter telling the server the name of the Javascript function you expect it to call with the JSON data. (Exactly what parameter name to use depends on the server; usually it's "callback", but I've seen some that use "jsonp".) The client must of course have that function in the global scope. In other words, if you have a function like
function handleJSON(json) {
var something = json.something;
// ... whatever ...
}
然后你的 URL 告诉服务器调用handleJSON",服务器响应应该是这样的:
then your URL tells the server to call "handleJSON", and the server response should look like this:
handleJSON({"id": 102, "something": { "more": "data", "random": true }});
因此,当 <script>
块从您提供的src" URL 加载时,浏览器将解释内容(来自服务器的响应)并调用您的函数.
Thus when the <script>
block is loaded from the "src" URL you gave, the browser will interpret the contents (the response from the server) and your function will be called.
应该清楚的是,您应该只向您信任的服务器发出 JSONP 请求,因为它们会发回代码以在您的客户端中执行,并且可以访问您的客户端与其他安全站点之间的任何活动会话.
It should be clear that you should only make JSONP requests to servers you trust, since they're sending back code to execute in your client, with access to any active session(s) your client has with other secured sites.
编辑 —这是一篇不错的文章:http://www.ibm.com/developerworks/library/wa-aj-jsonp1/
edit — Here's a nice article: http://www.ibm.com/developerworks/library/wa-aj-jsonp1/
这篇关于如何使用 JSONP 克服 XSS 问题?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持跟版网!