Cross-domain cross-domain Ajax CORS

Cross-domain

If the protocol, the domain name or the port there is a different cross-domain.

Same Origin Policy

Recommended reading: browser-origin policy and workarounds

Because the browser for security reasons ( mainly used to prevent CSRF attacks ), developed a same-origin policy, meaning that when cross-domain Ajax request fails.

problem:

　　However, the same origin policy still can not completely prevent CSRF, it just Response to intercept, that is, the request is sent out.

　　In other words only prevent access to information Response can not stop sending the request .

example:

　　There is a malicious Web site, it will open a cross-domain transmit such a request, ajax sent directly (when the cookie will bring xhr.withCredentials = true) to https://xxx.com/trade?money=1000&userId=666

　　Although xhr malicious Web site can not receive a response, but this request is indeed sent out

in conclusion:

　　Therefore, the real security should do on the server side. For example, cookie and a ip binding, check the reference, with a token instead of cookie, these are the methods csrf solution.

Cross-domain requests

This is not because there are fly-origin policy, we have to go through some means, to achieve cross-domain requests.

JSONP

　　Using the script, img src not homologous to the characteristics of the policy limits, send a GET request cross-domain.

　　End to achieve this requires both before and after rewrite.

　　E.g:

<script src="http://domain/api?param1=a&param2=b&callback=xxx"></script>
<script>
function xxx(data) {
    console.log(data)
}
</script>

GET http:? // domain / api param1 = a & param2 = b & callback = xxx will return this

xxx({
    errCode: 0,
    data: {
        list: [{age: 1}, {age: 2}, {age: 3}, {age: 4}, {age: 5}],
        page: 1,
        size: 5,
        total: 100
    }
})

Xxx global function defined above, can receive the data returned by the server

HEARTS

Cross-origin resource sharing resource sharing across domains

This is very simple, only need to look at rewriting the back end, plus several Access-Control-Allow-xxx response head on it. No need to modify the front, cross-domain requests as a normal request to send it.

Bowen wrote long ago, and will not elaborate here: Ajax cross-domain CORS

document.domain + iframe

document.domain if set to coincide, then two pages can communicate via an iframe, each operation.

Of course document.domain can only be set to or higher than their own domain name, such as xxx.qq.com can only be set to xxx.qq.com or qq.com

For example, so you can get the iframe window object, so you can manipulate the page up.

// get the iframe window 
document.querySelector ( 'iframe' ) .contentWindow 

// iframe can get window host 
window.parent

Document.domain but if not, will be reported cross-domain fault.

postMessage

// sender 
the let otherWin the window.open = ( 'https://www.qq.com' ); 
otherWin.postMessage ( 'information XXX', '*' ); 

// recipient 
window.addEventListener ( 'message', = EV> { 
    the console.log (ev.data); 
})

Cross-domain cross-domain Ajax CORS

document.domain + iframe

Guess you like