create react app 项目部署在Spring(Tomcat)项目…

   网上看了许多，大多数都是nginx做成静态项目，但是这样局限性太多，与Web项目相比许多服务端想做的验证都很麻烦，于是开始了艰难的探索之路，终于在不经意间试出来了，一把辛酸。。。

   正常的打包就不说了。至于package.json里面这个hompage的参数，无所谓，最后没有用到。项目用的库就是这些，react-router4，新的路由~

 

看下打包出来的项目：  相比一下其他方式（做后台出家的，前端那一堆复杂的打包方法没用过~）大同小异，直接使用脚手架确实方便，

    改了下生成js的名字，生成的每次都要加几个随机的字符。

      

首先看下路由，就是这样

---

 

 

接下来，讲重点！！

　　Spring的@RequestMapping与Reat-Router4路由结合，这里也是最蛋疼的地方。

①如果是想要返回页面这种，比如{indexUrl}，实际值是/wechat/index，

      那么在Spring里面，RequestMapping 要一样！要一样！要一样！说3遍

  

　　什么，你说路径里包含了项目的名字，比如这个项目叫 health ，

　　　　那你就等着打开 http://localhost:8080/health/wechat/index 的时候GG吧，

　　赶紧拿nginx做个反向代理，反正你访问的路径只能是 http://{nginx配置的域名}/wechat/index，

　　相当于就是说的根路径，跟拿nginx做静态服务器的那种一样，要根目录访问。这样一来，React-router的路由才和你重叠了，

　　感觉就像写CSS欺骗人一样，明明这2货没啥联系，八竿子挨不着，结果实际的显示效果这2人竟然合体了......

　　这个时候返回页面就交给Spring了，把打包的html改成jsp，jsp哟，这下想往页面里丢什么参数都好办了

　　

      然后呢，然后就没有了。接下来的路由管理就交给React-Router4了，/add 和 /submit 现在都是由路由来响应了，Spring里面就没有RequestMapping了。

　　当然，你应该知道通过React-Router过去的页面，点击浏览器的刷新是要404的，这个就不解释了。

---

 

②实际项目中也还是会有通过浏览器路径跳转的，这个时候也有些蛋疼的时候，比如注册页面完成跳转到index页面。

　　那么只好写多个路由打包了...这个有点蛋疼，把需要额外@RequestMapping返回的页面，同上面的方式打包

　　打个包

      又打个包

 

③接口，这个加个跨域的处理就行~

 

标签：

版权申明：本站文章部分自网络，如有侵权，请联系：west999com@outlook.com
特别注意：本站所有转载文章言论不代表本站观点，本站所提供的摄影照片，插画，设计作品，如需使用，请与原作者联系，版权归原作者所有