-
讓品牌有溫度、有情感
專注品牌策劃15年
-
當(dāng)前位置：首頁 > 創(chuàng)意學(xué)院 > 技術(shù) > 專題列表 > 正文
瀏覽器訪問網(wǎng)站的流程（瀏覽器訪問網(wǎng)站的基本流程）
發(fā)布時間：2023-04-14 05:06:35
稿源：
創(chuàng)意嶺 閱讀：
130
大家好！今天讓創(chuàng)意嶺的小編來大家介紹下關(guān)于瀏覽器訪問網(wǎng)站的流程的問題，以下是小編對此問題的歸納整理，讓我們一起來看看吧。
開始之前先推薦一個非常厲害的Ai人工智能工具，一鍵生成原創(chuàng)文章、方案、文案、工作計劃、工作報告、論文、代碼、作文、做題和對話答疑等等
只需要輸入關(guān)鍵詞，就能返回你想要的內(nèi)容，越精準(zhǔn)，寫出的就越詳細(xì)，有微信小程序端、在線網(wǎng)頁版、PC客戶端
官網(wǎng)：https://ai.de1919.com。
創(chuàng)意嶺作為行業(yè)內(nèi)優(yōu)秀的企業(yè)，服務(wù)客戶遍布全球各地，如需了解SEO相關(guān)業(yè)務(wù)請撥打電話175-8598-2043，或添加微信：1454722008
本文目錄:
站的流程（瀏覽器訪問網(wǎng)站的基本流程）.jpg)
一、已知域名和訪問端口怎么訪問
每次進(jìn)入自己的網(wǎng)站都要輸入端口號，很不舒服。于是今天查了一下，怎么用域名直接訪問自己的網(wǎng)站。
帶端口和項目名稱的訪問方式如下：
例如：www.xxx.com:8080/項目名
純域名訪問解決方法：
在服務(wù)器的conf目錄下找到server.xml 將訪問端口改為瀏覽器默認(rèn)訪問端口80
<Connector executor="tomcatThreadPool"
port="80" protocol="HTTP/1.1"
connectionTimeout="20000"
redirectPort="8443" />
登錄后復(fù)制
將port 的值改為80
2.直接訪問文件
依舊是tomact里conf/sever.xml文件
在host標(biāo)簽里加上如下配置：
<Context path="" docBase="C:\soft\idea\idea\apache-tomcat-8.5.47\webapps\項目名" debug="0" reloadable="true" />
登錄后復(fù)制
注：此處docBase的值為你本機(jī)tomact的路徑
下圖為我的電腦的配置：
最后重啟tomact，OK成功了
我是樂樂呀，感謝您的閱讀。如果您覺得不錯，那就點個贊吧，您的支持是我最大的動力。謝謝
http
tomcat
江詩丹頓名表維修,專業(yè)技術(shù),正品配件更換
精選推薦
廣告

瀏覽器通過網(wǎng)路域名訪問網(wǎng)址過程
1175閱讀·0評論·0點贊
2020年8月25日
將域名直接映射到網(wǎng)站首頁（通過域名即可訪問網(wǎng)站首頁）
1.8W閱讀·11評論·2點贊
2018年11月28日
【免費】多種方法手把手教你如何將自己做的網(wǎng)頁做成網(wǎng)絡(luò)鏈接（直接訪問）
8408閱讀·65評論·121點贊
2022年11月13日
域名直接訪問web首頁
2905閱讀·0評論·0點贊
2019年3月17日
瀏覽器輸入域名訪問全流程解析
4514閱讀·1評論·4點贊
2021年8月12日
域名訪問網(wǎng)站首頁的一種簡單方式
1824閱讀·0評論·2點贊
2017年4月13日
使用域名訪問網(wǎng)站或者靜態(tài)頁面
5390閱讀·0評論·0點贊
2022年8月9日
怎樣才能使用域名訪問網(wǎng)站？
2.3W閱讀·0評論·5點贊
2022年3月1日
可以直接訪問網(wǎng)址“glgoo.com”或“scholar.glgoo.com”便可以直接打開谷歌或谷歌學(xué)術(shù)
2545閱讀·0評論·0點贊
2018年11月26日
各大搜索引擎網(wǎng)站登錄入口
654閱讀·0評論·0點贊
2007年10月3日
使用域名訪問服務(wù)器網(wǎng)站,使用域名訪問網(wǎng)站是啥意思
3534閱讀·0評論·1點贊
2021年8月4日
域名訪問和ip訪問區(qū)別
8674閱讀·0評論·1點贊
2019年9月26日
如果通過訪問域名就能訪問到網(wǎng)站首頁
1295閱讀·0評論·0點贊
2019年7月11日
網(wǎng)站域名訪問
685閱讀·0評論·0點贊
2022年4月21日
最實用的上網(wǎng)網(wǎng)址一覽表
3016閱讀·0評論·0點贊
2022年2月14日
如何直接通過域名訪問頁面，無需添加端口號（nginx反向代理實現(xiàn)直接域名訪問）
1.3W閱讀·16評論·15點贊
2021年11月3日
域名指向主機(jī)IP地址，通過域名:8080才能訪問網(wǎng)站，去掉后面的8080；或者其他的端口號，直接使用域名訪問網(wǎng)站
二、最全從輸入URL到瀏覽器顯示頁面都發(fā)生了什么前端瀏覽器渲染流程
首先了解一下URL的組成：
從上面的URL可以看出，一個完整的URL包括以下幾部分：
1、協(xié)議部分：該URL的協(xié)議部分為“http：”，這代表網(wǎng)頁使用的是HTTP協(xié)議。在Internet中可以使用多種協(xié)議，如HTTP，F(xiàn)TP等等本例中使用的是HTTP協(xié)議。在"HTTP"后面的“//”為分隔符
2、域名部分：該URL的域名部分為“www.baidu.com”。一個URL中，也可以使用IP地址作為域名使用
3、端口部分：跟在域名后面的是端口，域名和端口之間使用“:”作為分隔符。端口不是一個URL必須的部分，如果省略端口部分，將采用默認(rèn)端口80
4、虛擬目錄部分：從域名后的第一個“/”開始到最后一個“/”為止，是虛擬目錄部分。虛擬目錄也不是一個URL必須的部分。本例中的虛擬目錄是“/news/”
5、文件名部分：從域名后的最后一個“/”開始到“？”為止，是文件名部分，如果沒有“?”,則是從域名后的最后一個“/”開始到“#”為止，是文件部分，如果沒有“？”和“#”，那么從域名后的最后一個“/”開始到結(jié)束，都是文件名部分。本例中的文件名是“index.asp”。文件名部分也不是一個URL必須的部分，如果省略該部分，則使用默認(rèn)的文件名
6、錨部分：從“#”開始到最后，都是錨部分。本例中的錨部分是“name”。錨部分也不是一個URL必須的部分
7、參數(shù)部分：從“？”開始到“#”為止之間的部分為參數(shù)部分，又稱搜索部分、查詢部分。本例中的參數(shù)部分為“boardID=5&ID=24618&page=1”。參數(shù)可以允許有多個參數(shù)，參數(shù)與參數(shù)之間用“&”作為分隔符。
很多大公司面試喜歡問這樣一道面試題， 輸入URL到看見頁面發(fā)生了什么？ ,今天我們來總結(jié)一下。 簡單來說，共有以下幾個過程
下面我們來看看具體的細(xì)節(jié)
輸入 www.google.com 網(wǎng)址后，首先在本地的域名服務(wù)器中查找，沒找到去根域名服務(wù)器查找，沒有再去 com 頂級域名服務(wù)器查找，，如此的類推下去，直到找到IP地址，然后把它記錄在本地，供下次使用。大致過程就是 . -> .com -> google.com. -> www.google.com. 。 (你可能覺得我多寫 .，并木有，這個.對應(yīng)的就是根域名服務(wù)器，默認(rèn)情況下所有的網(wǎng)址的最后一位都是.，既然是默認(rèn)情況下，為了方便用戶，通常都會省略，瀏覽器在請求DNS的時候會自動加上)
既然已經(jīng)懂得了解析的具體過程，我們可以看到上述一共經(jīng)過了N個過程，每個過程有一定的消耗和時間的等待，因此我們得想辦法解決一下這個問題！
DNS存在著多級緩存，從離瀏覽器的距離排序的話，有以下幾種: 瀏覽器緩存，系統(tǒng)緩存，路由器緩存，IPS服務(wù)器緩存，根域名服務(wù)器緩存，頂級域名服務(wù)器緩存，主域名服務(wù)器緩存。
在你的chrome瀏覽器中輸入:chrome://dns/，你可以看到chrome瀏覽器的DNS緩存。
系統(tǒng)緩存主要存在/etc/hosts(Linux系統(tǒng))中
檢查瀏覽器是否有緩存
通過 Cache-Control 和 Expires 來檢查是否命中強(qiáng)緩存，命中則直接取本地磁盤的html（狀態(tài)碼為200 from disk(or memory) cache，內(nèi)存or磁盤）；
如果沒有命中強(qiáng)緩存，則會向服務(wù)器發(fā)起請求（先進(jìn)行下一步的TCP連接），服務(wù)器通過 Etag 和 Last-Modify 來與服務(wù)器確認(rèn)返回的響應(yīng)是否被更改（協(xié)商緩存），若無更改則返回狀態(tài)碼（304 Not Modified）,瀏覽器取本地緩存；
若強(qiáng)緩存和協(xié)商緩存都沒有命中則返回請求結(jié)果。
不知道你們有沒有注意這樣一件事，你訪問http://baidu.com的時候，每次響應(yīng)的并非是同一個服務(wù)器（IP地址不同），一般大公司都有成百上千臺服務(wù)器來支撐訪問，假設(shè)只有一個服務(wù)器，那它的性能和存儲量要多大才能支撐這樣大量的訪問呢？DNS可以返回一個合適的機(jī)器的IP給用戶，例如可以根據(jù)每臺機(jī)器的負(fù)載量，該機(jī)器離用戶地理位置的距離等等，這種過程就是DNS負(fù)載均衡
TCP 協(xié)議通過三次握手建立連接。
翻譯成大白話就是：
為什么是3次？ ：避免 歷史 連接，確認(rèn)客戶端發(fā)來的請求是這次通信的人。
為什么不是4次？ ：3次夠了第四次浪費
建立連接的過程是利用客戶服務(wù)器模式，假設(shè)主機(jī)A為客戶端，主機(jī)B為服務(wù)器端。
采用三次握手是為了防止失效的連接請求報文段突然又傳送到主機(jī)B，因而產(chǎn)生錯誤。失效的連接請求報文段是指：主機(jī)A發(fā)出的連接請求沒有收到主機(jī)B的確認(rèn)，于是經(jīng)過一段時間后，主機(jī)A又重新向主機(jī)B發(fā)送連接請求，且建立成功，順序完成數(shù)據(jù)傳輸?？紤]這樣一種特殊情況，主機(jī)A第一次發(fā)送的連接請求并沒有丟失，而是因為網(wǎng)絡(luò)節(jié)點導(dǎo)致延遲達(dá)到主機(jī)B，主機(jī)B以為是主機(jī)A又發(fā)起的新連接，于是主機(jī)B同意連接，并向主機(jī)A發(fā)回確認(rèn)，但是此時主機(jī)A根本不會理會，主機(jī)B就一直在等待主機(jī)A發(fā)送數(shù)據(jù)，導(dǎo)致主機(jī)B的資源浪費。
采用兩次握手不行，原因就是上面說的失效的連接請求的特殊情況。而在三次握手中， client和server都有一個發(fā)syn和收ack的過程， 雙方都是發(fā)后能收， 表明通信則準(zhǔn)備工作OK.
為什么不是四次握手呢？ 大家應(yīng)該知道通信中著名的藍(lán)軍紅軍約定， 這個例子說明， 通信不可能100%可靠， 而上面的三次握手已經(jīng)做好了通信的準(zhǔn)備工作， 再增加握手， 并不能顯著提高可靠性， 而且也沒有必要。
第一次握手 ：
客戶端發(fā)送syn包(Seq=x)到服務(wù)器，并進(jìn)入SYN_SEND狀態(tài)，等待服務(wù)器確認(rèn)；
第二次握手：
服務(wù)器收到syn包，必須確認(rèn)客戶的SYN（ack=x+1），同時自己也發(fā)送一個SYN包（Seq=y），即SYN+ACK包，此時服務(wù)器進(jìn)入SYN_RECV狀態(tài)；
第三次握手：
客戶端收到服務(wù)器的SYN ACK包，向服務(wù)器發(fā)送確認(rèn)包ACK(ack=y+1)，此包發(fā)送完畢，客戶端和服務(wù)器進(jìn)入ESTABLISHED狀態(tài)，完成三次握手。
握手過程中傳送的包里不包含數(shù)據(jù)，三次握手完畢后，客戶端與服務(wù)器才正式開始傳送數(shù)據(jù)。理想狀態(tài)下，TCP連接一旦建立，在通信雙方中的任何一方主動關(guān)閉連接之前，TCP 連接都將被一直保持下去。
要先申請CA證書，并安裝在服務(wù)器上（一個文件，配置nginx支持監(jiān)聽443端口開啟ssl并設(shè)置證書路徑）
瀏覽器發(fā)送請求；
網(wǎng)站從瀏覽器發(fā)過來的加密規(guī)則中選一組自身也支持的加密算法和hash算法，并向瀏覽器發(fā)送帶有公鑰的證書，當(dāng)然證書還包含了很多信息，如網(wǎng)站地址、證書的頒發(fā)機(jī)構(gòu)、過期時間等。
瀏覽器解析證書。
驗證證書的合法性。如頒發(fā)機(jī)構(gòu)是否合法、證書中的網(wǎng)站地址是否與訪問的地址一致，若不合法，則瀏覽器提示證書不受信任，若合法，瀏覽器會顯示一個小鎖頭。
若合法，或用戶接受了不合法的證書，瀏覽器會生成一串隨機(jī)數(shù)的密碼（即密鑰），并用證書中提供的公鑰加密。
使用約定好的hash計算握手消息，并使用生成的隨機(jī)數(shù)（即密鑰）對消息進(jìn)行加密，最后將之前生成的所有消息一并發(fā)送給網(wǎng)站服務(wù)器。
網(wǎng)站服務(wù)器解析消息。用已有的私鑰將密鑰解密出來，然后用密鑰解密發(fā)過來的握手消息，并驗證是否跟瀏覽器傳過來的一致。然后再用密鑰加密一段握手消息，發(fā)送給瀏覽器。
瀏覽器解密并計算握手消息的HASH，如果與服務(wù)端發(fā)來的HASH一致，此時握手過程結(jié)束，之后所有的通信數(shù)據(jù)將由之前瀏覽器生成的隨機(jī)密碼并利用對稱加密算法進(jìn)行加密。這里瀏覽器與網(wǎng)站互相發(fā)送加密的握手消息并驗證，目的是為了保證雙方都獲得了一致的密碼，并且可以正常的加密解密數(shù)據(jù)，為后續(xù)真正數(shù)據(jù)的傳輸做一次測試。
發(fā)送HTTP請求
首先科補(bǔ)一個小知識，HTTP的端口為80/8080，而HTTPS的端口為443
發(fā)送HTTP請求的過程就是構(gòu)建HTTP請求報文并通過TCP協(xié)議中發(fā)送到服務(wù)器指定端口 請求報文由 請求行 ， 請求抱頭 ， 請求正文 組成。
請求行
請求行的格式為 Method Request-URL HTTP-Version CRLF eg: GET index.html HTTP/1.1 常用的方法有: GET , POST , PUT , DELETE , OPTIONS , HEAD 。
常見的請求方法區(qū)別
這里主要展示 POST 和 GET 的區(qū)別
常見的區(qū)別
注意一點你也可以在GET里面藏body，POST里面帶參數(shù)
重點區(qū)別
GET 會產(chǎn)生一個 TCP 數(shù)據(jù)包，而 POST 會產(chǎn)生兩個 TCP 數(shù)據(jù)包。
詳細(xì)的說就是：
注意一點，并不是所有的瀏覽器都會發(fā)送兩次數(shù)據(jù)包，F(xiàn)irefox就發(fā)送一次
請求報頭
請求報頭允許客戶端向服務(wù)器傳遞請求的附加信息和客戶端自身的信息。
從圖中可以看出，請求報頭中使用了Accept, Accept-Encoding, Accept-Language, Cache-Control, Connection, Cookie等字段。Accept用于指定客戶端用于接受哪些類型的信息，Accept-Encoding與Accept類似，它用于指定接受的編碼方式。Connection設(shè)置為Keep-alive用于告訴客戶端本次HTTP請求結(jié)束之后并不需要關(guān)閉TCP連接，這樣可以使下次HTTP請求使用相同的TCP通道，節(jié)省TCP連接建立的時間。
請求正文
當(dāng)使用POST, PUT等方法時，通常需要客戶端向服務(wù)器傳遞數(shù)據(jù)。這些數(shù)據(jù)就儲存在請求正文中。在請求包頭中有一些與請求正文相關(guān)的信息，例如: 現(xiàn)在的Web應(yīng)用通常采用Rest架構(gòu)，請求的數(shù)據(jù)格式一般為json。這時就需要設(shè)置 Content-Type: application/json 。
更重要的事情-HTTP緩存
HTTP屬于客戶端緩存，我們常認(rèn)為瀏覽器有一個緩存數(shù)據(jù)庫，用來保存一些靜態(tài)文件，下面我們分為以下幾個方面來簡單介紹HTTP緩存
緩存的規(guī)則
緩存規(guī)則分為 強(qiáng)制緩存 和 協(xié)商緩存
強(qiáng)制緩存
當(dāng)緩存數(shù)據(jù)庫中有客戶端需要的數(shù)據(jù)，客戶端直接將數(shù)據(jù)從其中拿出來使用（如果數(shù)據(jù)未失效），當(dāng)緩存服務(wù)器沒有需要的數(shù)據(jù)時，客戶端才會向服務(wù)端請求。
又稱對比緩存。客戶端會先從緩存數(shù)據(jù)庫拿到一個緩存的標(biāo)識，然后向服務(wù)端驗證標(biāo)識是否失效，如果沒有失效服務(wù)端會返回304，這樣客戶端可以直接去緩存數(shù)據(jù)庫拿出數(shù)據(jù)，如果失效，服務(wù)端會返回新的數(shù)據(jù)
強(qiáng)制緩存
對于強(qiáng)制緩存，服務(wù)器響應(yīng)的header中會用兩個字段來表明——Expires和Cache-Control。
Expires
Exprires的值為服務(wù)端返回的數(shù)據(jù)到期時間。當(dāng)再次請求時的請求時間小于返回的此時間，則直接使用緩存數(shù)據(jù)。但由于服務(wù)端時間和客戶端時間可能有誤差，這也將導(dǎo)致緩存命中的誤差，另一方面，Expires是HTTP1.0的產(chǎn)物，故現(xiàn)在大多數(shù)使用Cache-Control替代。
Cache-Control
Cache-Control有很多屬性，不同的屬性代表的意義也不同。
協(xié)商緩存
協(xié)商緩存需要進(jìn)行對比判斷是否可以使用緩存。瀏覽器第一次請求數(shù)據(jù)時，服務(wù)器會將緩存標(biāo)識與數(shù)據(jù)一起響應(yīng)給客戶端，客戶端將它們備份至緩存中。再次請求時，客戶端會將緩存中的標(biāo)識發(fā)送給服務(wù)器，服務(wù)器根據(jù)此標(biāo)識判斷。若未失效，返回304狀態(tài)碼，瀏覽器拿到此狀態(tài)碼就可以直接使用緩存數(shù)據(jù)了。
對于協(xié)商緩存來說，緩存標(biāo)識我們需要著重理解一下，下面我們將著重介紹它的兩種緩存方案。
Last-Modified
Last-Modified：服務(wù)器在響應(yīng)請求時，會告訴瀏覽器資源的最后修改時間。
從字面上看，就是說：從某個時間節(jié)點算起，是否文件被修改了
這兩個的區(qū)別是一個是修改了才下載一個是沒修改才下載。
Last-Modified 說好卻也不是特別好，因為如果在服務(wù)器上，一個資源被修改了，但其實際內(nèi)容根本沒發(fā)生改變，會因為Last-Modified時間匹配不上而返回了整個實體給客戶端（即使客戶端緩存里有個一模一樣的資源）。為了解決這個問題，HTTP1.1推出了Etag。
Etag
Etag：服務(wù)器響應(yīng)請求時，通過此字段告訴瀏覽器當(dāng)前資源在服務(wù)器生成的唯一標(biāo)識（生成規(guī)則由服務(wù)器決定）
但是實際應(yīng)用中由于Etag的計算是使用算法來得出的，而算法會占用服務(wù)端計算的資源，所有服務(wù)端的資源都是寶貴的，所以就很少使用Etag了。
緩存的優(yōu)點
不同刷新的請求執(zhí)行過程
瀏覽器地址欄中寫入URL，回車
F5
Ctrl+F5
服務(wù)器處理請求并返回HTTP報文
它會對TCP連接進(jìn)行處理，對HTTP協(xié)議進(jìn)行解析，并按照報文格式進(jìn)一步封裝成HTTP Request對象，供上層使用。這一部分工作一般是由Web服務(wù)器去進(jìn)行，我使用過的Web服務(wù)器有Tomcat, Nginx和Apache等等 HTTP報文也分成三份， 狀態(tài)碼 ， 響應(yīng)報頭 和 響應(yīng)報文
狀態(tài)碼
狀態(tài)碼是由3位數(shù)組成，第一個數(shù)字定義了響應(yīng)的類別，且有五種可能取值:
平時遇到比較常見的狀態(tài)碼有:200, 204, 301, 302, 304, 400, 401, 403, 404, 422, 500
常見狀態(tài)碼區(qū)別
200 成功
請求成功，通常服務(wù)器提供了需要的資源。
204 無內(nèi)容
服務(wù)器成功處理了請求，但沒有返回任何內(nèi)容。
301 永久移動
請求的網(wǎng)頁已永久移動到新位置。 服務(wù)器返回此響應(yīng)（對 GET 或 HEAD 請求的響應(yīng)）時，會自動將請求者轉(zhuǎn)到新位置。
302 臨時移動
服務(wù)器目前從不同位置的網(wǎng)頁響應(yīng)請求，但請求者應(yīng)繼續(xù)使用原有位置來進(jìn)行以后的請求。
304 未修改
自從上次請求后，請求的網(wǎng)頁未修改過。 服務(wù)器返回此響應(yīng)時，不會返回網(wǎng)頁內(nèi)容。
400 錯誤請求
服務(wù)器不理解請求的語法。
401 未授權(quán)
請求要求身份驗證。 對于需要登錄的網(wǎng)頁，服務(wù)器可能返回此響應(yīng)。
403 禁止
服務(wù)器拒絕請求。
404 未找到
服務(wù)器找不到請求的網(wǎng)頁。
422 無法處理
請求格式正確，但是由于含有語義錯誤，無法響應(yīng)
500 服務(wù)器內(nèi)部錯誤
服務(wù)器遇到錯誤，無法完成請求。
響應(yīng)報頭
常見的響應(yīng)報頭字段有: Server, Connection...。
響應(yīng)報文
你從服務(wù)器請求的HTML,CSS,JS文件就放在這里面
就是 Webkit 解析渲染頁面的過程。
這個過程涉及兩個比較重要的概念 回流 和 重繪 ，DOM結(jié)點都是以盒模型形式存在，需要瀏覽器去計算位置和寬度等，這個過程就是回流。等到頁面的寬高，大小，顏色等屬性確定下來后，瀏覽器開始繪制內(nèi)容，這個過程叫做重繪。瀏覽器剛打開頁面一定要經(jīng)過這兩個過程的，但是這個過程非常非常非常消耗性能，所以我們應(yīng)該盡量減少頁面的回流和重繪
這個過程中可能會有dom操作、ajax發(fā)起的http網(wǎng)絡(luò)請求等。
web-socket、ajax等，這個過程通常是為了獲取數(shù)據(jù)
setTimeout、setInterval、Promise等宏任務(wù)、微任務(wù)隊列
當(dāng)Render Tree中部分或全部元素的尺寸、結(jié)構(gòu)、或某些屬性發(fā)生改變時，瀏覽器重新渲染部分或全部文檔的過程稱為回流。
會導(dǎo)致回流的操作：
一些常用且會導(dǎo)致回流的屬性和方法：
當(dāng)頁面中元素樣式的改變并不影響它在文檔流中的位置時（例如：color、background-color、visibility等），瀏覽器會將新樣式賦予給元素并重新繪制它，這個過程稱為重繪。
JS的解析是由瀏覽器的JS引擎完成的。由于JavaScript是單線程運(yùn)行，也就是說一個時間只能干一件事，干這件事情時其他事情都有排隊，但是有些人物比較耗時（例如IO操作），所以將任務(wù)分為 同步任務(wù) 和 異步任務(wù) ，所有的同步任務(wù)放在主線程上執(zhí)行，形成執(zhí)行棧，而異步任務(wù)等待，當(dāng)執(zhí)行棧被清空時才去看看異步任務(wù)有沒有東西要搞，有再提取到主線程執(zhí)行，這樣往復(fù)循環(huán)（冤冤相報何時了，阿彌陀佛），就形成了Event Loop事件循環(huán)，下面來看看大人物
先看一段代碼
結(jié)果我想大家都應(yīng)該知道。主要來介紹JavaScript的解析，至于Promise等下一節(jié)再說
JavaScript是一門單線程語言，盡管H5中提出了 Web-Worker ，能夠模擬實現(xiàn)多線程，但本質(zhì)上還是單線程，說它是多線程就是扯淡。
既然是單線程，每個事件的執(zhí)行就要有順序，比如你去銀行取錢，前面的人在進(jìn)行，后面的就得等待，要是前面的人弄個一兩個小時，估計后面的人都瘋了，因此，瀏覽器的JS引擎處理JavaScript時分為 同步任務(wù) 和 異步任務(wù)
這張圖我們可以清楚看到
js引擎存在monitoring process進(jìn)程，會持續(xù)不斷的檢查主線程執(zhí)行棧是否為空，一旦為空，就會去Event Queue那里檢查是否有等待被調(diào)用的函數(shù)。 估計看完這些你對事件循環(huán)有一定的了解，但是事實上我們看對的沒這么簡單，通常我們會看到Promise，setTimeout，process.nextTick（），這個時候你和我就懵逼。
不同任務(wù)會進(jìn)入不同的任務(wù)隊列來執(zhí)行。 JS引擎開始工作后，先在宏任務(wù)中開始第一次循環(huán)（ script里面先執(zhí)行，不過我喜歡把它拎出來，直接稱其進(jìn)入執(zhí)行棧 ），當(dāng)主線程執(zhí)行棧全部任務(wù)被清空后去微任務(wù)看看，如果有等待執(zhí)行的任務(wù)，執(zhí)行全部的微任務(wù)（其實將其回調(diào)函數(shù)推入執(zhí)行棧來執(zhí)行），再去宏任務(wù)找最先進(jìn)入隊列的任務(wù)執(zhí)行，執(zhí)行這個任務(wù)后再去主線程執(zhí)行任務(wù)（例如執(zhí)行```console.log("hello world")這種任務(wù)），執(zhí)行棧被清空后再去微任務(wù)，這樣往復(fù)循環(huán)（冤冤相報何時了）
下面來看一段代碼
我們看看它的執(zhí)行情況
具體的執(zhí)行過程大致就是這樣。
三、訪問網(wǎng)站的過程？
1，瀏覽器通常指 IE FireFox等，客戶端使用的程序
2，每臺連接互聯(lián)網(wǎng)的機(jī)器都有一個唯一的IP地址，IP地址是由4個0到256的數(shù)組成的，比如：222.131.0.229，127.0.0.1，由于每臺聯(lián)網(wǎng)的機(jī)器的IP地址都是獨立的，因此可以通過IP判斷一臺機(jī)器。
網(wǎng)站所在的服務(wù)器通常有一個固定的IP地址，而我們?yōu)g覽者每次上網(wǎng)的IP地址通常都不一樣，IP地址是由ISP分配的。
域名服務(wù)器(domain name server)的簡稱為DNS，它存儲了域名與IP地址對應(yīng)的列表。
3，瀏覽器得到域名指向的IP后，瀏覽器會把我們輸入的域名轉(zhuǎn)化為HTTP的服務(wù)請求，例如，輸入 www.mayi1992.com，可以轉(zhuǎn)化為 http://www.mayi1992.com/，通過這種方式瀏覽器向服務(wù)器發(fā)出了請求。
由于輸入的是域名，因此服務(wù)器接收到請求后，會查找域名下的默認(rèn)網(wǎng)頁(通常為default.php或default.html)，如果直接輸入http://www.mayi1992.com/default.php就直接查找這個頁面。
4，返回的請求通常是一些文件，包括文字信息(.html .css .asp文件等)，圖片，flash等(每個文件都要有一個唯一的網(wǎng)址，比如 http://www.mayi1992.com/xhtml/)
5，瀏覽器將這些信息組織成用戶可以查看的網(wǎng)頁
四、了解為何我們?yōu)g覽器中輸入網(wǎng)址，就能看到網(wǎng)頁了，流程如怎么樣的？
因為有DNS，DNS
是域名系統(tǒng)
(Domain
Name
System)
的縮寫，該系統(tǒng)用于命名組織到域?qū)哟谓Y(jié)構(gòu)中的計算機(jī)和網(wǎng)絡(luò)服務(wù)。在Internet上域名與IP地址之間是一對一（或者多對一）的，域名雖然便于人們記憶，但機(jī)器之間只能互相認(rèn)識IP地址，它們之間的轉(zhuǎn)換工作稱為域名解析，域名解析需要由專門的域名解析服務(wù)器來完成，DNS就是進(jìn)行域名解析的服務(wù)器。
DNS
命名用于
Internet
等
TCP/IP
網(wǎng)絡(luò)中，通過用戶友好的名稱查找計算機(jī)和服務(wù)。當(dāng)用戶在應(yīng)用程序中輸入
DNS
名稱時，DNS
服務(wù)可以將此名稱解析為與之相關(guān)的其他信息，如
IP
地址。因為，你在上網(wǎng)時輸入的網(wǎng)址，是通過域名解析系統(tǒng)解析找到了相對應(yīng)的IP地址，這樣才能上網(wǎng)。其實，域名的最終指向是IP。
以上就是關(guān)于瀏覽器訪問網(wǎng)站的流程相關(guān)問題的回答。希望能幫到你，如有更多相關(guān)問題，您也可以聯(lián)系我們的客服進(jìn)行咨詢，客服也會為您講解更多精彩的知識和內(nèi)容。
推薦閱讀：
怎么強(qiáng)制關(guān)閉瀏覽器網(wǎng)頁（怎么強(qiáng)制關(guān)閉瀏覽器網(wǎng)頁窗口）
瀏覽不良網(wǎng)站10次讓去派出所（瀏覽不良網(wǎng)站10次讓去派出所會打電話嗎-）
贛公網(wǎng)安備 50019002502384號
