Home > Article > Backend Development > ajax cross-domain solution, ajax cross-domain_PHP tutorial
Recently during the development process, ajax was used to asynchronously retrieve images. There is no problem with this function during development, and it can be tested later. However, problems may arise after redeployment. This is the cross-domain problem of Ajax.
ajax itself does not support cross-domain. This is due to the same-origin policy of javascript. But we can solve the cross-domain problem of ajax through other methods.
1 Since we use jquery to write ajax, we initially planned to use jsonp to solve it. The client is written like the following
$.ajax({ type : "get", async:false, url : "http://www.xxx.com/ajax.do", dataType : "jsonp", jsonp: "callbackparam",//服务端用于接收callback调用的function名的参数 jsonpCallback:"success_jsonpCallback",//callback的function名称 success : function(json){ alert(json); alert(json[0].name); }, error:function(){ alert('fail'); } });
Server-side writing
public void ProcessRequest (HttpContext context) { context.Response.ContentType = "text/plain"; String callbackFunName = context.Request["callbackparam"]; context.Response.Write(callbackFunName + "([ { name:\"John\"}])"); }
This method is actually quite simple and has little change from what we wrote before.
2 Since we are developing a lot of pages in this project, the changes involve more places. Finally, it was implemented by directly modifying the nginx configuration. My usual understanding of reverse proxy is caching, security, and load balancing, so I checked the direction proxy below
Reverse Proxy, as the name suggests, is the reverse function of the proxy. We use proxies to access some networks that we cannot directly access, or to hide our true identity. The reverse proxy allows external users to access our internal services behind the firewall without exposing the internal server.
Using a reverse proxy has the following main benefits:
1 Unified control of requests, including setting permissions, filtering rules, etc.;
2 Hide the real address of the internal service, and only the reverse proxy server address is exposed;
3 To achieve load balancing, multiple servers can be used internally to form a server cluster, and one address can still be used for external access;
4 Solve the Ajax cross-domain problem.
5 As a buffer for the real server, it solves the problem of large instantaneous load.
After the project was completed, I checked the ajax cross-domain issue on the Internet, and I also learned that cross-domain purposes can be achieved by requesting tag references for cross-domain resources in HTML. In fact, jsonp essentially uses this A way.
There are many tags in HTML that can request cross-domain resources,
Script is undoubtedly the most suitable. When requesting each script resource, the browser will parse and run the functions defined in the script file, or the JavaScript code that needs to be executed immediately. We can return a script or JSON object through the server, and parse and execute it in the browser, thereby achieving cross- The purpose of the domain request. Use script tags to implement cross-domain requests, and you can only use the get method to request server resources. And the length of the parameters passed is also limited by the length of the address bar.
From your problem description, I cannot tell what your real problem is. I would like to ask: 1. Does your IIS configuration support anonymous access? 2. Do you use a relative path for the url during ajax interaction? Or is it not the URL of your own website that you are interacting with? Regarding JS cross-domain access, if you must access the resources of other websites, the solutions are: 1. Connect to other websites through iframe 2. Ajax indirectly accesses the resources of the other website through the background, such as accessing the webservice of the other website
参考1
主页面代码:
a816d09bf94d0bef1b86b7f8d91d85fe
93f0f5c25f18dab9d176bd4f6de5d30e
36fc0da5a553527cb1d2a9551dbb853b
b2386ffb911b14667cb8f0f91ea547a7主页面6e916e0f7d1e588d4f442bf645aedb2f
1a24b17f85e15c83fc29b7760e40bfcb
2cacc6d41bbb37262a98f745aa00fbf0
9c3bca370b5104690d9ef395f2c5f8d1
f37b28256bd2edd76eee8bc896988483065276f04003e4622c4fe6b64f465b88
dc369329dd3a98897828f7aeed6441e8065276f04003e4622c4fe6b64f465b88
dcbaec397a11a594b425f5133f6a9f96065276f04003e4622c4fe6b64f465b88
6c04bd5ca3fcae76e30b72ad730ca86d
36cc49f0c466276486e50c850b7e4956
73a6ac4ed44ffec12cee46588e518a5e
getDocument2.html:
100db36a723c770d327fc0aef2ce13b1
93f0f5c25f18dab9d176bd4f6de5d30e
3f1c4e4b6b16bbbd69b2ee476dc4f83a
window.onload = function (){
alert(3);
alert(parent.document.frames.length);
alert(parent.document.frames["getD"].window.document.getElementById('up'));
alert(parent.document.frames["getD"].window.document.getElementById('up').innerHTML);
}
function getdocument(){
alert(4);
alert(parent.document.frames["getD"].window.document.getElementById('up').innerHTML);
}
2cacc6d41bbb37262a98f745aa00fbf0
9c3bca370b5104690d9ef395f2c5f8d1
6c04bd5ca3fcae76e30b72ad730ca86d
8bde7e6bb5e36935c80ec75282002d1egetDocument294b3e26ee717c64999d7867364b1b4a3
8d3c1a9941ec49061a526628041a5abdgetElement294b3e26ee717c64999d7867364b1b4a3