摘要:引言學(xué)生管理系統(tǒng)昨日正式上線測(cè)試,上線遇到的問(wèn)題不少,但最后都完美解決了。前臺(tái)上線,瀏覽器端訪問(wèn)服務(wù)器卻得到了,查看相關(guān)日志后發(fā)現(xiàn)是訪問(wèn)文件時(shí)遭到了拒絕。不足當(dāng)時(shí)忙著上線,中默認(rèn)也啟用了路由,就以為路由是正統(tǒng)的解決方案。
引言
Alice學(xué)生管理系統(tǒng)昨日正式上線測(cè)試,上線遇到的問(wèn)題不少,但最后都完美解決了。
特此分享,一起爬坑。
項(xiàng)目?jī)?yōu)化 登錄頁(yè)美化原來(lái)的登錄頁(yè)采用的是黑背景,經(jīng)過(guò)大家的充分討論,我們需要換一個(gè)登錄頁(yè),黑背景看著壓抑。
然后就在晨澍和潘佳琦的幫助下開(kāi)始找各種登錄的模板,發(fā)現(xiàn)都特別丑,后來(lái)發(fā)現(xiàn)當(dāng)前系統(tǒng)的登錄風(fēng)格和微信的登錄風(fēng)格很像,順手就抄過(guò)來(lái)了,感覺(jué)效果還不錯(cuò)。
上線問(wèn)題 打包問(wèn)題
前臺(tái)ng build --prod之后,發(fā)現(xiàn)樣式不一致。
期待:
實(shí)際結(jié)果:
查看元素發(fā)現(xiàn)是Bootstrap的樣式在打包之后沒(méi)有了。
后來(lái)發(fā)現(xiàn):黃庭祥在style.less中引用了一個(gè)在線的Bootstrap,打包肯定打不進(jìn)去啊。
引用的所有包,都不能引在線的,需要使用npm安裝。npm install之后的包才能被打包進(jìn)去。
遠(yuǎn)程文件拷貝本地打完包,需要將文件上傳到服務(wù)器,查了一下,需要使用scp命令。
scp:secure copy,安全拷貝,將文件加密傳輸,安全的遠(yuǎn)程文件拷貝命令。
scp -r /Users/panjie/github/yunzhiclub/alice/web/webApp/dist/webApp [email protected]:/root/
將本地打包的webApp目錄上傳到服務(wù)器的/root目錄下。
-r代表目錄,xxx.xxx.xxx.xxx請(qǐng)?zhí)鎿Q成相應(yīng)的服務(wù)器IP地址。
nginx 403前臺(tái)上線,瀏覽器端訪問(wèn)服務(wù)器卻得到了403,查看相關(guān)日志后發(fā)現(xiàn)是nginx訪問(wèn)文件時(shí)遭到了拒絕。
在nginx的配置文件中,有一行配置用戶(hù)的。
原配置是user nginx;,所以啟動(dòng)時(shí)nginx進(jìn)程的用戶(hù)是nginx,但是webApp文件的用戶(hù)所有者是root,所以就403了。
解決方案是把用戶(hù)配置改成root(有權(quán)限的用戶(hù)),然后重新加載配置文件即可。
刷新404問(wèn)題
當(dāng)用戶(hù)訪問(wèn)127.0.0.1:8100時(shí),根據(jù)路由的重定向,""重定向?yàn)?b>"setup"登錄界面。
但是用戶(hù)刷新或直接訪問(wèn)127.0.0.1:8100/setup時(shí),報(bào)404錯(cuò)誤。
猜想,nginx轉(zhuǎn)發(fā)出現(xiàn)了問(wèn)題,應(yīng)該是/轉(zhuǎn)給了Angular,但是把/setup當(dāng)成了文件夾。
這個(gè)只是我的猜測(cè),如果您有什么意見(jiàn),歡迎在評(píng)論區(qū)中指出我的錯(cuò)誤,感激不盡。
華軟就沒(méi)有該類(lèi)問(wèn)題,對(duì)比兩個(gè)項(xiàng)目,發(fā)現(xiàn)華軟中默認(rèn)配置了hash路由。
hash路由特意去官網(wǎng)學(xué)習(xí)了一下hash路由,感覺(jué)應(yīng)該能給大家講明白。
兩個(gè)路由:
127.0.0.1:8100/setup 127.0.0.1:8100/#/setup
普通的路由是不帶#的,hash路由是帶#的。
#號(hào),我們是不是在哪里見(jiàn)過(guò)?大家還記得Spring的官方文檔嗎?
用a標(biāo)簽實(shí)現(xiàn)頁(yè)面內(nèi)跳轉(zhuǎn)。hash路由與之類(lèi)似。
#之后的路由變化不會(huì)被發(fā)送給服務(wù)器,也就是說(shuō):127.0.0.1:8100/setup,后臺(tái)nginx獲取到的路徑是/setup,而使用hash路由,對(duì)于路由127.0.0.1:8100/#/setup,后臺(tái)獲取到的路徑就是/。
注入hash路由策略,即可啟用hash路由。
再訪問(wèn),后臺(tái)獲取到的就是/,然后把angular應(yīng)用返回回來(lái),然后angular應(yīng)用再去處理#之后的路由,不會(huì)出現(xiàn)404。
以上的論述,是我結(jié)合官方文檔和我的經(jīng)驗(yàn)得出的解決,如果有不正確之處,歡迎您批評(píng)指正。
不足當(dāng)時(shí)忙著上線,ng alain中默認(rèn)也啟用了hash路由,就以為hash路由是正統(tǒng)的解決方案。
但是今天看官方文檔,卻看到了這樣的描述:
幾乎所有的Angular項(xiàng)目都會(huì)使用默認(rèn)的HTML 5風(fēng)格。它生成的URL更易于被用戶(hù)理解,它也為將來(lái)做服務(wù)端渲染預(yù)留了空間。
在服務(wù)器端渲染指定的頁(yè)面,是一項(xiàng)可以在該應(yīng)用首次加載時(shí)大幅提升響應(yīng)速度的技術(shù)。那些原本需要十秒甚至更長(zhǎng)時(shí)間加載的應(yīng)用,可以預(yù)先在服務(wù)端渲染好,并在少于一秒的時(shí)間內(nèi)完整呈現(xiàn)在用戶(hù)的設(shè)備上。
默認(rèn)的路由(不帶#)的,支持服務(wù)器端渲染,而hash路由則不支持。除非你有強(qiáng)烈的理由不得不使用hash路由,否則就應(yīng)該堅(jiān)決使用默認(rèn)的HTML 5路由風(fēng)格。
hash路由不推薦,不支持SSR。另外,我覺(jué)得應(yīng)該是當(dāng)前nginx的轉(zhuǎn)發(fā)配置寫(xiě)得不好,以后再研究研究。
總結(jié)對(duì)技術(shù)懷著一顆敬畏之心,努力地尋找著最佳實(shí)踐。
文章版權(quán)歸作者所有,未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請(qǐng)注明本文地址:http://systransis.cn/yun/8105.html
摘要:微信各個(gè)服務(wù)是獨(dú)立的,比較蛋疼,要用紅包功能,首先你需要注冊(cè)一個(gè)微信商戶(hù)平臺(tái)賬號(hào)。首先是微信證書(shū),用的是,與這兩個(gè)。寫(xiě)在最后微信開(kāi)發(fā)者工具挺好用的,服務(wù)號(hào)里把自己加為開(kāi)發(fā)者就能用了。 描述 有時(shí)候產(chǎn)品有這么一些需求,當(dāng)用戶(hù)滿足一定條件時(shí),給他發(fā)一定金額的紅包。 微信各個(gè)服務(wù)是獨(dú)立的,比較蛋疼,要用紅包功能,首先你需要注冊(cè)一個(gè)微信商戶(hù)平臺(tái)賬號(hào)。 代碼位置 分支pay-20160802 微...
摘要:借著這個(gè)需求體會(huì)了下微信開(kāi)發(fā)的兩種不同類(lèi)型非端口的兩種開(kāi)發(fā),以及的一些正確姿勢(shì)。關(guān)于用戶(hù)微信登錄的事情我們通過(guò)已經(jīng)解決了參考我的上一篇博客微信公眾號(hào)開(kāi)發(fā)小記接入三方登錄,所以可以直接用的裝飾器完成這種事情。 描述 假設(shè)的我們的服務(wù)號(hào)有這么一些功能,比如底部有按鈕,點(diǎn)擊會(huì)有一些復(fù)雜的功能,這時(shí)候可能就需要一個(gè)用戶(hù)系統(tǒng),有用戶(hù)系統(tǒng)就經(jīng)常想要做什么分享邀請(qǐng)新用戶(hù)之類(lèi)的,這時(shí)候就又有幾種方式,...
摘要:普通的回調(diào)函數(shù)調(diào)用執(zhí)行后續(xù)邏輯使用了以后的復(fù)雜邏輯獲取到正確的結(jié)果輸出兩個(gè)文件拼接后的內(nèi)容雖說(shuō)解決了的問(wèn)題,不會(huì)出現(xiàn)一個(gè)函數(shù)前邊有二三十個(gè)空格的縮進(jìn)。所以直接使用關(guān)鍵字替換原有的普通回調(diào)函數(shù)即可。 從今年過(guò)完年回來(lái),三月份開(kāi)始,就一直在做重構(gòu)相關(guān)的事情。 就在今天剛剛上線了最新一次的重構(gòu)代碼,希望高峰期安好,接近半年的Node.js代碼重構(gòu)。 包含從callback+async.w...
摘要:在比特幣白皮書(shū)中,有三段話很關(guān)鍵的話,解釋了交易是什么。電子貨幣從所有者轉(zhuǎn)移給下一個(gè)人是通過(guò),所有者使用私鑰,對(duì)交易和下一個(gè)人的公鑰進(jìn)行數(shù)字簽名,并將數(shù)字簽名附在這枚電子貨幣數(shù)字簽名鏈的后面。 在比特幣白皮書(shū)中,有三段話很關(guān)鍵的話,解釋了交易 Transactions 是什么。 雖然數(shù)字簽名(Digital signatures)部分解決了電子現(xiàn)金系統(tǒng)的問(wèn)題,但是仍然需要第三方的支持...
摘要:內(nèi)容列表元組操作字符串操作字典操作集合操作文件操作字符編碼與轉(zhuǎn)碼內(nèi)置函數(shù)在中,最基本的數(shù)據(jù)結(jié)構(gòu)是序列。序列中的每個(gè)元素被分配一個(gè)序號(hào)即元素的位置,也稱(chēng)為索引??兆值洳话ㄈ魏雾?xiàng)由兩個(gè)大括號(hào)組成。 day2內(nèi)容1、列表、元組操作2、字符串操作3、字典操作4、集合操作5、文件操作6、字符編碼與轉(zhuǎn)碼7、內(nèi)置函數(shù) 在Python中,最基本的數(shù)據(jù)結(jié)構(gòu)是序列(sequence)。序列中的每個(gè)元素被...
閱讀 904·2021-11-18 10:02
閱讀 1763·2019-08-30 15:56
閱讀 2595·2019-08-30 13:47
閱讀 2669·2019-08-29 12:43
閱讀 885·2019-08-29 11:19
閱讀 1822·2019-08-28 18:23
閱讀 2698·2019-08-26 12:23
閱讀 3043·2019-08-23 15:29