怎样解决js读取xml文件跨域问题

JavaScript07

怎样解决js读取xml文件跨域问题,第1张

js读取xml文件跨域 问题,可以使用以下几种方法:

1 通过jsonp跨域 : 在js中,我们直接用XMLHttpRequest请求不同域上的数据时,是不可以的。但是,在页面上引入不同域上的js脚本文件却是可以的,jsonp正是利用这个特性来实现的。代码如下:

2  通过修改document.domain来跨子域:有一个页面,它的地址是http://www.example.com/a.html  , 在这个页面里面有一个iframe,它的src是http://example.com/b.html, 很显然,这个页面与它里面的iframe框架是不同域的 ;document.domain就可以派上用场了,我们只要把http://www.example.com/a.html 和 http://example.com/b.html这两个页面的document.domain都设成相同的域名就可以了

3 使用window.name来进行跨域 : 每个页面对window.name都有读写的权限,window.name是持久存在一个窗口载入过的所有页面

1、CORS的原理:CORS定义一种跨域访问的机制,可以让AJAX实现跨域访问。CORS 允许一个域上的网络应用向另一个域提交跨域 AJAX 请求。实现此功能非常简单,只需由服务器发送一个响应标头即可。

2、tomcat如何配置cors的跨域请求: 

在tomcat中,有一个和cors相关的拦截器:CORS Filter

该过滤器可以通过添加必需的访问控制请求头Access-Control-*对象来进行跨域。同时还可以对一些请求进行拦截。如果请求是无效的,或者是不被允许的,该请求被拒绝或者禁止。 

其在web.xml文件中的基本配置如下:

<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>

                http://localhost:8080,

                https://localhost:8443

            </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,Access-Control-Allow-Origin

            </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>true</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>/wxrefund/*</url-pattern>

    </filter-mapping>

3、cors.allowed.origins:允许访问资源的源列表。*表示任何来源都可以访问该资源。否则,只有配置的白名单的来源可以访问该资源,其中白名单用逗号隔开,如http://localhost:8080,https://localhost:8443。

4、cors.allowed.methods:允许访问的http请求方法,如GET,POST,HEAD,OPTIONS,PUT等,方法名用逗号隔开。

5、cors.allowed.headers:在实际请求时可使用的请求头列表,用逗号隔开。如Content-Type,X-Requested-With,accept,Origin,Access-Control-Request-Method,Access-Control-Request-Headers,Access-Control-Allow-Origin。这些头也将返回作为访问控制的一部分。