有时候博主希望多个页面共用一个评论区，我们可以自定义 path 做到这一点。
首先要确定自己所用的博客主题支持 Twikoo path 配置，否则需要自己修改主题源码添加 path 配置。
设置主题的 Twikoo path 配置为 window.TWIKOO_MAGIC_PATH||window.location.pathname
然后在所有需要共用评论区的页面正文中增加以下代码 <script>window.TWIKOO_MAGIC_PATH="评论区名称"</script>
把中间的“评论区名称”替换为你指定的名称，共用的页面请起 相同的 评论区名称，其他页面不做改动即可。
试试看！
前端网页如何避免被访客审查元素？总结以下方法，未来有新的想法也会记录在此篇文章里。
Cloudflare Worker 无服务器追查 Git 仓库代码泄露
大部分 Git 平台，如 Github、Gitlab 等，会在打开仓库时自动渲染 README.md，而我们利用这一特性，通过对 README.md 中的图片访问日志加以记录，可以实现追查代码泄露的目的。
如果你还没有 Cloudflare 账号，可以申请一个。
登录 Cloudflare 后，进入 Workers 页面，点击 KV。
Javascript Promise 20 题，加深理解 Promise
1 | Promise.resolve(1) |
基于 VuePress 的项目文档的编译速度一直让我很苦恼，启动一次 dev server 要大约半分钟的时间，而且哪怕只有一个 Hello World，速度也是这么慢。相比之下，Hexo 都比它快。这当然不只是 VuePress 本身的问题，要说还得归咎于 Webpack。
于是 Vite 诞生了，一起诞生的还有 VitePress。好耶！虽然 VitePress 仍处于 WIP 阶段，告诉我们不要在任何地方使用，但我们可以提前对比一下，它究竟能比 VuePress 快多少？我们使用基于 VuePress 的 Twikoo 文档测试一下。
1 | yarn add -D vitepress |
云函数的特性是，当 main 函数 return 时，执行进程会被立即冻结。这一点在官方文档Node.js 8 的异步行为中有提到。
对于异步函数，主流程执行完成后，函数实例进程会被冻结，进程中的所有异步任务会暂停执行，直到这个进程被再次唤起。
另一方面，如果函数实例进程由于某些原因没被复用（例如更新了函数代码），这个异步流程中的代码就永远不会被执行。
但是有些场景下，云函数需要很长的执行时间，例如，Twikoo 通过 Akismet 检测垃圾评论的过程。按照特性，在检测过程结束前，就不能异步检测，提前返回结果给前端，否则检测进程就会被冻结，导致检测失败。我们只能 await 同步检测，造成请求响应慢，用户体验差。
按照 Java 的习惯，我们会启动新的线程执行长时间的任务，在云函数中怎样实现？
Twikoo 评论系统要实现导入功能，导入，就需要上传文件。
通过调用云函数，我们能够传递 string、number 等简单的参数，想要上传文件？不太行。
想到云开发环境有一块默认开通的 COS 空间，这块空间允许登录用户上传文件，只要利用这片空间，就可以实现将文件上传给云函数的功能了。
解决微信小程序在 iPhone iOS 上 text 宽度只有一半导致的不居中等种种问题
当小程序中使用第三方字体时，在 iPhone 11 和 iPhone 12 机型下
这个问题只能在几个特定的机型下出现，不用第三方字体也没有这个问题，安卓机型和开发者工具也重现不了，甚至 iPhone 12 mini 用同一版本也不能重现。
微信版本：7.0.18
小程序基础库：2.14.0
iOS：14.2
这未免也太奇怪了。
腾讯云云开发云函数的文档中写道——
不同的云函数可以共用代码文件（目录）吗
未上线
如果是简单的云函数，这一点还能接受，在开发 Twikoo 评论系统的过程中，云函数要实现的 API 越来越多，逐渐让我发现了它的弊端：
显然违反了开发的 DRY 原则，这迫使我开始思考解决方案。
正常的思维是，一个 API 写一个云函数，如果将云函数合并，用一个云函数实现不同的功能，能否解决这样的问题呢？
工作上正在开发的一款小程序，需要链接到京东购物的一个活动页面。经过搜索发现，除了在小程序内嵌 Webview，小程序内不能直接跳转一个网页，但是京东也是有自己的小程序的，我们可以跳转到京东的小程序吗？查找文档发现可以用 wx.navigateToMiniProgram 打开另一个小程序。
1 | wx.navigateToMiniProgram({ |
现在需要的就是京东小程序的 appId 和活动页面的 path 了！
一番操作后，我发现微信 APP 上既不能获取到小程序的 appId 也不能获取到活动页面的 path，若要获得这两样东西，得开启调试才行，想开启调试，至少要成为小程序开发者……
京东小程序的开发者，我怎么可能拿得到嘛，我连他们的开发者都接触不到！
添加 2 个文件
1 | module.exports = { |
1 | <template> |
评论系统一直是静态网站的痛点。
难道就没有一个完美的方案？
在咕咕咕了近三个月后，我自己搞出了一套评论系统，并命名为 Twikoo。
欢迎访问 twikoo.js.org 了解更多。
AyagawaSeirin 提出了一个 Valine 隐私安全漏洞，发送请求中响应内容明文暴露评论者IP、邮箱等隐私内容，所以我就去查了一下 LeanCloud 文档，发现可以手动更改字段权限，但是，如果设置 mail 客户端不可见，将不会显示评论者的 Gravatar，转为显示默认头像，因为原版是取到明文邮箱后再转 MD5 取头像的。想到的解决办法是新增一个可见字段存储 mail 的 MD5，需要改 Valine 源码，还需要处理现有数据。
以下是我实现的魔改版本，基于 Valine.min.js 版本 1.4.14 修改。该魔改版新增一个可见字段（mailMd5）存储 mail 的 MD5，并提供了脚本处理现有评论数据。
神奇的 @media (prefers-color-scheme: dark)
夜间模式已经实现很久了，当初有人跟我讲，可以增加一个按时间切换的功能。
直到我在无意间查看 Reabble 阅读器的 CSS 样式时，发现了 @media (prefers-color-scheme: dark) 选择器。
来自：prefers-color-scheme - CSS（层叠样式表） | MDN
prefers-color-scheme CSS 媒体特性用于检测用户是否有将系统的主题色设置为亮色或者暗色。
简而言之，就是可以实现随系统（或浏览器）的深、浅色模式设置，改变网页配色。
我觉得这是比按时间切换更好的一个实现，跟随系统设置比跟随时间更加人性化一些，毕竟还有我这种，白天开深色，晚上开浅色的异类（逃）
事情的起因是，我需要一个存放未分类整理知识点，以及收藏转载文章的私人知识库，和 iMaeGoo’s Blog 区别开来。
我尝试过简书、语雀、Evernote、OneNote、有道云笔记，对它们的 markdown 支持、导出能力、搜索能力、容量、安全性都有体会。
最后我决定建一个私人 Git 仓库，用 markdown 来记笔记。然后通过 CI/CD 自动构建到一个叫 iMaeGoo’s Diary 的 VuePress 网站。写笔记 Notepad + Git 就能搞定，还能自由选择多种多样的 markdown 编辑器，手机端也可以通过在线 IDE 更新内容，VuePress 的搜索非常好用，安全性也完全在自己的掌控范围之内。
反正是知识库嘛，我配置了完全公开，方便自己随时随地查看，但由于是未经整理的知识库，也不建议访客去看啦。
问题就来了，有些笔记包含了敏感信息，怎么在公开的知识库中保护这类信息？
在寻找 VuePress 加密时，我发现了 vuepress-plugin-encrypt 这个好用的插件，使用了 aes-128-ctr 来加密内容，你可以直接查看它的英文官方文档。
PC 浏览器平滑惯性滚动（smooth scroll）一套简单实现
主要是 Bing 找了许多 libraries。效果在 Chrome for Windows 上都不理想，要么滚动很生硬，要么就是太复杂，就自己实现了。
本来是 PC only 的，写好后测试了一下移动端，是兼容的，效果也还不错……
不过反正移动端都自带惯性滑动了
解决 Edge 浏览器 SCRIPT5022: Exception thrown and not caught
JS 代码在 Safari, Chrome, Firefox 都是好的，就只有 Edge 莫名其妙地报错。
1 | SCRIPT5022: Exception thrown and not caught |
未捕获的异常？EXM？你倒是说是什么异常啊？行号还是错的？点过去无法定位错误位置？hash-navigation.js？我的项目里根本都没有这个 js 啊喂！
JDBC 连接 Azure Database for MySQL 报错 SSL peer shut down incorrectly 的解决
这个问题找了一天的原因，如果你也遇到了这个问题，希望能帮到你。
完整错误信息：
1 | 03-Jun-2020 07:52:22.772 SEVERE [main] org.apache.tomcat.jdbc.pool.ConnectionPool.init Unable to create initial connections of pool. |
提取关键信息：
1 | Caused by: javax.net.ssl.SSLHandshakeException: Remote host terminated the handshake |
得知 SSL 握手失败，于是我找了 Azure 的示例代码（https://docs.azure.cn/zh-cn/mysql/connect-java）来测，也是同样的问题。
网页中文字体压缩（woff2）、拆分、去繁体字库，提高加载速度
从客户得到的网页字体足足有 10MB 大小，会严重拖慢网页加载，如何处理？
阅读下面的解决方法前，建议先阅读网页字体优化，了解一些基本知识以及这么做的原因。
GBK 结尾的字体偏大的原因是包含庞大的繁体字库，大多数网页并不需要，可以使用 fontTools 得到字体的简体中文子集。
我一直在用 Google Play 版本的 QQ，简洁没有花里胡哨的功能，要问我为什么不用 TIM？因为 TIM 实在太简洁了，连表情都不能下载。
今天突然发现 Play 里的 QQ 更新了！终于不是那个远古版本的 7.7.6 了。
我比较喜欢消息气泡，有时候我甚至可以看气泡认人，但我非常讨厌个性字体，一些字体的辨识度实在低，虽然可以双击查看消息，但能够屏蔽就舒服了。在 7.7.6 中我通过删除 Tencent/MobileQQ/.font_info 目录并创建同名文件来屏蔽字体，新版不起作用了。
找了一圈，发现是这个目录位置变了，现在是 Android/data/com.tencent.mobileqq/Tencent/MobileQQ/.font_info/。
马上删掉，创建同名文件！
然后就遇到问题，QQ 学聪明了，删除了我创建的文件，然后重新加载了字体。
我又想到了给 000 权限，但是 Android 内部存储中的文件是不能设权限的，此路不通。
经过一番尝试，我找到了新的办法屏蔽字体，简而言之，就是用空文件替换所有的 ttf。
Icarus 相信大家都很熟悉，但是有时候我们希望在文章中用特别的样式注明一些内容，markdown 语法就不够用了，所以 Icarus 有哪些高级玩法呢？下面就让 iMaeGoo 带大家一起了解吧。（误
在开发 Drupal CMS 网站时，我们发现 Drupal 默认的日志记录在 watchdog 数据表中，为了把日志记录在文件、控制台输出，可以使用 monolog 模块。这个模块提供的文档较少，在此记录一下遇到的问题。
Valine 升级 1.4 以及增加判断 “昵称和邮箱不能为空”
如果你和我一样只是想在 1.3.10 原版的基础上增加昵称和邮箱的防空验证，可以直接下划到结尾部分，跳过前半部分的过程记录。
最近经受匿名评论的困扰，计划禁止匿名评论。还有一个原因是《网信办：网站不得向未实名认证的用户提供跟帖评论服务》，咱小小博客也是备过案的（能用国内 CDN 加速太香了），应该注意一下是不是？
很遗憾，Valine 作者不计划添加这一功能！这让我一度想要换评论系统了……先不谈数据转移，我对比了一下其他评论系统——
昨天发现 Valine 1.4 发布，有几个新特性挺喜欢，打算升级，想起这茬，干脆一起把防空校验加上吧！
如果要为网站增加矢量图标，其中两个选项是使用 SVG 和使用字体图标，两种方式各有千秋，以下是我个人做的比较。
在阅读这一部分前，可以先参考文章 HTML中嵌入SVG图片的N种方式，了解一下不同的 SVG 嵌入页面的方式。
| 缺点 | 解决方案 |
|---|---|
| 如果将 SVG 放在静态资源目录，通过路径引用至页面，SVG 将造成额外的 HTTP 请求 | 在 HTML 中内嵌 <svg> 标签 |
如果在 HTML 中内嵌 <svg> 标签，HTML 会显得杂乱且无法复用 | 使用 SVG Inline Loader for Webpack 可以用 require 的方式向 HTML 插入 SVG |
图标本身带的颜色（类似 fill="#ccc"）无法覆盖 | 移除 SVG 本身的颜色。使用 SVG Inline Loader for Webpack 的 removingTagAttrs 选项，可以在打包时批量去除图标本身的颜色，再通过 CSS fill 覆盖颜色 |
夜间模式单独提取的代码目前已经更新，支持 Icarus 3.0.0，有需要的朋友欢迎 checkout。
分支：https://github.com/imaegoo/hexo-theme-icarus/tree/night3
提交：https://github.com/imaegoo/hexo-theme-icarus/commit/fc3d016ae1c999347bd9ecbf3cc656e1382db06d
1 | cd theme/icarus |
理解 Javascript，PHP，SQL 匹配中文姓名正则表达式的区别
中文姓名非常多样化，想要真正区别出姓名和非姓名非常困难，但在这篇文章中，作为前提，我们认为合法的中文姓名由 1~10 个中文字符组成。
知道了这个前提，容易得出 JS 的正则表达式——
1 | /^([\u4e00-\u9fa5]{1,10})$/ |
我和同事的两套本地开发环境，相同的一段返回随机验证码图片的代码，验证码代码参考的是 php实现的Captcha验证码类实例 里的代码。在同事的电脑上调用，出来的是裂开的图片，在我的电脑上调用，出来的就是正常的图片，这是为什么呢？解决这个问题花费了三四个小时，记录一下过程。
因为代码上没有区别，所以开始怀疑环境问题，两台开发机都是相同型号，配置也相同，PHP 运行在 docker 容器下，检查 PHP 版本相同。
查了一下 PHP 文档，怀疑可能是因为什么特性没有启用，测试以下代码：
1 |
|
测试结果 imagetypes() & IMG_PNG 的值大于零，看起来两个环境都是支持 PNG 图的。
昨天晚上 Icarus 主题的 RC 版本发布，离正式版不远了，我自 3.0.0-beta.1 一路使用到现在，把自己的使用经验分享一下。
由于主题作者换掉了 ejs 语言，全部重写了一遍，迁移这块的难度是最大的。
拉 dev 分支，冲突实在是太多了，我的办法是，把在旧版上的魔改的整个 diff 导出，然后直接从 dev 签出一个新的分支，参考 diff 对每个文件都重新修改，花了不到2个小时搞定。
主题中部分可重用的 JS 和 JSX 代码已经被移到另一个项目 hexo-component-inferno 中，我们如何对这些组件魔改？此时要分2种情况——
体验 Azure 应用服务：可以白嫖的 OneIndex 空间
之前已经写过一篇如何使用 Azure DevOps 实现自动部署 Hexo 的文章，这个月，受疫情影响在家，就把自己的 Azure 新用户体验账号开了，获得了限时 1 个月 200 刀的体验额度。
之后研究中发现了 Azure 提供的应用服务还挺好用的，当然重点是——可以白嫖！
免费套餐当然是有限制的——
我们可以在上面部署 .Net Core, ASP.NET, Java, Node.js, PHP, Python, Ruby 语言的项目。
之前有访问过别人的 PyOne，发现下载速度还挺快，就一直想用 OneDrive 搭建一个自己的网盘，机会来了。
主流的 OneDrive 第三方 Directory Index，有老牌的 oneindex，还有后起之秀 PyOne 和 OLAINDEX，虽然 Azure 的 PHP 环境可以自动识别 composer 安装依赖，也支持执行部署脚本、执行 php 命令，但是由于 PyOne 还要依赖 Python 环境，OLAINDEX 还要依赖 Nginx，别想了，搭建不了。
当我尝试在 Azure 应用服务上面部署 OLAINDEX 时，在执行安装脚本
php artisan od:install时出错，遇到的错误是 SQLiteGeneral error: 5 database is locked，由于完全不会 PHP，就放弃了。
好了，就决定是 OneIndex 了！高手看到这里基本就可以自己去尝试了，下面是我的步骤。
屏蔽 Chrome for Windows “请停用以开发者模式运行的扩展程序” 提示
开发过 Chrome 扩展的人都知道，加载已解压的扩展之后，Chrome 每次启动会弹窗警告，这个警告在新 Edge 中叫 “禁用开发人员模式扩展” 。
这个提示在打开浏览器几秒之后出现，并夺走窗口焦点，很是烦人，如何屏蔽呢？
多种方式解决 Windows CMD 中 vue-cli-service 不是内部或外部命令
已安装 Vue 脚手架
1 | npm install -g @vue/cli |
找不到 vue-cli-service 命令
1 | 'vue-cli-service' is not recognized as an internal or external command, operable program or batch file. |
经过搜索，发现这个问题只在 Windows 下存在。
装了脚手架应该会在 node 目录产生 vue-cli-service.cmd 的文件，实际没有产生，不过在全局 node_modules 下是有的。
有说清理 node_modules 重新安装可以解决的，试了不管用，全局卸载脚手架重新安装也不管用，就算管用也比较麻烦，于是我找到了几个间接使用方法——
Vue 给 i18n 国际化组件写单元测试报 $t is not a function
对一个有国际化的 Vue 组件写单元测试，mount这个组件时，会遇到找不到 $t 的报错。
1 | <p>{{ $t('message.hello' }}</p> |
1 | TypeError: _vm.$t is not a function |
Vue Router 向 URL query 添加、删除参数
当前 URL：http://localhost/home?keyword=example
1 | this.$router.replace({ query: { ...this.$route.query, code: '1' } }) |
最终 URL：http://localhost/home?keyword=example&code=1
我所使用的 Vue Router 版本为 3.0.3，删除参数比较麻烦。
当前 URL：http://localhost/home?keyword=example&code=1
1 | delete this.$route.query.code |
1 | let newQuery = JSON.parse(JSON.stringify(this.$route.query)) // 深拷贝 |
最终 URL：http://localhost/home?keyword=example
在 Github 上面搜索 “lottery”，发现类似的项目挺多的，有 Electron 实现的，可以打包成 exe，也有原生 js 实现的，浏览器打开。
这次是用 Vue 做了一个编号抽奖，一个转盘抽奖，放在一起，练手。
VS Code 写 C# 怎样自动导包（Auto-using）
在 Visual Studio 中可以使用 Alt + Shift + F10 来自动导包，在 VS Code 中怎么操作呢？
快捷键是 Ctrl + .（句点）。
坑：必须在英文状态下按快捷键才能起作用。
Hexo 部署依赖 node 环境就让很多专注写作的人放弃这个框架，劝退萌新，并且难以随时随地写作。好在其 CLI 比较简单，前面我也介绍过如何利用免费的微软 Azure 持续部署博客。
不过今天看 Ant Design Pro 官网的 footer 的时候发现了 Netlify 这个东西，试了以后，强烈安利！！！
来到它的首页，里面有这么几段话——
大字：
在几秒钟内部署您的网站*
小字：
*不，这里没有陷阱。
真的只需点击几下。
嗯……嗯？哼哼……有免费套餐，试试吧！
然后构建就启动了，1分钟后我的站点就到了 Netlify 上。
当时我的表情是 (⊙o⊙)？
我连部署命令都没打；
我连环境都没提供；
我甚至全程没有摸一下键盘……（你要问我注册登录不摸键盘？真就没摸，GitHub 是已登录的状态，点一下授权按钮就登录了。）
敢情 hexo 的部署配置，Azure 的 CICD 都白写了呗？
……
😓，流批……
这个网站还支持绑定域名，自动申请 HTTPS，配 Web Hook（就不用手动点部署了），还有很多很多真 · 自动化的功能，大家一起发掘吧！
此篇针对 Icarus 2 版本，Icarus 3 请参考：Icarus 夜间模式支持 3.0 了
This extension is NOT FULLY TESTED, so it may not fully cover the theme styles, if you find something wrong (such as bright things in night mode), please report it in this issue, do not open new issue.
night branch from imaegoo/hexo-theme-icarus into your icarus theme folder, or dowmload zip.themes/icarus/_config.yml.1 | logo: |
night 分支（imaegoo/hexo-theme-icarus）合并到你的主题分支中。如果你不懂，并且你对主题没有自己修改，直接下载修改好压缩包。themes/icarus/_config.yml 中配置。1 | logo: |
If you want to customize your theme, you can modify night mode part in themes/icarus/source/css/style.styl.
Universe background from https://github.com/fan-lv/Fan
移动端分页一般都是向下滑动加载更多，Vant 组件库提供了 van-list 来实现这一功能。
List 组件通过
loading和finished两个变量控制加载状态，当组件滚动到底部时，会触发load事件并将loading设置成true。此时可以发起异步操作并更新数据，数据更新完毕后，将loading设置成false即可。若数据已全部加载完毕，则直接将finished设置成true即可。
实际应用中发现，即使内部元素已经填满一整屏，仍然会触发加载，直到我模拟的20多页全部加载完才停下来。
我没有给这个问题写专门的 CodePen demo，比较麻烦，碰到的人也不一定多。
van-list 会在内容之后增加一个 placeholder，通过 placeholder 的位置判断内容是否已填充满屏。
van-list 本身为 flex 布局时，flex-direction 必须是 column（或 column-reverse）。
首先我的用法是这样的：
1 | <van-list> <!-- flex --> |
首先看文档，英文文档没有提到，但中文文档有以下一段话：
使用 float 布局后一直触发加载？
若 List 的内容使用了 float 布局，可以在容器上添加van-clearfix类名来清除浮动，使得 List 能正确判断元素位置
检查了一下，我没有在使用 float 布局呀。
更新了 Icarus 主题代码，右上角增加了夜间模式切换按钮，是实验中的功能，欢迎体验。
通过向 body 添加名为 night 的 class 实现，状态记在浏览器 localstorage 中。
已知问题：
目前还没有做成插件，仅在自己的博客使用，后期如果有时间的话，会考虑做成 extension。
更新：已经发布了——
Icarus 2 请参考：如何给 Icarus 增加夜间模式
Icarus 3 请参考：Icarus 夜间模式支持 3.0 了
粘性布局之粘底效果（position sticky, bottom 0）
经常在查资料时访问各种 CSDN 博客会发现，当 屏幕高度 < 左边栏的高度 < 内容的高度 时，滚动屏幕，左边栏会随着内容一同滚动，当滚动到左边栏底部时，左边栏会停止滚动，而内容会继续滚动。
这种设计的优势在于，用户既能够滚动左边栏，又不会在左边栏不够长时，造成页面左侧大片空白的尴尬，这种布局模式，叫做 粘性布局（sticky）。
粘性布局在元素满足显示条件时，表现与普通布局没什么不同，但当元素随着页面滚动而无法显示时，会转为 fixed 布局效果，主流浏览器已经全部支持粘性布局（IE不支持）。
通俗一点讲，类似于 Excel 中的“冻结窗格”。
绝大多数网上的教程材料都用 position: sticky; top: 0; 这样的组合来举例，但为了实现 CSDN 左边栏效果，position: sticky; bottom: 0; 似乎不能和想象一样的起作用。
position: fixed; bottom: 0; 样式，把左边栏定死，延时较为明显，快速上下滚动时能看到闪烁。position: sticky; 实现，通过 JS 计算 屏幕高度 - 左边栏高度 得到 top 的值，快速滚动时没有闪烁。Chrome 各版本地址栏显示完整地址（https 和 www）
由于谷歌最近对 Chrome 地址栏改来改去，不同的版本需要对应不同的方法。
在浏览器输入 chrome://flags/ 回车，找到 Omnibox UI Hide Steady-State URL Scheme and Trivial Subdomains，设置为 Disabled，然后重启浏览器。
谷歌从 flag 页面砍掉了这个设置，但 flag 还是存在的。
打开 chrome://flags/，78版本已经找不到 omnibox-ui-hide-steady-state-url-scheme 和 omnibox-ui-hide-steady-state-url-trivial-subdomains 了。
按 F12 打开 Console，执行以下命令，然后重启 Chrome。
1 | [ |
代码中 @2 对应的是 Disabled。@0 和 @1 分别对应 Default 和 Enabled。
测试有效的版本：78.0.3904.97
方法来源：ysc3839（https://www.v2ex.com/t/613776）
谷歌彻底砍掉了这两个 flag……
现在安装插件是唯一方法，如果你能够访问 Chrome 网上应用店的话，安装这个插件，无需配置即可显示完整地址：
https://chrome.google.com/webstore/detail/suspicious-site-reporter/jknemblkbdhdcpllfgbfekkdciegfboi
方法来源：MaiKuraki（https://www.v2ex.com/t/588136）
如果是 Windows 系统，也可以换用 Chromium 内核的 Edge 浏览器，我已经完全爱上 Edge 啦！
据IT之家报导，谷歌决定“使URL更易于阅读和理解，并消除对可注册域的干扰”，在Chromium Gerrit中新提交了一个flag标志，未来可在 chrome://flags#context-menu-show-full-urls 中设置开启，届时Chrome浏览器地址栏便可显示完整URL。
嗯，砍了再加回来，绝世好活！
我并没有下载 Chromium 测试这个 flag，未来推出有这个 flag 的正式版后，我可能会会更新这篇博文。
现在直接右键地址栏，然后打钩「总是显示完整地址」就行了！
自动部署的 Magento 附带的 MariaDB 镜像第一次启动能够成功，但 stop 之后就无法再次启动。启动命令 docker-compose up -d，重启命令 docker-compose restart，
关键 log：
1 | InnoDB: Assertion failure in file /bitnami/blacksmith-sandox/mariadb-10.2.28/storage/innobase/dict/dict0dict.cc line 1467 |
详细的 stdout 如下——
Windows 下通过 Vagrant 简单搭建 Magento
官网下载安装，比我的新即可，安装路径自选。
新建文件夹并创建 Vagrantfile 放在里面，我配置的环境是 Ubuntu 16.04，内存8G，可以换成自己熟悉的环境。
映射端口80，443（Web），3306（数据库），9200，9300（搜索引擎）。
1 | Vagrant.configure("2") do |config| |
1 | let obj = { id: 1, title: "1" } |
1 | let obj = { |
1 | let arr = [1, 2, 3] |
1 | let arr = [ |
1 | let arr = [ |
不考虑性能的情况下，JSON.parse(JSON.stringify(value))是最简最万能的拷贝。
直接操作 Vue data 中不存在的属性导致的 v-model 绑定异常问题
初学Vue遇到的问题，尝试了几个小时才搞明白，大佬应该一眼就能看出什么问题吧……
需要注意，不要直接在JS中操作一个Vue data对象中不存在的属性，如果同时有通过v-model绑定到该对象的不存在的属性时，会出现诡异的行为表现，console中不会报出任何 warn 或 error。
需求是，实现三个复选框，第一个复选框初始为选中状态，一开始写出来是这样的——
1 | <div id="app" style="margin: 10px;"> |
1 | new Vue({ |
试下效果：
See the Pen vue-v-model-not-work by iMaeGoo (@iMaeGoo) on CodePen.
复选框a的表现显然是异常的，点击不能成功地切换选中状态，而在点击之后再点击其他复选框，才会“有延迟地”切换状态。
提到网页毛玻璃效果，总结下来有以下2种：
早在之前，1就已经可以通过 CSS3 filter 属性实现，而2一直没有一个好的解决方案。对1的运用，也可以达到2的效果，通过模糊图片的一部分，就可以实现类似 bilibili 导航栏的模糊背景效果 ↓
这样实现的前提是，我们的背景是一个静态的，单一的图片，那么如果我们需要模糊的背景比较复杂呢？仔细观察QQ右栏的标题栏，和下方的应用 Dock，都是 iOS 常见的毛玻璃叠加层效果 ↓
显然模糊元素本身并不能解决所有场景的问题。
项目staging环境日志难以搜索，计划搭建EFK管理日志，但是EFK内存消耗太大，再新增云服务器不划算，打算搭建在本地（16G内存）。
EFK不是一个软件，而是一套解决方案，并且都是开源软件，其中 ELasticsearch 负责日志保存和搜索，FileBeat 负责收集日志，Kibana 负责界面。
Elasticsearch、Logstash、Redis 等平台。目前有3种思路：
