跨域問題及解決方案

ahiru?發表於2018-12-17
跨域

之前學習寫後臺的時候，與前端溝通的時候，前端有一次反映過出現了跨域的問題（實際上沒出現），這勾起了我對跨域這個東西的興趣。因為之前在學校學前端的時候，有一次出現了跨域的問題，慌得不行，所以就決定上網衝浪研究一下跨域這個東西。

跨域問題及解決方案

跨域問題的出現

跨域指的是瀏覽器從一個域名的網頁請求另一個域名時，域名、埠、協議任一不同，都是跨域。

看了一下網上的資料，大概都是說，跨域問題的出現：主要是因為瀏覽器的同源策略。

瀏覽器的同源機制

同源機制是瀏覽器最核心也最基本的安全功能，如果缺少了同源策略，瀏覽器很容易受到XSS、CSFR等攻擊。

前端請求的url必須與瀏覽器的url處於同域，也就是它們兩者的域名、埠、協議必須相同。

同源策略限制以下行為：

  1. Cookie、LocalStorage和IndexDB無法讀取
  2. DOM和JS物件無法獲取
  3. AJAX請求不能傳送

解決方案

在網上看到不少關於跨域的解決方案，在這裡講之前後臺大佬解決跨域問題的方案：

CORS(跨域資源共享)：

在服務端設定Access-Control-Allow-Origin HTTP響應頭部之後，瀏覽器將會允許跨域請求。

@Override
public void doFilter(ServletRequest req, ServletResponse res,
                     FilterChain chain) throws IOException, ServletException {
    HttpServletResponse response = (HttpServletResponse) res;
    response.setHeader("Access-Control-Allow-Origin", "*");
    response.setHeader("Access-Control-Allow-Methods",
            "POST, GET, OPTIONS, DELETE, PUT");
    response.setHeader("Access-Control-Max-Age", "3600");
    response.setHeader("Access-Control-Allow-Headers",
            "Content-Type, x-requested-with, X-Custom-Header, Authorization, token");
    chain.doFilter(req, res);
}複製程式碼


相關文章