https://www.jianshu.com/p/b6c40d8c9ad4（此篇博文有參照這個作者）
1.什麼是跨域
2.常見跨域方式
1）JSONP
JSONP是JSON with padding（填充式JSON或參數是JSON）的簡寫，是應用JSON的一種新方法，JSONP看起來和JSON差不多，只不過是被包含在函數調用的JSON，像這樣：callback({name: 'nany'})。
百度的搜索就是用的這個原理，首先看一下
輸入一個s然後打開網絡
將這個地址複製打開並且保存
打開剛纔的文件
對照着看一下他的地址
接下來我們自己寫一個簡單的例子理解一下jsonp
首先創建一個jsonp.js
jsonp.html
運行一下就會彈出miaov
接下來動態創建一下
接下來我們動態創建jsonp.js的文件名
2）cors
https://zhuanlan.zhihu.com/p/25778815 看這篇有詳細例子
這裏看一下miaov的例子
前端
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>無標題文檔</title>
<script>
window.onload = function() {
/*
在標準瀏覽器下，XMLHttpRequest對象已經是升級版本，支持了更多的特性，可以跨域了
但是，如果想實現跨域請求，還需要後端的相關配合纔可以
XMLHttpRequest : 增加很多功能，他也不推薦使用onreadystatechange這個事件來監聽，推薦使用onload
XDomainRequest : IE如果想實現跨域請求，則需要使用另外一個對象去實現
*/
var oBtn = document.getElementById('btn');
oBtn.onclick = function() {
/*var xhr = new XMLHttpRequest();
xhr.onreadystatechange = function() {
if (xhr.readyState == 4) {
if (xhr.status == 200) {
alert(xhr.responseText);
}
}
}
xhr.open('get', 'http://www.b.com/ajax.php', true);
xhr.send();*/
var oXDomainRequest = new XDomainRequest();
oXDomainRequest.onload = function() {
alert(this.responseText);
}
oXDomainRequest.open('get', 'http://www.b.com/ajax.php', true);
oXDomainRequest.send();
}
}
</script>
</head>
<body>
<input type="button" value="獲取同域下內容" id="btn" />
</body>
</html>
服務器端代碼
<?php
header('Access-Control-Allow-Origin:http://www.a.com'); //這是允許訪問該資源的域
echo 'hello';
這樣就可以正常訪問了
- 如何解決跨域的問題
-
表單可以跨域嗎（可以）
-
對跨域的瞭解
-
介紹下瀏覽器跨域
-
怎麼去解決跨域問題
-
jsonp方案需要服務端怎麼配合
在服務器端，需要對script的src進行url解析，將data作爲參數放入回調函數中，最後通過res.end(callback(data))中將要執行的函數放入客戶端的script中，在客戶端對該函數進行執行。
看下面例子
-
Ajax發生跨域要設置什麼（前端）
CORS 不需要設置，由後端設置
-
加上CORS之後從發起到請求正式成功的過程
對於簡單請求
對於非簡單請求
-
-
Access-Control-Allow-Origin在服務端哪裏配置
使用headers屬性