浏览器使用的chrome,安装了cors插件(开启允许跨域请求)

然后访问远程服务器提供的服务的时候,浏览器console 输出如下形式的错误信息:

问题1.OPTION: xxxxxx url地址

问题2.XMLHttpRequest cannot load :xxxxx url 地址

Request header field xxxx is not allowed by Access-Control-Allow-Headers

----------

OPTIONS方法是用于请求获得由Request-URI标识的资源在请求/响应的通信过程中可以使用的功能选项。

通过这个方法,客户端可以在采取具体资源请求之前,决定对该资源采取何种必要措施,或者了解服务器的性能。

如果想详细了解ajax跨域请求,可以参考这位作者的三篇文章,It's awesome!

详解AJAX跨域请求:

http://blog.csdn.net/net_lover/article/details/5172509

http://blog.csdn.net/net_lover/article/details/5172522

http://blog.csdn.net/net_lover/article/details/5172532

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

浏览器在发送真正的http请求之前会发送OPTION类型的请求,执行预检,检查服务器支持的请求类型,

对请求头允许的特殊说明,得到服务器的批准,允许才发送实际的请求,服务器也可以向浏览器发送通知,

知会浏览器是否需要在请求中向服务器传递某些认证信息(cookie,或者Authentication认证数据),

下面的图形象描述了这个过程:

来自维基百科:https://en.wikipedia.org/wiki/Cross-origin_resource_sharing

别的不多说,就是说我们需要在服务器端允许,OPTION 类型的请求,可以解决问题1;

在服务器端设置允许的 源、请求头包含信息、允许的方法,deviceName,deviceID  是我的项目需要的,根据您的需要去设置,

'Access-Control-Allow-Origin': '*',

'Access-Control-Allow-Headers': 'Origin, X-Requested-With, Content-Type, Accept,deviceName,deviceID',

'Access-Control-Allow-Methods': 'GET, POST, PUT',

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

spring中的设置方法:

web.xml中做如下配置:

<security-constraint>    <web-resource-collection>    <url-pattern>/*</url-pattern>    <http-method>PUT</http-method>    <http-method>DELETE</http-method>    <http-method>HEAD</http-method>    <!--<http-method>OPTIONS</http-method>-->  <!-- 注意需要去掉的就是这行,解决问题1 -->  <http-method>TRACE</http-method>    </web-resource-collection>    <auth-constraint>    </auth-constraint>
</security-constraint>
<login-config>    <auth-method>BASIC</auth-method>
</login-config> 

  <!-- rest cors request filter 解决问题2--><filter><display-name>RequestHeaderFilter</display-name><filter-name>RequestHeaderFilter</filter-name><filter-class>com.xxx.filter.RequestHeaderFilter</filter-class></filter><filter-mapping><filter-name>RequestHeaderFilter</filter-name><url-pattern>/*</url-pattern></filter-mapping>

新增一个RequestHeaderFilter:

public final class RequestHeaderFilter implements Filter {/*** Default constructor.*/public RequestHeaderFilter() {}/*** @see Filter#destroy()*/public void destroy() {}/*** @see Filter#doFilter(ServletRequest, ServletResponse, FilterChain)*/public void doFilter(ServletRequest request, ServletResponse response,FilterChain chain) throws IOException, ServletException {// 设置允许跨域访问HttpServletResponse httpServletResponse = (HttpServletResponse)response;httpServletResponse.setHeader("Access-Control-Allow-Origin", "*");// 允许 header中包括 deviceName,deviceIDhttpServletResponse.setHeader("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept,deviceName,deviceID");chain.doFilter(request, httpServletResponse);}/*** @see Filter#init(FilterConfig)*/public void init(FilterConfig fConfig) throws ServletException {}}

至此,配置修改完毕,it works great.

不过,最后提醒一句:以上方式只是在开发测试的时候,为了方便才这么做的,安全原因,生产环境强烈不推荐。

谢谢大家~

转载于:https://www.cnblogs.com/mengyehongmanshan/p/5670904.html

用springmvc 开发为 app 提供后台服务遇到跨域请求的问题相关推荐

  1. SpringBoot中通过重写WebMvcConfigurer的addCorsMapping方法实现后台服务解决跨域问题

    场景 之所以会跨域,是因为受到了同源策略的限制,同源策略要求源相同才能正常进行通信,即协议.域名.端口号都完全一致. 浏览器出于安全的考虑,使用 XMLHttpRequest对象发起 HTTP请求时必 ...

  2. SharePoint 2013 APP 开发示例 (六)服务端跨域访问 Web Service (REST API)

    上个示例(SharePoint 2013 APP 开发示例 (五)跨域访问 Web Service (REST API))是基于JavaScript,运行在web browser内去访问REST AP ...

  3. java服务允许跨域请求配置

    web.xml配置信息: <filter><filter-name>CrossFilter</filter-name><filter-class>com ...

  4. 一键部署开箱即用的代理服务器,解决 SAP UI5 应用开发过程中访问远端 OData 服务的跨域问题试读版

    一套适合 SAP UI5 初学者循序渐进的学习教程 作者简介 Jerry Wang,2007 年从电子科技大学计算机专业硕士毕业后加入 SAP 成都研究院工作至今.Jerry 是 SAP 社区导师,S ...

  5. 魔坊APP项目-17-种植园,商城页面、服务端提供商品api,解决App打包编译以后的跨域限制、客户端获取商品列表并进行展示,集成Alipayplus模块完成支付

    种植园 一.商城页面 orchard.html,代码: <!DOCTYPE html> <html> <head><title>用户中心</tit ...

  6. 移动端App与后台服务的对接方案

    由于项目需要,抽时间整理了下移动端App与后台服务的对接方案,大致方案有如下三种,如有不正之处,欢迎批评指正. 1. 方案一 优点: 1) 模块划分清晰,模块间相互独立,互不影响: 缺点: 1)移动端 ...

  7. Android设计开发 答题app 安卓+后台Java+数据库mysql

    Android设计开发 答题app 安卓+后台Java+数据库mysql 基于安卓设计开发答题系统界面简洁大方 有用户注册,登录模块 主页,答题,选择答案,提交答案等模块 程序已经调试完成,包括前端安 ...

  8. proxy跨域不生效_前端开发:深入使用proxy代理解决跨域问题

    在前端领域里面,跨域指的是浏览器允许向服务器发送跨域请求,进而克服Ajax只能同源使用的局限性限制.同源策略是一种约定,而且是浏览器中最基本也是最核心的安全功能,若缺少了该策略,浏览器非常容易被*** ...

  9. jQuery中的ajax、jquery中ajax全局事件、load实现页面无刷新局部加载、ajax跨域请求jsonp、利用formData对象向服务端异步发送二进制数据,表单序列化(异步获取表单内容)

    jQuery中使用ajax: 在jQuery中使用ajax首先需要引入jQuery包,其引入方式可以采用网络资源,也可以下载包到项目文件中,这里推荐下载包到文件中:市面上有多个版本的jQuery库,这 ...

最新文章

  1. python数据分析的主要流程-Python数据分析全流程实操指南
  2. Android程序签名打包 什么是签名,有什么用:
  3. 原作者出局,Faker.js已被社区控制
  4. 跨库多维分析后台的实现
  5. How product extension field is involved in search scenario
  6. 通过字符串的方式读取文件的内容
  7. pytorch微调bert_小版BERT也能出奇迹:最火的预训练语言库探索小巧之路
  8. java文件重命名失败问题
  9. rails 调用php函数_潜藏在PHP安全的边缘——浅谈PHP反序列化漏洞
  10. android 登录qq接口开发,三方登录-QQ登录开发-Android(as版本)
  11. 熊猫烧香完整的病毒源代码
  12. ykhmi是什么触摸屏软件_YKHMI 中达优控7寸一体机兼容台达ES2
  13. Spring源码解析【完整版】--【bilibili地址:https://www.bilibili.com/video/BV1oW41167AV】
  14. 互联网时代的企业管理模式
  15. android编译集成dialer应用,Comet Android Dialer
  16. 这次彻底搞懂 Promise(手写源码多注释篇)
  17. Python根据Excel名单实现文件夹下文件批量改名
  18. 如何检测是否安装了.NET 2.0和.NET 3.0
  19. 计算机网络实验报告tcp,TCP 计算机网络实验报告
  20. 天津海河英才学历型三无调档落户具体流程

热门文章

  1. 360脱壳-native函数还原笔记-2017-06-25
  2. Android内存分析
  3. 2017c 语言程序设计,C语言程序设计第一次作业(2017.10.10完成)
  4. 积性函数与Dirichlet卷积 学习小记
  5. 空间数据挖掘技术理论及方法
  6. ECCV 2020 《Propagating Over Phrase Relations for One-Stage Visual Grounding》论文笔记
  7. 线段树什么的最讨厌了
  8. Codeforces 1326F Wise Men (容斥原理、状压 DP、划分数)
  9. mysql分页limit运算,MySQL的limit分页查询及性能问题
  10. python测试网站功能_Python检测网站链接是否已存在