javascript - 關(guān)于js高級(jí)程序中的問(wèn)題
問(wèn)題描述
我在看到j(luò)avascript高級(jí)程序設(shè)計(jì)(第三版)第492頁(yè)的時(shí)候,有個(gè)疑問(wèn)
當(dāng)我用了'假'URL以后,刷新了,會(huì)返回404錯(cuò)誤,除非我在Web服務(wù)器上有個(gè)真的這樣的鏈接,那用戶難免去刷新頁(yè)面,難道我真的要去搞一個(gè)真的文件對(duì)應(yīng)真的鏈接.那還要這個(gè)pushState()有什么用,豈不是很不方便嗎
問(wèn)題解答
回答1:pushState主要用在SPA應(yīng)用中, 回答題主的問(wèn)題:
出現(xiàn)404。這是因?yàn)镻ushState模式下的URL里面沒(méi)有#,瀏覽器會(huì)真的向服務(wù)端發(fā)起一個(gè)請(qǐng)求,而我們?cè)诜?wù)端并沒(méi)有對(duì)應(yīng)于這個(gè)路徑的資源。
但是并不需要在服務(wù)器上有一個(gè)真鏈接(會(huì)把人累死), 只需要更改一下服務(wù)器的配置, 讓不存在的頁(yè)面(404)重定向到根路由即可.
以Tomcat為例,配置非常簡(jiǎn)單,只要在你的項(xiàng)目的web.xml里面加上以下配置就可以了:
<error-page><error-code>404</error-code><location>/</location> </error-page>
這樣一來(lái),對(duì)于找不到資源的路徑,Tomcat會(huì)全部重定向到根路徑上去,這樣你的前端框架不論是angular/vue/react/backbone 就可以在前端自己處理請(qǐng)求的URL了。
對(duì)于其它類型的服務(wù)端,例如nginx/apache/IIS,請(qǐng)參考這篇文檔:https://github.com/angular-ui...
來(lái)源: https://my.oschina.net/mumu/b...
回答2:按刷新會(huì)以當(dāng)前瀏覽器的url發(fā)請(qǐng)求到服務(wù)器。
例如你通過(guò)pushState()把當(dāng)前地址變成 boomshaklaka.com/boom點(diǎn)刷新后服務(wù)器收到這個(gè)地址發(fā)現(xiàn)不存在會(huì)返回404的。
回答3:首先你要理解前端路由跟后端路由的區(qū)別。
在只有后端路由的情況下,你請(qǐng)求的所有頁(yè)面都是由后端返回給你的,這時(shí)所有路由都是由后端控制。
但有時(shí)侯我們不希望刷新頁(yè)面,但url也想它改變,比如SPA應(yīng)用。這時(shí)候我們就需要一個(gè)前端路由,這個(gè)pushState在這就起這個(gè)作用。
回答4:
首先我還是習(xí)慣后臺(tái)處理路由, 我就以后臺(tái)路由舉例子:
首先url 可以任意去定義, 至于你想關(guān)聯(lián)項(xiàng)目中的哪個(gè)文件, 任意
<action name='index'> <result>xxx/index.jsp</result></action><action name='login'> <result>xxx/index.jsp</result></action>
可以由不同的action指向同一個(gè)頁(yè)面, 所以你的網(wǎng)站要至少保證有一個(gè)頁(yè)面吧
其次:
在 HTML 文件中, history.pushState() 方法向?yàn)g覽器歷史添加了一個(gè)狀態(tài)。
更多是用來(lái)設(shè)置一個(gè)錨點(diǎn):
window.location = '#foo';
至于文中說(shuō)的404還是因?yàn)槁酚傻闹赶蛴袉?wèn)題, 沒(méi)有找到資源.
相關(guān)文章:
1. docker綁定了nginx端口 外部訪問(wèn)不到2. 前端 - html5 audio不能播放3. javascript - 最近用echarts做統(tǒng)計(jì)圖時(shí)遇到兩個(gè)問(wèn)題??!4. javascript - 深夜被問(wèn)題困擾求解惑,rn的API之PermissionsAndroidd的問(wèn)題5. mysql - 我的myeclipse一直連顯示數(shù)據(jù)庫(kù)連接失敗,不知道為什么6. redis sentinel怎么跑守護(hù)進(jìn)程以及日志記錄位置的?7. android權(quán)限被第三方安全軟件禁止,如何獲取該權(quán)限狀態(tài)8. android - 優(yōu)酷的安卓及蘋果app還在使用flash技術(shù)嗎?9. 利用百度地圖API定位及附件商家信息服務(wù)10. nginx - ssl加密訪問(wèn)證書不受信任

網(wǎng)公網(wǎng)安備