AJAX跨域访问(从Tomcat8到Apache/Nginx)

时间:2023-03-09 13:42:49
AJAX跨域访问(从Tomcat8到Apache/Nginx)

1.在Tomcat的Root目录下放入如下的文件

apache-tomcat-8.0.12X64\webapps\ROOT

clientaccesspolicy.xml文件

<?xml version="1.0" encoding="utf-8" ?>
<access-policy>
<cross-domain-access>
<policy>
<allow-from http-request-headers="*">
<domain uri="*"/>
</allow-from>
<grant-to>
<resource path="/" include-subpaths="true"/>
</grant-to>
</policy>
</cross-domain-access>
</access-policy>

crossdomain.xml

<?xml version="1.0"?>
<cross-domain-policy>
<allow-access-from domain="*" />
</cross-domain-policy>

2.在项目的web.xml中加入如下的代码

apache-tomcat-8.0.12X64\webapps\test\WEB-INF

web.xml

<?xml version="1.0" encoding="ISO-8859-1"?>

<web-app xmlns="http://java.sun.com/xml/ns/j2ee"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:schemaLocation="http://java.sun.com/xml/ns/j2ee http://java.sun.com/xml/ns/j2ee/web-app_2_4.xsd"
version="2.4">
<display-name></display-name>
<welcome-file-list>
<welcome-file>index.html</welcome-file>
</welcome-file-list> <filter>
<filter-name>CorsFilter</filter-name>
<filter-class>org.apache.catalina.filters.CorsFilter</filter-class>
<init-param>
<param-name>cors.allowed.origins</param-name>
<param-value>*</param-value>
</init-param>
<init-param>
<param-name>cors.allowed.methods</param-name>
<param-value>GET,POST,HEAD,OPTIONS,PUT</param-value>
</init-param>
<init-param>
<param-name>cors.allowed.headers</param-name>
<param-value>Content-Type,X-Requested-With,accept,Origin,Access-Control-Request-Method,Access-Control-Request-Headers</param-value>
</init-param>
<init-param>
<param-name>cors.exposed.headers</param-name>
<param-value>Access-Control-Allow-Origin,Access-Control-Allow-Credentials</param-value>
</init-param>
<init-param>
<param-name>cors.support.credentials</param-name>
<param-value>false</param-value>
</init-param>
<init-param>
<param-name>cors.preflight.maxage</param-name>
<param-value>10</param-value>
</init-param>
</filter>
<filter-mapping>
<filter-name>CorsFilter</filter-name>
<url-pattern>/*</url-pattern>
</filter-mapping>
<!--
<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>
-->
</web-app>

3.在Apache的httpd.conf中取消LoadModule headers_module modules/mod_headers.so 前面的注释

Apache\conf

AJAX跨域访问(从Tomcat8到Apache/Nginx)

4.修改Apache的httpd.conf中<Directory>配置节

Apache\conf

AJAX跨域访问(从Tomcat8到Apache/Nginx)

<Directory "D:/Project/Resource/">
    AllowOverride None   
    Require all granted
    Header set Access-Control-Allow-Origin *
    Header set Access-Control-Allow-Headers "*"
    Header set Access-Control-Allow-Methods "POST, GET, OPTIONS, DELETE, PUT"   
</Directory>

5.修改Nginx的nginx.conf中http{}配置节

nginx-1.8.0\conf

AJAX跨域访问(从Tomcat8到Apache/Nginx)

add_header Access-Control-Allow-Origin *;
add_header Access-Control-Allow-Credentials true;
add_header Access-Control-Allow-Headers *;
add_header Access-Control-Allow-Methods GET,POST,OPTIONS,DELETE,PUT;

------------------------------------------------------------------------------------------------------------------------

在tomcat工程的HTML页面中可以应用AJAX来访问Apache中的数据

//Apache
//var url = http://127.0.0.1/resource/JavaScript/gis/Z_QPF_20140831000000.F060.bin.bz2;
 
//nginx
var url = http://127.0.0.1:8010/Resource/JavaScript/gis/Z_QPF_20140831000000.F060.bin.bz2;
 
 
function loadData()
{
var xhr = new XMLHttpRequest();
if ("withCredentials" in xhr){
xhr.open("get", url, true);
console.log("withCredentials");
} else if (typeof XDomainRequest != "undefined"){
xhr = new XDomainRequest();
xhr.open("get", url);
console.log("XDomainRequest");
} else {
xhr = null;
}
xhr.responseType = "arraybuffer";
xhr.onload = function() {
if (this.status == 200) {
var arrayBuffer = this.response;
//......
}
}
}

6.Spring Boot项目将以下代码加到Application.java中

private CorsConfiguration buildConfig() {
CorsConfiguration corsConfiguration = new CorsConfiguration();
corsConfiguration.addAllowedOrigin("*");
corsConfiguration.addAllowedHeader("*");
corsConfiguration.addAllowedMethod("*");
return corsConfiguration;
} @Bean
public CorsFilter corsFilter() {
UrlBasedCorsConfigurationSource source = new UrlBasedCorsConfigurationSource();
source.registerCorsConfiguration("/**", buildConfig()); // 4
return new CorsFilter(source);
}