跨域資源共享(CORS)問題解決方案

CORS：Cross-Origin Resource Sharing(跨域資源共享)

CORS被瀏覽器支持的版本狀況以下：Chrome 3+、IE 8+、Firefox 3.5+、Opera 12+、Safari 4+

問題描述：A域中的腳本請求B域中的資源出現這種問題

報錯信息：

XMLHttpRequest cannot load http://localhost:8082/servletdemo/doTest. No 'Access-Control-Allow-Origin' header is present on the requested resource. 

Origin 'http://localhost:8080' is therefore not allowed access.

問題分析：

兩個不一樣的域之間發送請求，瀏覽器出於安全因素考慮，因此不容許這種訪問。

Cross-Origin Resource Sharing (CORS) is a specification that enables truly open access across domain-boundaries. If you serve public content,

please consider using CORS to open it up for universal JavaScript/browser access.

Granting JavaScript clients basic access to your resources simply requires adding one HTTP Response Header, namely:

Access-Control-Allow-Origin: *
Access-Control-Allow-Origin: http://example.com:8080/

問題解決：

如下提供幾種解決方法，根據實際狀況選擇

1、容器層面，影響範圍是容器下的全部webapp應用

in tomcat/conf/web.xml ex:

<filter>
      <filter-name>CorsFilter</filter-name>
　　<filter-class>org.apache.catalina.filters.CorsFilter</filter-class>
</filter>
<filter-mapping>
　　<filter-name>CorsFilter</filter-name>
　　<url-pattern>/*</url-pattern>
</filter-mapping>

ps:這個過濾器只針對apache-tomcat-7.0.41及以上版本。

2、單個應用，只做用於這個項目自己

in webapp/WEB-INF/web.xml
<filter>
　　<filter-name>CorsFilter</filter-name>
　　<filter-class>org.apache.catalina.filters.CorsFilter</filter-class>
</filter>
<filter-mapping>
　　<filter-name>CorsFilter</filter-name>
　　<url-pattern>/*</url-pattern>
</filter-mapping>

3、一組資源層面，做用於指定Filter過濾的所有請求資源

Filter方法代碼 ex:
public void doFilter(ServletRequest request, ServletResponse response, FilterChain chain) throws IOException, ServletException {
　　HttpServletRequest req = (HttpServletRequest) request;
　　HttpServletResponse res = (HttpServletResponse) response;
　　res.addHeader("Access-Control-Allow-Origin", "*");
　　res.addHeader("Access-Control-Allow-Methods", "GET, POST, OPTIONS");
　　res.addHeader("Access-Control-Allow-Headers", "Origin, No-Cache, X-Requested-With, If-Modified-Since, Pragma, Last-Modified, Cache-Control, Expires, 　　Content-Type, X-E4M-With");
　　chain.doFilter(req, res);
}

4、單個資源層面，只針對某一個資源

Servlet方法代碼 ex:
protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
　　response.setHeader("Access-Control-Allow-Origin","*");
　　PrintWriter out = response.getWriter();
　　out.write("{/"key/":/"value/"}");
　　out.flush();
　　out.close();
}

其中spring framework在4.2及以上支持cors註解，可參考https://spring.io/blog/2015/06/08/cors-support-in-spring-framework；

另外一種https://spring.io/guides/gs/rest-service-cors/

5、針對單兵開發，咱們原型maven-Archetype-wepapp提供兩種支持

tomcat7-maven-plugin
<plugin>
　　<groupId>org.apache.tomcat.maven</groupId>
　　<artifactId>tomcat7-maven-plugin</artifactId>
　　<version>2.2</version>
　　<configuration>
　　　　<path>/servletdemo</path>
　　　　<port>8082</port>
　　　　<server>tomcat</server>
　　　　<url>http://localhost:8080/manager/text</url>
　　<!-- Enable CORS -->
　　<tomcatWebXml>src/test/resources/tomcat.web.xml</tomcatWebXml>
　　</configuration>
</plugin>

jetty-maven-plugin
<plugin>
　　<groupId>org.eclipse.jetty</groupId>
　　<artifactId>jetty-maven-plugin</artifactId>
　　<version>9.3.2.v20150730</version>
　　<configuration>
　　　　<scanIntervalSeconds>10</scanIntervalSeconds>
　　<webApp>
　　　　<contextPath>/servletdemo</contextPath>
　　　　<!--Fix file locking problem with jettyrun Enable CORS-->
　　　　<defaultsDescriptor>src/test/resources/jetty.web.xml</defaultsDescriptor>
　　</webApp>
　　<httpConnector>
　　　　<!-- mvn -Djetty.port=8082 jetty:run -->
　　　　<port>8082</port>
　　</httpConnector>
　　</configuration>
<dependencies>
<dependency>
　　<groupId>org.eclipse.jetty</groupId>
　　<artifactId>jetty-servlets</artifactId>
　　<version>9.3.2.v20150730</version>
　　</dependency>
</dependencies>
</plugin>