Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[软技能] 第28天 在浏览器中输入url到页面显示出来的过程发生了什么? #101

Open
haizhilin2013 opened this issue May 13, 2019 · 13 comments
Labels
软技能 软技能

Comments

@haizhilin2013
Copy link
Collaborator

第28天 在浏览器中输入url到页面显示出来的过程发生了什么?

@haizhilin2013 haizhilin2013 added the 软技能 软技能 label May 13, 2019
@Mojitooooooooo
Copy link

DNS解析得到ip,通过ip向服务器发起tcp链接,发送请求,服务器返回数据,浏览器解析渲染显示,关闭连接。

@yelinzhou92
Copy link

@sansini
Copy link

sansini commented May 16, 2019

这是一道面试中经常能看到的题目,过程其实挺长的,总结过来就是DNS域名解析拿到对应的域名解析,然后就是服务器端和客户端的三次握手建立数据传输通道,四次挥手关闭数据传输通道,客户端根据自己拿到的数据开始渲染页面。完毕

@ddzy
Copy link

ddzy commented May 16, 2019

不邀自来, 实名反对以上所有答案, 我的答案

@haizhilin2013
Copy link
Collaborator Author

@ddzy 欢迎来共同学习

@tzjoke
Copy link

tzjoke commented May 28, 2019

如果只是http的话,浏览器先查cache,如果有的话就直接处理response了,没有的话就会查服务器IP地址,怎么查呢,操作系统会去解析DNS,然后返回给浏览器,浏览器拿到后,建立TCP协议,发送request,服务器处理返回response,这里response可能会被cache,浏览器处理response

@kokokele
Copy link

还有浏览器渲染流程

@Vi-jay
Copy link

Vi-jay commented Jul 29, 2019

  1. dns查询
  2. 解析响应返回的html内容
  3. 生成dom树
  4. 生成cssom树
  5. 合并生成渲染树
  6. 计算布局
  7. 渲染

@Konata9
Copy link

Konata9 commented Aug 13, 2019

这题可以展开的部分很多,这里只能列一个大纲。详细的可以看上面大佬的博客,非常详细。

不邀自来, 实名反对以上所有答案, 我的答案

  • 用户在浏览器中输入网址后,浏览器会先对输入的地址进行解析。比如用的协议 http 还是 https
  • 之后会根据域名进行 IP 的寻址
    • 寻址先从缓存开始,如 host
    • 之后再访问 DNS 服务器,一层一层直至访问到根服务器
    • 服务器再把 IP 告诉客户端
  • 客户端拿到 IP 后发起请求
    • 与服务器进行 HTTP 连接建立(3 次握手)
  • 建立成功后服务器返回数据,浏览器进行渲染
    • DOM 树构建、CSSOM 树的构建、JavaScript 资源下载
      • CSS 的重排重绘,CSSOM 与 DOM 一起进行绘制
      • JavaScript 资源的阻塞
  • 渲染出页面

@huangd-d
Copy link

这是一道面试中经常能看到的题目,过程其实挺长的,总结过来就是DNS域名解析拿到对应的域名解析,然后就是服务器端和客户端的三次握手建立数据传输通道,四次挥手关闭数据传输通道,客户端根据自己拿到的数据开始渲染页面。完毕

还要先查查缓存

@MrZ2019
Copy link

MrZ2019 commented Sep 28, 2020

DNS解析得到ip,通过ip向服务器发起tcp链接,发送请求,服务器返回数据,浏览器解析渲染显示,关闭连接。

@m5ultra
Copy link

m5ultra commented Mar 19, 2021

1.重定向
2.查找缓存
3.dns解析
4.发送http请求
5.服务器响应
6.渲染dom

@never123450
Copy link

1.解析 URL(解析出域名,http 或 https 协议)
2.DNS解析(解析出对应的 ip)
3.简历 TCP 链接
4.发送HTTP请求(POST,GET 等)
5.服务器处理请求
6.接收响应
7.渲染页面
8.完成页面加载

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
软技能 软技能
Projects
None yet
Development

No branches or pull requests