前后端分离报跨域问题。

提问 8 3139
漫步清风
漫步清风 2019-10-09
版本:renren-fast 前后端分离 开发环境:chrome
作者您好。我前后端部署的时候报了跨域问题,截图如下: img[//cdn.renren.io/0f2af201910091004019624.png] 后端我是直接java -jar的方式启动的。 前端和后端共用一台物理机,或者说相同的IP,不同的端口。 前端数据我是部署在nginx上,或者tomcat上。这两种方式都试过了,都报错。 tomcat上比较简单了,server.xml中配置了8080端口,webapps下新建了文件夹,放置了dist目录下的文件,后端配置的是9090端口。 config下的index.js截图给你看一下: img[//cdn.renren.io/14f94201910091008373698.png] nginx的配置截图如下,报错是和tomcat相同的: img[//cdn.renren.io/04328201910091011496296.png] 由于我怀疑我的nginx配置是错的,就截取一部分吧。 我前端打包的命令是 run build --prod 我的问题是,有没有前后端部署详细的文档。 我自己的猜测,是不是 // api接口请求地址 window.SITE_CONFIG['baseUrl'] = 'http://10.155.29.249:8080/renren-fast'; 这里已经完成了跨域的设置,nginx其实不用再设置跨域了,或者说nginx的跨域和这里的设置有冲突? 希望能有详细的文档,感谢。
回帖
  • 漫步清风
    2019-10-09
    @Mark 作者您好。 其实我之前怀疑过java -jar 启动,是后端的没设置跨域,导致的问题,但是经过debug发现,前端的请求根本没到后端,是OPTIONS请求的时候,判断是跨域,就没有向下进行了。 难道这是我chrome浏览器的设置问题? 实在搞不懂了。
    0 回复
  • @漫步清风 Nginx不要做跨域处理
    0 回复
  • 漫步清风
    2019-10-09
    @Mark 感谢回复,那其实这样tomcat 和 nginx 是相同的了。 其实说来很奇怪,我之前都没遇到跨域问题,就部署成功了,这次是我自己写的代码升级之后重新部署出现的问题。 我还注意到一个奇怪的现象,就是我的环境验证码是OK的,但是登录请求是失败的。案例验证码也是需要请求后台,也是有跨域的,这和登录按钮的触发事件应该是一回事儿。 希望能再次得到解答。
    0 回复
  • 漫步清风
    2019-10-09
    @Mark 您好,http://demo.renren.io/renren-fast 这个地址报404了,有没有更新好的地址?
    0 回复
  • 漫步清风
    2019-10-09
    @Mark 您好,问题我已经解决了,原来是我后端新增了一个后端静态资源的映射,这段映射没有做cors跨域处理,导致问题。 @Configuration public class ApiTestWebMvcConfig extends WebMvcConfigurationSupport { @Override public void addCorsMappings(CorsRegistry registry) { registry.addMapping("/**") .allowedOrigins("*") .allowedMethods("POST", "GET", "PUT", "OPTIONS", "DELETE") .maxAge(3600) .allowCredentials(true); } 分享一下解决问题的思路: 1. 得到作者回答,nginx不用改跨域之后,我就知道了,不用再调试nginx的配置了,昨天我在这里耗费了大量的时间。 2. 本地部署一个原始纯净的renren-fast环境,发现没有跨域问题,那么问题聚焦在后端代码上。 3. 检查git提交历史,排除所有可疑的代码提交记录,试了几次之后,发现我曾经写的一个静态资源访问的组件,有问题。 4. 查看网络,百度一下,解决问题。 5. 不过,本地debug,vue在前端开发者模式下是没问题的,前后端分离之后,部署在tomcat或者nginx上,才爆出这种问题。也是挺奇怪的,我倾向于理解是vue在部署模式下,校验会多一些。 这里再次感谢作者提供这么好的平台,说实在的,这平台我给二次开发了或者说糅合了一下,后端我没直接用renren-fast,而是把renren-security给糅合了进来,即后端改成maven的组件结构了,这样我新增的代码使用子组件的方式添加进来。JDK升级到了11而不再用8。前端仍然使用2.0的vue。作者之前升级了一下vue的版本号,但是应该还没有升级到3.0吧,希望能够升级到3.0,很期待。 其他做的修改都在原有平台的基础上增减了,没啥了就。我写的代码应该是前后端突破了1W了。 再回到这个问题吧,其实我也了解,自己把平台改了些,遇到问题还是要自己解决,因为自己才是问题的第一发现者。 其实使用平台这么久,也是有点儿想写点儿什么回馈一下社区,所以多写了一些。 以后我也会尝试回答一些问题,回馈社区。再次感谢作者,感谢平台。
    0 回复
  • @漫步清风 感谢支持,演示地址已改成:http://demo.open.renren.io/renren-fast/#/login
    0 回复
  • 老哥有心了
    0 回复
  • 问一下老哥 前后端分离是怎么返回给前端token得
    0 回复