【跨域】Ajax调用 跨域问题

本文主要是介绍【跨域】Ajax调用 跨域问题，希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！

什么是跨域？

同源策略：域名、协议、端口都要相同。
首先什么是跨域，简单地理解就是因为JavaScript同源策略的限制，a.com 域名下的js无法操作b.com或是c.a.com域名下的对象。更详细的说明可以看下表：

因此当我在本机发布一个webservice服务，本机用javascript调用chrome下还是有跨域问题，因为端口不同。

如何解决这个问题：

前端：

ajax，的jsonp方法，但这个方法不适合调用webservice服务，webservice服务都是遵从soap协议的，以xml格式的方式组织数据，因此利用ajax调用webservice服务datatype必须为xml，content-type必须为text/xml，因此不能用这种方法解决跨域问题。（这个方法适用于nodejs发布的http服务，参考另一篇日志）
前端还有好多其他的方法。参考博客是否可以用jsonp完成跨域？ nodejs发布的服务可以。

后端：

即配置服务端，允许来自其他域的访问。采用CORS方法。
CORS介绍

它在维基百科上的定义是：跨域资源共享（CORS ）是一种网络浏览器的技术规范，它为Web服务器定义了一种方式，允许网页从不同的域访问其资源。而这种访问是被同源策略所禁止的。CORS系统定义了一种浏览器和服务器交互的方式来确定是否允许跨域请求。 它是一个妥协，有更大的灵活性，但比起简单地允许所有这些的要求来说更加安全。

而W3C的官方文档目前还是工作草案，但是正在朝着W3C推荐的方向前进。

简言之，CORS就是为了让AJAX可以实现可控的跨域访问而生的。

配置步骤：

1、下载cors-filter-1.7.jar，java-property-utils-1.9.jar这两个库文件，放到C:\Users\Administrator\Workspaces\MyEclipse 8.6\LicanTest\WebRoot\WEB-INF\lib目录下。
2、配置C:\Users\Administrator\Workspaces\MyEclipse 8.6\LicanTest\WebRoot\WEB-INF目录下的web.xml文件
添加如下部分：

  <filter><filter-name>CORS</filter-name><filter-class>com.thetransactioncompany.cors.CORSFilter</filter-class><init-param><param-name>cors.allowOrigin</param-name><param-value>*</param-value></init-param><init-param><param-name>cors.supportedMethods</param-name><param-value>GET, POST, HEAD, PUT, DELETE</param-value></init-param><init-param><param-name>cors.supportedHeaders</param-name><param-value>Accept, Origin, X-Requested-With, Content-Type, Last-Modified</param-value></init-param><init-param><param-name>cors.exposedHeaders</param-name><param-value>Set-Cookie</param-value></init-param><init-param><param-name>cors.supportsCredentials</param-name><param-value>true</param-value></init-param></filter><!--跨域过滤路径  --><filter-mapping><filter-name>CORS</filter-name><url-pattern>/*</url-pattern></filter-mapping>

此时配置好后，重启服务，就可以跨域访问了，chrome下没有问题。

这篇关于【跨域】Ajax调用 跨域问题的文章就介绍到这儿，希望我们推荐的文章对编程师们有所帮助！

---