技術標籤：跨域javanginx後端

一、導致跨域問題的原因

1.前後端服務呼叫的域名不一樣是導致跨域問題最常見的原因。

例如：前端域名test.manager.cn呼叫後端域名testapi.manager.cn或者本地localhost呼叫後端域名testapi.manager.cn都會出現跨域的問題。

2.請求傳參時，傳參錯誤，也是跨域問題最常見的原因。

3.http請求錯寫成https請求，也會導致跨域問題，但是不常見。

遇見跨域問題不要慌，首先要冷靜的分析導致跨域問題的原因，然後來找出解決辦法。

二、解決辦法

解決辦法一：（此方法治標不治本，不推薦使用。）

通過安裝跨域外掛解決跨域問題，先在瀏覽器上安裝谷歌助手再在谷歌瀏覽器上安裝跨域外掛，具體怎樣安裝谷歌助手這裡就不再敘述，以後再祥說。（詳細的就不說了，稽核總是通不過，提示翻了牆，也是醉了。）

解決辦法二：（最常用）

此程式碼可以放在下面三處任意一個地方，我是放在1裡面。

1：可以在過濾器的filter中的dofilter()方法設定。

2：可以在servet的get或者post方法裡面設定。

3：可以放在訪問的jsp頁面第一行。

注意： 一般此處直接使用Origin，不使用“*”。因為客戶端一般情況下都是傳送cookie給伺服器端，所以Access-Control-Allow-Credentials必須為true且只能為true，Access-Control-Allow-Origin也必須指定為Origin。

	@Override
    public void doFilter
 
(ServletRequest request, ServletResponse response, FilterChain chain) throws IOException, ServletException {
    	String origin = ((HttpServletRequest) request).getHeader("Origin");
		((HttpServletResponse) response).setHeader("Access-Control-Allow-Origin", origin);
		((HttpServletResponse)
 
 response).setContentType("application/json;charset=UTF-8");
		((HttpServletResponse) response).setHeader("Access-Control-Allow-Methods", "POST, GET, OPTIONS, DELETE");
		((HttpServletResponse) response).setHeader("Access-Control-Max-Age", "3600");
		((HttpServletResponse) response).setHeader("Access-Control-Allow-Headers", "Origin, No-Cache, X-Requested-With, If-Modified-Since, Pragma, Last-Modified, Cache-Control, Expires, Content-Type, X-E4M-With,userId,token,X-My-Header");//表明伺服器支援的所有頭資訊欄位
		((HttpServletResponse) response).setHeader("Access-Control-Allow-Credentials", "true"); 		//如果要把Cookie發到伺服器，需要指定Access-Control-Allow-Credentials欄位為true;
		((HttpServletResponse) response).setHeader("XDomainRequestAllowed","1");
		((HttpServletResponse) response).setHeader("Access-Control-Max-Age", "1728000");
    	
    	String method = ((HttpServletRequest) request).getMethod();
        if (method.equalsIgnoreCase("OPTIONS")) {
        	response.getOutputStream().write("Success".getBytes("utf-8"));
        } else {
        	chain.doFilter(request, response);
        }
    }

解決辦法三：（不常用）

nginx中解決跨域問題，每個人的nginx安裝的位置都是不一樣，所以你要找到nginx的安裝位置以及配置檔案nginx.conf，我的安裝位置是/www/server/panel/vhost/nginx。

如果不知道怎麼找，可以用WinSCP連線伺服器查詢預設檔案nginx.conf，如果修改過名字，則需要查詢你修改之後的檔名字。也可以使用find / -name nginx.conf在xshell裡面查詢檔案。找到檔案後，開啟nginx.conf檔案，在裡面配置辦法二里面的內容。

因為涉及到nginx的配置問題，以及一些其它的各種原因，導致很多人沒有這個許可權，所以此方法也不是很常用。

add_header 'Access-Control-Allow-Origin' 'Origin';
add_header 'Access-Control-Allow-Methods' 'GET, POST, OPTIONS, PUT, DELETE';
、、、、、、、

三、解決跨域的其它辦法

解決跨域的辦法很多，下面的兩種方法也可以解決跨域問題。我沒有使用過，有興趣的朋友可以嘗試一下。

1.vue前端解決跨域問題
可以參考： https://blog.csdn.net/OrangeChenZ/article/details/86468239

2.java後端使用註解@CrossOrigin解決跨域問題。
可以參考： https://www.mmzsblog.cn/articles/2019/08/23/1566526598886.html

四、一次請求多次跨域問題

問題很明顯，就是在多個地方同時設定了跨域導致的。解決跨域問題，只需要在一個地方設定跨域即可。