popring's Blog

前端打工人一枚，如果有有趣的问题，欢迎电邮，koler778@gmail.com。

0%

发表于 更新于 分类于 Disqus：

  1. 找到host文件位置，window下位置如图所示，mac下host位置 /etc/hosts 。

  2. 按照下图规则添加host记录

  3. 打开 free-ss.site 网站

  4. V 账号 => v2ray，S账号 => shadowsocks

  5. 使用代理软件添加规则，Windows 下推荐 v2rayN，或者使用 Clash For windows 在win和mac下都可使用，然后就可以畅游网络世界了。

发表于 更新于 分类于 Disqus：

2021年度总结

这是在我入职后，一位同事机缘巧合下送给我的一句话。

这个世界缺的不是完美的人，而是从心底给出的真心、正义、无谓与同情。

—出自《无问东西》

这句话是我今年说的最多的口头禅，无论是对自己，还是对别人。

Everything will be okay in the end. If it’s not okay, it’s not the end. 

一切都将会好起来的。

阅读全文 »

发表于 更新于 Disqus：

Linux入门时做的笔记， shell 相关笔记没有学完不全，以后有空继续学习。

主要为常规的一些命令、压缩打包、权限等。

阅读全文 »

发表于 更新于 分类于 Disqus：

可替换元素（置换元素）

浏览器根据元素的标签和属性，来决定元素的具体显示内容。

例如：浏览器会根据 <img> 标签的src属性的值来读取图片信息并显示出来，而如果查看(x)html代码，则看不到图片的实际内容；<input> 标签的type属性来决定是显示输入框，还是单选按钮等。 (x)html中的<img>、<input>、<textarea>、<select>、<object> 都是置换元素。这些元素往往没有实际的内容，即是一个空元素。

置换元素在其显示中生成了框，这也就是有的内联元素能够设置宽高的原因。

不可替换元素（非置换元素）

(x)html 的大多数元素是不可替换元素，即其内容直接表现给用户端（如浏览器）。

例如：标签

1
<label>label中的内容</label>

牛客题目

mdn 可替换元素

发表于 更新于 分类于 Disqus：
  • GET在浏览器回退时是无害的，而POST会再次提交请求。
  • GET产生的URL地址可以被Bookmark，而POST不可以。
  • GET请求会被浏览器主动cache，而POST不会，除非手动设置。
  • GET请求只能进行url编码，而POST支持多种编码方式。
  • GET请求参数会被完整保留在浏览器历史记录里，而POST中的参数不会被保留。
  • GET请求在URL中传送的参数是有长度限制的，而POST么有。
  • 对参数的数据类型，GET只接受ASCII字符，而POST没有限制。
  • GET比POST更不安全，因为参数直接暴露在URL上，所以不能用来传递敏感信息。
  • GET参数通过URL传递，POST放在Request body中。

额外可以聊

  • GET 的body中也可以放数据，但是由于规范中不建议，所以大多数浏览器也没有处理，也就导致不会接收到 GET请求中body的数据
  • URL限制长度，在http statue code（状态码）中 415 就是URL Too Long。本身协议没有限制长度，但浏览器会有限制，太长了也不方便后端、爬虫处理。

GET 和 POST 到底有什么区别？ - 大宽宽的回答 - 知乎

发表于 更新于 分类于 Disqus：

概括

  • 客户端发起连接，提供协议版本号、随机数(Client random)、支持加密方法
  • 服务端收到后，确认双方的加密方法，然后生成随机数(Server random)，以及自己的数字证书，发送给客户端
  • 客户端收到后，确认数字证书是否有效，然后生成新的随机数(Premaster secret)，使用数字证书加密这个随机数，发送给服务端。
  • 服务端使用自己的私钥，对随机数进行解密。
  • 此时服务端和客户端就可以根据前面约定的加密方法进行通信，使用前面生成的三个随机数生成 **对话秘钥(session key)**，用来加密接下来的整个对话过程

细节

  • 数字证书的加密和解密过程是属于非对称加密，在之后使用对话秘钥加密的方式是对称加密

图解SSL/TLS协议

SSL/TLS协议运行机制的概述

发表于 更新于 分类于 Disqus：

大致分为以下几个过程

  • URL 解析
  • DNS 解析
  • TCP 握手
  • 检查是否有缓存
  • 构建 DOM 树，解析 html
  • 构建 CSSOM
  • 执行 JavaScript 代码
  • 构建渲染树：根据 DOM 树和 CSSOM 生成渲染树
  • 根据渲染树对每个节点布局在正确位置
  • 对每个元素进行绘制
阅读全文 »