Servlet與vue-axios交互跨域問題之Access-Control-Allow-Origin' header contains multiple values '*, null', but only one is allowed.

問題簡述：

　　使用servlet與vue-axios進行前后端交互時，設置好了跨域，其后因考慮到用戶驗證問題，在前端請求時加入了請求頭如下

axios.defaults.headers.common['token'] = sessionStorage.getItem("token");

　　其后，瀏覽器便報出了如下的錯誤

Access to XMLHttpRequest at 'http://127.0.0.1:8081/test' from origin 'null' has been blocked by CORS policy: 
The 'Access-Control-Allow-Origin' header contains multiple values '*, null', but only one is allowed.

　　但是如果去掉添加的token則可以順利通過，雖然報錯的意思比較明顯，但是依舊不明白怎么會有多個值呢？加上網上大多博主的意思也是設置了2次跨域，但是只有一個是允許的，可博主們用了比較厲害的Nginx代理，而我這初學者只用了servlet，頂天了加了一個過濾器（Filter）（曾一度竊喜怎么會有這么厲害的過濾器......），所以應該不存在博主們說的Nginx代理使得過濾器重復的問題。

解決辦法：

　　百思不得其解之下，突然想起好像servlet可以在web.xml中進行跨域設置，檢查了項目下的web.xml，果然在進行過濾器配置的時候，無腦修改了web.xml，如下：

<!--映射過濾器 -->
	<filter-mapping>
		<filter-name>FilterControl</filter-name>
		<!--“/*”表示攔截所有的請求 -->
		<url-pattern>/*</url-pattern>
	</filter-mapping>
	<filter>
		<filter-name>CORS</filter-name>
		<filter-class>com.thetransactioncompany.cors.CORSFilter</filter-class>
	</filter>
	<filter-mapping>
		<filter-name>CORS</filter-name>
		<url-pattern>/*</url-pattern>
	</filter-mapping>

　　注釋掉了下面代碼：

<!-- <filter>
		<filter-name>CORS</filter-name>
		<filter-class>com.thetransactioncompany.cors.CORSFilter</filter-class>
	</filter>
	<filter-mapping>
		<filter-name>CORS</filter-name>
		<url-pattern>/*</url-pattern>
	</filter-mapping>
 -->

　　問題得以解決.......

設置了兩次跨域允許，同時在前端傳入了token。