同源策略: http協(xié)議 域名 端口一致

跨域請求
Access-Control-Allow-Origin: *
請求分為

• 簡單請求，瀏覽器直接發(fā)起請求 fetch。

fetch('https://baidu.com');

需要滿足以下幾個要求

1. 請求方法為： post, get, head
2. 頭部字段滿足CORS安全規(guī)范, Fetch Standard
3. 請求頭的Content-Type為
   text/plain
   multipart/form-data
   application/x-www-form-urlencoded
   簡單請求跨域的CORS解決辦法
4. Access-Control-Allow-Origin: [設(shè)置為request Origin值]
5. Access-Control-Allow-Origin: *

• 非簡單請求,瀏覽器會發(fā)起一個預(yù)檢options方法的請求，檢查是否允許來自當(dāng)前域的請求
  預(yù)檢請求OPTIONS
  Origin: http://my.com
  Access-Control-Request-Method: POST
  Access-Control-Request-Headers: a, b, content-type

Access-Control-Allow-Origin: http://my.com
Access-Control-Allow-Methods: POST
Access-Control-Allow-Headers: a, b, content-type
Access-Control-Max-Age: 86400
通過預(yù)檢請求后發(fā)起簡單請求

為什么需要CORS:

1. 保護服務(wù)器， 有助于減輕服務(wù)器負載和風(fēng)險
2. 保護隱私，CORS限制了敏感數(shù)據(jù)的訪問
3. 安全考慮，防止盜用用戶數(shù)據(jù)或進行CSRF攻擊

如何解決CORS問題

1. 配置Nginx代理
2. 按照CORS工作機制，正確配置相關(guān)表頭和正確的處理預(yù)檢請求
   res.header('Access-Control-Allow-Origin', 'https://example.com') //允許特定域名
3. JSONP