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返回的頁面,同上面的方式打包

  打個包

      又打個包

 

③接口,這個加個跨域的處理就行~

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM