资讯专栏INFORMATION COLUMN

那些年踩过的坑——node代理解决跨域的问题

worldligang / 1015人阅读

摘要:在实际开发中,前后端分离的项目通常会需要同后台开发人员联调接口,不可避免的会碰到跨域的问题。

在实际开发中,前后端分离的项目通常会需要同后台开发人员联调接口,不可避免的会碰到跨域的问题。虽说跨域问题最后基本都是后台同事解决的,但是有时候为了赶时间,没辙只有自己来,使用node代理解决

 跨域:协议 域名 端口号 三个只要有一个不一样就是跨域,也就是不同域名之间的访问;
 通常解决跨域的方法 前端jsonp请求  或者node代理 
 后台配置拦截器或者使用 注解@CrossOrigin(我自己写的基本都是用的整个 配置成*放开所有的请求,反正也是写着玩玩的)
 前端vue全家桶一条龙服务,后台ssm
 首先在vue项目中 在config目录下index.js
  proxyTable: {
  "/api": {    
    target: "http://localhosst:8080/Maybe/",  // 接口域名
    changeOrigin: true,  //是否跨域
  //    pathRewrite: {
 //     "^/api": ""   //需要rewrite的,
 //   }
  }
},
然后将axios的baseURL  设置为"/api" 然后跨域的问题就解决了

( ps:封装axios的时候 记得一定要携带cookie

 axios.defaults.withCredentials=true  //请求携带cookie
 不然后端取到的session也是空的
)
但是这个时候 会出现一个问题 session 丢失的问题,接口是通的,但是后端却取到的session确是空的
解决方法
proxyTable: {
  "/Maybe": {   
    target: "http://localhosst:8080/",  // 接口域名
    changeOrigin: true,  //是否跨域
  //    pathRewrite: {
 //     "^/api": ""   //需要rewrite的,
 //   }
  }
},
注意:代理名要与application context(就是项目名称)相同;跨域changeOrigin: true;RewritePath,
是将对资源的请求重定向到另一路径,使其不同于所请求 URL 指示的路径,根据实际情况看要不要加。

其实真正的session路径在/Maybe下,但是上面这个请求虽然被代理到http://localhosst:8080/Maybe,
很明显的请求http://localhosst:8080/api/Maybe 所携带的cookie在/api路径下面,
在/api路径找/Maybe下cookie肯定是找不到的啦,所以就出现了虽然能访问到接口,但取到的session确是空的。


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

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

相关文章

  • 那些年踩的坑——h5页面在ios端点击高亮闪烁

    摘要:当时碰到过一个问题,页面在端点击的时候,整个页面会高亮的闪烁一下特别明显,被测试狂崔。。。当透明度设为,则会禁用此属性当透明度设为,元素在点击时不可见。 记得那是第一次独自完成一个项目,现在看来,那个项目会很简单的,但那个时候还是挺有成就感的。 当时碰到过一个问题,h5页面在ios端点击的时候,整个页面会高亮的闪烁一下,特别明显,被测试狂崔。。。最后发现是 css样式的问题 加...

    姘搁『 评论0 收藏0
  • 那些年踩的坑——input输入框 ios端 readyonly 点击出现光标

    摘要:输入框加了属性就可以达到只读的效果,但是在端,点击该输入框还是会出现光标解决办法,给输入框加上元 input输入框加了readonly属性就可以达到只读的效果,但是在ios端,点击该输入框还是会出现光标解决办法,给输入框加上 unselectable=on onfocus=this.blur()

    elliott_hu 评论0 收藏0
  • 那些年踩的坑——input输入框 ios端 readyonly 点击出现光标

    摘要:输入框加了属性就可以达到只读的效果,但是在端,点击该输入框还是会出现光标解决办法,给输入框加上元 input输入框加了readonly属性就可以达到只读的效果,但是在ios端,点击该输入框还是会出现光标解决办法,给输入框加上 unselectable=on onfocus=this.blur()

    red_bricks 评论0 收藏0
  • VUE使用中踩的坑

    摘要:前言如今可谓是一匹黑马数已居第一位前端开发对于的使用已经越来越多,它的优点就不做介绍了本篇是我对使用过程中以及对一些社区朋友提问我的问题中做的一些总结帮助大家踩坑。随后的重新渲染,元素组件及其所有的子节点将被视为静态内容并跳过。 前言 vue如今可谓是一匹黑马,github star数已居第一位!前端开发对于vue的使用已经越来越多,它的优点就不做介绍了,本篇是我对vue使用过程中以及...

    big_cat 评论0 收藏0

发表评论

0条评论

worldligang

|高级讲师

TA的文章

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