资讯专栏INFORMATION COLUMN

关于跨域踩的坑,浏览器 status code为200,但实际上是跨域了

JouyPub / 1747人阅读

摘要:背景后端使用并更改本地文件,起本地服务。使用调用后端接口,要求为格式,并要求在里加一些内容。借用凝雨关于跨域踩坑经验总结

背景

后端使用Nginx并更改本地host文件,起本地服务。将aaa.bbbb.com代理至本地IP地址(10.26.36.156)。
使用$.ajax调用后端restful接口,要求content-type为application/json格式,并要求在request headers里加一些内容。

前端代码:
    $.ajax({
        headers : {
          "Accept": "application/json",
          "Content-Type": "application/json",
          "user-id":"123",
          "ghf-id": "456"
        },
        url: "https://10.26.36.156/aaa/vds/dsg",
        type: "PATCH",
        data: JSON.stringify(data),
        dataType: "json",
        success: function (response) {
           
        },
        error: function (msg) {
          
        }
  })
现象

后端使用postman 可以访问成功
浏览器network抓请求,结果如下,但是代码并没有触发后端的代码断点....
这是为什么呢?

原因

因为host文件的配置,骗过了浏览器,进行了一次options请求,但是对于js引擎来说,这里的ip地址与浏览器的域名不同,所以出现了跨域,因此设置到了Access-Control-Request-Headers里面。

解决方案

方案一:
不走IP(不写绝对路径),而是相对路径
方案二:
将IP地址加入白名单(node js里面是如此,其他语音应该也有相应的)。
借用凝雨关于跨域踩坑经验总结

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/77273.html

相关文章

  • 关于跨域的坑览器 status code200际上跨域

    摘要:背景后端使用并更改本地文件,起本地服务。使用调用后端接口,要求为格式,并要求在里加一些内容。借用凝雨关于跨域踩坑经验总结 背景 后端使用Nginx并更改本地host文件,起本地服务。将aaa.bbbb.com代理至本地IP地址(10.26.36.156)。使用$.ajax调用后端restful接口,要求content-type为application/json格式,并要求在reques...

    neu 评论0 收藏0
  • 关于跨域的坑览器 status code200际上跨域

    摘要:背景后端使用并更改本地文件,起本地服务。使用调用后端接口,要求为格式,并要求在里加一些内容。借用凝雨关于跨域踩坑经验总结 背景 后端使用Nginx并更改本地host文件,起本地服务。将aaa.bbbb.com代理至本地IP地址(10.26.36.156)。使用$.ajax调用后端restful接口,要求content-type为application/json格式,并要求在reques...

    eccozhou 评论0 收藏0
  • 前后端分离下的CAS跨域流程分析

    摘要:这种情况通常发生在反向代理的时候,前端发起请求代理服务器,代理服务器发起请求到,这时候就容易导致域名不一致,请一定要注意这点。 写在最前 前后端分离其实有两类: 开发阶段使用dev-server,生产阶段是打包成静态文件整个放入后端项目中。 开发阶段使用dev-server,生产阶段是打包成静态文件放入单独的静态资源服务器中,如nginx。 这两种方案最大的区别就是生产阶段。由于第...

    ckllj 评论0 收藏0
  • 前后端分离下的CAS跨域流程分析

    摘要:这种情况通常发生在反向代理的时候,前端发起请求代理服务器,代理服务器发起请求到,这时候就容易导致域名不一致,请一定要注意这点。 写在最前 前后端分离其实有两类: 开发阶段使用dev-server,生产阶段是打包成静态文件整个放入后端项目中。 开发阶段使用dev-server,生产阶段是打包成静态文件放入单独的静态资源服务器中,如nginx。 这两种方案最大的区别就是生产阶段。由于第...

    DevTalking 评论0 收藏0

发表评论

0条评论

JouyPub

|高级讲师

TA的文章

阅读更多
最新活动
阅读需要支付1元查看
<