作家
登录

ajax跨域,这应该是最全的解决方案了

作者: 来源: 2017-12-20 09:06:35 阅读 我要评论

  •  
  •         <filter-name>CORS</filter-name
  •  
  •         <url-pattern>/*</url-pattern> 
  •  
  •     </filter-mapping> 
  • 请留意,以上设备文件请放到web.xml的前面,作为第一个filter存在(可以有多个filter的)

    • 第四步:可能的安然募块设备缺点(留意,某些框架中-譬如公司私家框架,有安然募块的,有时刻这些安然募块设备会影响跨域设备,这时刻可以先测验测验封闭它们)

    NET后台设备

    .NET后台设备可以参考如下步调:

    •     第一步:网站设备

    打开控制面板,选择治理对象,选择iis;右键单击本身的网站,选择浏览;打开辟站地点目次,用记事本打开web.config文件添加下述设备信息,重启网站

    请留意,以长进图较老,如不雅设备仍然出问题,可以推敲增长更多的headers许可,比如:

    1. "Access-Control-Allow-Headers":"X-Requested-With,Content-Type,Accept,Origin" 
    • 第二步:其它更多设备,如不雅第一步进行了后,仍然有跨域问题,可能是:
      •  接口中有限制逝世一些请求类型(比如写逝世了POST等),这时刻请去除限 制
      •  接口中,反复设备了Origin:*,请去除即可
      •  IIS办事器中,反复设备了Origin:*,请去除即可

    代劳请求方法解决接口跨域问题

    留意,因为接口代劳是有价值的,所以这个仅是开辟过程中进行的。

    与前面的办法不合,前面CORS是后端解决,而这个主如果前端对接口进行代劳,也就是:

    • 前端ajax请求的是本地接口
    • 本地接口接收到请求后向实际的接口请求数据,然后再将信息返回给前端
    • 一般用node.js即可代劳

    关于若何实现代劳,这里就不重点描述了,办法和多,也不难,根本都是基于node.js的。

    搜刮关键字node.js,代劳请求即可找到一大年夜票的筹划。

    上述已经介绍了跨域的道理以及若何解决,但实际过程中,发明仍然有很多人对比着类似的文档无法解决跨域问题,重要表如今,前端人员不知道什么时刻是跨域问题造成的,什么时刻不是,是以这里稍微介绍下若何分析一个请求是否跨域:

    第一步当然是得知道我们的ajax请求发送了什么数据,接收了什么,做到这一步并不难,也不须要fiddler等对象,仅基于Chrome即可

    • Chrome浏览器打开对应产生ajax的页面,F12打开Dev Tools
    • 发送ajax请求
    • 右侧面板->NetWork->XHR,然后找到刚才的ajax请求,点进去

    示例一(正常的ajax请求)

    上述请求是一个精确的请求,为了便利,我把每一个头域的意思都注解了,我们可以清楚的看到,接口返回的响应头域中,包含了

    1. Access-Control-Allow-Headers: X-Requested-With,Content-Type,Accept 
    2.  
    3. Access-Control-Allow-Methods: Get,Post,Put,OPTIONS 
    4.  
    5. Access-Control-Allow-Origin: * 

    所以浏览器接收到响应时,断定的是精确的请求,天然不会报错,成功的拿到岭锾螃数据。

    示例二(跨域缺点的ajax请求)

    为了便利,我们仍然拿膳绫擎的缺点表示示例举例。

    这个请求中,接口Allow琅绫擎没有包含OPTIONS,所以请求出现了跨域、

    出现这种情况的原因如下:

    • 本次ajax请求是“非简单请求”,所以请求前会发送一次预检请求(OPTIONS)
    • 办事器端后台接口没有许可OPTIONS请求,导致无法找到对应接口地址

    这个请求中,Access-Control-Allow-Origin: *出现了两次,导致了跨域设备没有精确设备,出现了缺点。

    根本上都是如许去分析一个ajax请求,经由过程Chrome就可以知道了发送了什么数据,收到了什么数据,然后再一一比对就知道问题安在了。

    更多跨域缺点根本都是类似的,就是以上三样没有知足(Headers,Allow,Origin),这里不再一一赘述。

    示例三(与跨域无关的ajax请求)

    当然,也并不是所有的ajax请求缺点都与跨域有关,所以请不要混淆,比如以下:


      推荐阅读

      软件系统管控难题已破 CAST智能分析平台引入中国

    【限时免费】岁尾最强一次云计算大年夜会,看传统、社区、互联网企业若何碰撞? 【51CTO.com原创稿件】CISQ董事长兼首席履行官Bill Curtis博士也指出,他曾几回来到中国,致力于推动国际代>>>详细阅读


    本文标题:ajax跨域,这应该是最全的解决方案了

    地址:http://www.17bianji.com/lsqh/39951.html

    关键词: 探索发现

    乐购科技部分新闻及文章转载自互联网,供读者交流和学习,若有涉及作者版权等问题请及时与我们联系,以便更正、删除或按规定办理。感谢所有提供资讯的网站,欢迎各类媒体与乐购科技进行文章共享合作。

    网友点评
    自媒体专栏

    评论

    热度

    精彩导读
    栏目ID=71的表不存在(操作类型=0)