跨域三種方式

 

1、什麼是跨域，跨哪些域

　　協議（http、https）   域名（ip）   端口號（80、8080）

 

2、先後端分離爲何要跨域

　　若是先後端沒分離那麼都在同一個服務器中，請求協議、域名以及端口一致天然不存在跨域問題

　　先後臺分離以後先後臺有可能分開部署，也有可能使用不一樣端口，會存在跨域問題

 

3、跨域其實是瀏覽器級別的限制

　　咱們在發出請求以及獲取響應的時候其實是成功了，可是因爲瀏覽器作了攔截處理，因此沒法獲取數據

 

 

4、跨域知道的有三種        

一、jsonp    只能適用get請求

    $.ajax({

                     url: "http://localhost:8080/aaaaa",

                     type: "GET",

                     dataType: "jsonp", //指定服務器返回的數據類型

                     success: function (data) {

                         alert(「success」);

                     }

                 })

二、添加<meta http-equiv="Access-Control-Allow-Origin" content="*" />    只能適用同一個域

 

 

三、cors（Cross-origin resource sharing），，，從服務端設置跨域信息            能夠支持get、post、head、delete請求類型

　　注意在發起delete請求的時候會先詢問服務器是否支持delete請求，若是不支持的話會發送options請求，也叫作Preflight請求。

　　添加服務器支持delete請求：add_header 'Access-Control-Allow-Methods' 'DELETE';

 

　　

須要設置：

   　　 Access-Control-Allow-Origin（必含） – 容許的域名，只能填通配符或者單域名

　　　Access-Control-Allow-Methods（必含） – 這容許跨域請求的http方法（常見有POST、GET、OPTIONS）

 　　  Access-Control-Allow-Headers（當預請求中包含Access-Control-Request-Headers時必須包含） – 這是對預請求當中Access-Control-Request-Headers的回覆，和上面同樣是以逗號分隔的列表，能夠返回全部支持的頭部。

          Access-Control-Allow-Credentials（可選） – 該項標誌着請求當中是否包含cookies信息，只有一個可選值：true（必爲小寫）。若是不包含cookies，請略去該項，而不是填寫false。這一項與XmlHttpRequest2對象當中的withCredentials屬性應保持一致，即withCredentials爲true時該項也爲true；withCredentials爲false時，省略該項不寫。反之則致使請求失敗。

          Access-Control-Max-Age（可選） – 以秒爲單位的緩存時間。預請求的的發送並不是免費午飯，容許時應當儘量緩存。

簡潔版工具類，並不適合生產環境

import java.io.IOException;

import javax.servlet.FilterChain;
import javax.servlet.ServletException;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

import org.springframework.web.filter.OncePerRequestFilter;

/**
 * 無需配置，跨全部域，可用於測試，生產環境建議使用校驗完整的過濾器
 */
public class CORSFilterEasy extends OncePerRequestFilter{


    protected void doFilterInternal(HttpServletRequest request, HttpServletResponse response, FilterChain filterChain) throws ServletException, IOException {
        response.addHeader("Access-Control-Allow-Origin", "*");

        if(request.getHeader("Access-Control-Request-Method") != null && "OPTIONS".equals(request.getMethod())) {
            response.addHeader("Access-Control-Allow-Methods", "HEAD,GET,POST,PUT,DELETE,OPTIONS");
            response.addHeader("Access-Control-Allow-Headers", "Content-Type,Origin,Accept");
            response.addHeader("Access-Control-Max-Age", "120");
        }

        filterChain.doFilter(request, response);
    }
}

 

  

配置web.xml

　　 <!-- 請求源過濾 -->
    <filter>
        <filter-name>cors</filter-name>
        <filter-class>common.filter.CORSFilterEasy</filter-class>        
     </filter>    
        <filter-mapping>
        <filter-name>cors</filter-name>
        <url-pattern>/*</url-pattern>
    </filter-mapping>