html文件直接可以瀏覽器打開，為什么很多人選擇本地服務(wù)器localhost打開？有什么不一樣嗎？除了腳本文件，感覺沒必要本地服務(wù)器打開，有什么原因嗎？
2 回答
已采納
new_object_
TA貢獻(xiàn)55條經(jīng)驗(yàn) 獲得超117個(gè)贊
最直接的區(qū)別，很容易注意到，一個(gè)是file協(xié)議，另一個(gè)是http協(xié)議。file協(xié)議更多的是將該請(qǐng)求視為一個(gè)本地資源訪問請(qǐng)求，和你使用資源管理器打開是一樣的，是純粹的請(qǐng)求本地文件。而http請(qǐng)求方式則是通過(guò)假架設(shè)一個(gè)web服務(wù)器，解析http協(xié)議的請(qǐng)求然后向?yàn)g覽器返回資源信息。我們所開發(fā)的html文件最后必定是會(huì)以網(wǎng)頁(yè)的形式部署在服務(wù)器上，通過(guò)http協(xié)議訪問，所以我們開發(fā)中也盡可能模擬線上環(huán)境，架設(shè)本地服務(wù)器，來(lái)避免file協(xié)議與http協(xié)議實(shí)現(xiàn)過(guò)程中的某些差異性，如某些API的差異、跨域請(qǐng)求的差異等。舉個(gè)最容易驗(yàn)證的例子：在頁(yè)面引入一張絕對(duì)路徑的圖片，即'/image/example.png'，然后分別通過(guò)這兩種方式打開頁(yè)面，file協(xié)議會(huì)將資源請(qǐng)求到根路徑，而http協(xié)議雖然也會(huì)請(qǐng)求到根路徑，但是是相對(duì)本地架設(shè)的服務(wù)器的根路徑，一般也就是項(xiàng)目文件夾的路徑。
-
AllySu感覺回答的很專業(yè)，雖然不是很懂，試著按照你說(shuō)的差異去測(cè)試一下，看看有什么發(fā)現(xiàn)
王益達(dá)
TA貢獻(xiàn)12條經(jīng)驗(yàn) 獲得超15個(gè)贊
盡量簡(jiǎn)單解釋，希望能看懂：
是否需要用本地服務(wù)器打開 html 分幾種情況：
html 中是否是純靜態(tài)模板頁(yè)
純靜態(tài)模板頁(yè)指頁(yè)面內(nèi)沒有“請(qǐng)求服務(wù)器”獲取數(shù)據(jù)，展示的是為了布局占位臨時(shí)寫的“假”數(shù)據(jù)。比如，“姓名”、“年齡”，后端數(shù)據(jù)還沒完成，前端先寫模板頁(yè)，隨便寫“姓名： 張三”、“年齡：18”，先把頁(yè)面布局和樣式完成。這個(gè)階段不需要開啟本地服務(wù)器
html?中引用的靜態(tài)資源是否需要構(gòu)建工具打包編譯
比如 js 使用了 ES6 新特性、css 使用了 less 編寫等，這時(shí)可能需要使用 Webpack 等工具進(jìn)行編譯。這時(shí)，一般需要啟動(dòng)一個(gè)本地 node.js 服務(wù)去執(zhí)行編譯和預(yù)覽
?開發(fā)中是否用到“實(shí)時(shí)刷新，同步預(yù)覽”
如果開發(fā)中修改文件不想每次都點(diǎn)擊刷新或按 F5，保存時(shí)自動(dòng)刷新，可以借助一些工具，比如?livereload、browserSync 等。用這些工具，需要啟動(dòng)一個(gè)本地服務(wù)
開發(fā)中是否用到多終端調(diào)試
如果開發(fā)的靜態(tài)頁(yè)面想在某品牌手機(jī)真機(jī)上看顯示效果，調(diào)試兼容性問題，除了最笨的把頁(yè)面和靜態(tài)資源發(fā)送到手機(jī)上，還以可以起一個(gè)本地服務(wù)，電腦與手機(jī)連接到同一 Wifi 下，用手機(jī)訪問本地服務(wù) loalhost 對(duì)應(yīng)的內(nèi)網(wǎng) ip 地址即可
-
AllySu(*@ο@*) 哇～，厲害。。。感覺要學(xué)的還很多啊，前端果然不是切切頁(yè)面那么簡(jiǎn)單。
添加回答
舉報(bào)
0/150
提交
取消