為什麼會出現跨域問題? 根本原因是同源策略問題,同源策略是由Netscape提出的一個著名的安全策略,它是瀏覽器最核心也最基本的安全功能,現在所有支持JavaScript的瀏覽器都會使用這個策略。 同源 同源是指,域名,協議,端口相同。 跨域 域名,協議,端口有一個不一樣都是跨域,簡單的解釋一下,,你從你從端口號為8000去請求8001的數據就是跨域.如果想解決跨域問題,需要瀏覽器同時支持。 什麼是CORS CORS是一個W3C標準,全稱是”跨域資源共享”(Cross-origin resource sharing),允許瀏覽器向跨源服務器,發出XMLHttpRequest請求,從而克服了AJAX只能同源使用的限制。它通過服務器增加一個特殊的Header[Access-Control-Allow-Origin]來告訴客戶端跨域的限制,如果瀏覽器支持CORS、並且判斷Origin通過的話,就會允許XMLHttpRequest發起跨域請求。 Request Headers(請求頭) Origin表示跨域請求的原始域。Access-Control-Request-Method表示跨域請求的方式。(如GET/POST)Access-Control-Request-Headers表示跨域請求的請求頭信息。 Response headers(響應頭 ) Access-Control-Allow-Origin表示允許哪些原始域進行跨域訪問。(字符數組)Access-Control-Allow-Credentials表示是否允許客戶端獲取用戶憑據。(布爾類型)使用場景:例如現在從瀏覽器發起跨域請求,並且要附帶Cookie信息給服務器。則必須具備兩個條件:1. 瀏覽器端:發送AJAX請求前需設置通信對象XHR的withCredentials 屬性為true。 2.服務器端:設置Access-Control-Allow-Credentials為true。兩個條件缺一不可,否則即使服務器同意發送Cookie,瀏覽器也無法獲取。Access-Control-Allow-Methods表示跨域請求的方式的允許範圍。(例如只授權GET/POST)Access-Control-Allow-Headers表示跨域請求的頭部的允許範圍。Access-Control-Expose-Headers表示暴露哪些頭部信息,並提供給客戶端。(因為基於安全考慮,如果沒有設置額外的暴露,跨域的通信對象XMLHttpRequest只能獲取標準的頭部信息)Access-Control-Max-Age