數據交互 跨域問題

JavaScript的同源政策是互聯網安全的基石，即不一樣源的網頁之間的資源不能彼此調用彼此的資源的，判斷是否同源的依據是：
協議相同，是http仍是https。
域名相同，一級，二級等是否相同
端口相同，服務器默認端口是省略掉了的80端口，用其餘端口則須要顯式指定

而事實上爲了提高網頁性能，咱們經常須要打破同源限制，好比單獨假設圖片服務器以突破瀏覽器同源資源請求數。

 

跨域請求最經常使用的有JSONP和CORS

JSONP

JSONP的說明見：http://www.cnblogs.com/zhouxiaohouer/p/7900602.html

 

CORS
如今瀏覽器(IE10+)基本上都支持了CORS，因此CORS的關鍵就是服務器是否認義了CORS的接口，所謂接口無非就是是否在響應頭裏設置了跨域許可Access-Control-Allow-Origin，
"'Access-Control-Allow-Origin'：'*'"表示容許任何客戶端訪問。

 

CORS的具體流程以瀏覽器的簡單請求說明

　　在請求頭裏寫入origin字段，標註同源信息，即協議+域名+端口，此請求到達服務器後，服務器比對origin同源信息是否在跨域許可Access-Control-Allow-Origin範圍內，在的話就正常走請求流程，不在的話就返回一個錯誤，而且被XMLHttpRequest的onerror回調函數捕獲。注意，這種錯誤沒法經過狀態碼識別，由於HTTP迴應的狀態碼有多是200。

    router.post('/poststh',(req,res,next)=>{
        res.header('Access-Control-Allow-Origin', '*')
        console.log(req.body.filter)
        goodsModel.find((err,doc)=>{
            if (err) {
                res.json({
                    status:1,
                    msg:err,
                })
            }else{
                res.json({
                    status:0,
                    msg:req.body.filter
                })
            }
        })
    })

CORS跨域的簡單請求和非簡單請求能夠參考阮老師的文章：http://www.ruanyifeng.com/blog/2016/04/cors.html