2021-03-07 08:00:00
背景知识 SameSite 属性 SameSite 属性是 HTTP 响应头 Set-Cookie 的属性之一，允许服务端控制该 Cookie 是否仅限于同站。 同站（跨站）是与常见的同域（跨域）相似的概念，下面是两者的区别。 同域（Same Origin）和跨域（Cross Origin） 域（Origin）由协议（Scheme）、主机名（Hostname）和端口（Port）组成。其中任何一个不同都会被认为是跨域。 同站（Same Site）和跨站（Cross Site） 顶级域名（Top-level domains）（TLDs）是如 .com 等的一系列域名列表。 在大部分场景下，站（Site）的定义是 TLDs+1，如 .com 的下一级，如 github.com。 但 Github 也会为不同的开发者提供不同的 github.io 域名，如 a.github.io 和 b.github.io，为了区分这两个域名，Mozilla 引入了有效顶级域名（Effective top-level domains）（eTLDs）的概念。 因此，站（Site）是有效顶级域名的下一级域名，即 eTLDs+1。 比如：a.web.dev 和 b.web.dev 属于同站，而 a.github.io 和 b.github.io 属于跨站。 Schemeful...
2020-04-30 08:00:00
VSCode Conventional Commits 插件可以帮助你轻松按照 Conventional Commits 规范编写提交信息。 功能 支持使用项目下的 commitlint 规范。 支持自动 add 和 push（需要结合 VSCode 的 git 插件，详见插件文档）。 支持项目级别的 scope 管理。 支持 Gitmoji。 使用方式 你可以通过下面两种方式打开插件： Command + Shift + P 或 Ctrl + Shift + P，输入 Conventional Commits，然后按 Enter。 点击 Source Control 操作面板上的图标。见下图：
2020-04-29 08:00:00
VSCode Conventional Commits extension helps you to fill in commit messages according to Conventional Commits. Features Respect commitlint configs. Support auto add and push (with the configutation of VSCode git extension, see detail in readme). Support project level scope management. Support Gitmoji. Usage You can access VSCode Conventional Commits in...
2020-01-05 08:00:00
Introduction Babel is a Node.js tool to use next-generation JavaScript now. This article will explain how Babel is designed to solve this problem, based on the source codes on the master branch in November 2019. How is Babel designed? babel-loader belongs to webpack project, which is not in the Babel...
2019-12-07 08:00:00
解码 PNG 图片就是把一张图片从二进制数据转成包含像素数据的 ImageData。 图片的二进制数据可以从 <canvas>，<img>，Object URLs，Image URLs，Blob 对象上获取到。参见浏览器图像转换手册。 ImageData 是一个包括了像素数据、图片宽高数据的对象。 示例图片 👆 这是一张我们接下去要解码的图片，但它太小了，放大了展示给大家看下。👇 二进制数据 我们先从浏览器的 <input> 标签上读取到 Blob 对象，然后拿到这张图片的二进制数据。 <input type="file" /> <script> const input = document.querySelector('input'); input.addEventListener('change', async function(e) { const [file] = e.target.files; const arrayBuffer = await file.arrayBuffer(); console.log('arrayBuffer', arrayBuffer); // TODO: Let's decode arrayBuffer const imageData...
