1. 什么是 window.opener window.opener 表示打开当前窗体页面的的父窗体是谁。 例如，在 A 页面中，通过一个带有 target="_blank" 的 a 标签打开了一个新的页面 B，那么在 B 页面里，window.opener 的值为 A 页面的 window 对象。 无来源的打开的页面，或者被禁止了 opener 的页面创建/打开，opener 的值为 null。 2. window.opener 的安全问题 一般来说，打开同源(域名相同)的页面，不会有什么问题。但对于跨域的外部链接来说，存在一个被钓鱼的风险。 在跨域的情况下，window.opener 拿不到来源页面的具体内容，但是 window.opener ...
vscode: Visual Studio Code 常用快捷键
主命令框 F1 或 Ctrl+Shift+P: 打开命令面板。在打开的输入框内，可以输入任何命令，例如： 按一下 Backspace 会进入到 Ctrl+P 模式 在 Ctrl+P 下输入 > 可以进入 Ctrl+Shift+P 模式 在 Ctrl+P 窗口下还可以: 直接输入文件名，跳转到文件 ? 列出当前可执行的动作 ! 显示 Errors或 Warnings，也可以 Ctrl+Shift+M : 跳转到行数，也可以 Ctrl+G 直接进入 @ 跳转到 symbol（搜索变量或者函数），也可以 Ctrl+Shift+O 直接进入 @ 根据分类跳转 symbol，查找属性或函数，也可以 Ctrl+Shift+O 后输入:进入 # 根据名字查找 symbol ...
node-sass 安装失败的解决办法
node-sass 安装失败的原因 npm 安装 node-sass 依赖时，会从 github.com 上下载 .node 文件。由于国内网络环境的问题，这个下载时间可能会很长，甚至导致超时失败。 这是使用 sass 的同学可能都会遇到的郁闷的问题。 解决方案就是使用其他源，或者使用工具下载，然后将安装源指定到本地。 解决方法一：使用淘宝镜像源 设置变量 sass_binary_site，指向淘宝镜像地址。示例： npm i node-sass --sass_binary_site=https://npm.taobao.org/mirrors/node-sass/ // 也可以设置系统环境变量的方式。示例 // linux、mac 下 SASS_BINARY_SITE ...
在 nginx 中配置 HTTP/2 支持
HTTP/2 协议于 2015 年 5 月 14 日正式版发布。随着 nginx 等流行 webserver 以及各大浏览器对 HTTP/2 的支持，越来越多的网站开始部署 HTTP/2 了。 HTTP/2 协议 HTTP/2 源自 SPDY/2。SPDY 系列协议由谷歌开发，于 2009 年公开。它的设计目标是降低 50% 的页面加载时间。 HTTP/2 协议由以下两个 RFC 组成： RFC 7540 - Hypertext Transfer Protocol Version 2 (HTTP/2) RFC 7541 - HPACK: Header Compression for HTTP/2 在 HTTP/2 官网 可以找到更多有关 HTTP/2 协议的资料。 HTTP/2 特点 HTTP/2 在底层传输上带来了大量的改动与优 ...
使用 mocha 和 chai 进行基于浏览器的 javascript 异步测试
基于 BDD (行为驱动开发) 的 UI 相关的功能性测试，特别是涉及到与后端数据交互的情况下，需要浏览器环境和对 ajax 的支持，对于涉及动画的交互，还需要延时执行测试代码。这里提到了几个基本要求： 浏览器环境支持（DOM/DOM JavaScript API/CSSDOM 等） ajax 支持 异步测试支持 下面针对这样的诉求，介绍使用 mocha、chai 和 PhantomJS 方案的相关测试工具/库的安装与测试环境的构建。 1. 相关测试工具/库简介 1.1 mocha mocha 是近年来非常流行的 JavaScript 测试框架。它 支持浏览器环境，并且支持异步测试(done 回调或 Promise) ...
Public-Key-Pins：配置 HPKP（Public Key Pinning Extension for HTTP）
HPKP 格式及说明 HTTP Public Key Pinning（HPKP）的格式如下： Public-Key-Pins: pin-sha256="base64=="; max-age=expireTime [; includeSubdomains][; report-uri="reportURI"] pin-sha256 即证书指纹，允许出现多次（实际上最少应该指定两个）； max-age 和 includeSubdomains 分别是过期时间和是否包含子域，它们在 HSTS（HTTP Strict Transport Security）中也有，格式和含义一致； report-uri 用来指定验证失败时的上报地址，格式和含义跟 CSP（Content Security Policy）中的同名字段一致； includeSubdomains 和 report-uri ...
CSS 代码质量校验：stylelint 、stylefmt 及 post-sorting 的开发环境配置参考
在团队开发中，良好的代码规范约定是保证互相良好协作的基本要求。 stylelint 是一个强大的 CSS linter 工具，它使用 PostCSS 的 AST 语法解析树引擎，支持 PostCSS 支持的所有语法识别，而且还支持自定义语法解析器，具有很大的扩展性，对于 SCSS、LESS 和 SugarSS 都可以良好的支持。 stylefmt 是一个基于 stylelint 的代码修正工具，它可以基于 stylelint 的代码规范约定配置，对可修正的地方作格式化输出。 PostCSS-Sorting 是一个 CSS 属性顺序约定格式化的插件，基于属性顺序约定，格式化调整其顺序。这可以使得团队内的 CSS 书 ...
nodeJS 中从命令行等待并读入用户输入实现与用户交互的方法
在实现与用户交互的工具时，总会有类似 c++ 中 cin>> 操作符的功能需求，从命令行读取用户输入然后继续执行。 在 nodejs 中，避免掉使用事件监听的方式，实现同步的代码书写，可通过如下两种方法。 1. fs.readSync + process.stdin 同步读取用户输入 使用 fs.readSync 从 process.stdin 中读取。示例： const fs = require('fs'); function readSyncByfs(tips) { var response; tips = tips || '> '; process.stdout.write(tips); process.stdin.pause(); response = fs.readSync(process.stdin.fd, 1 ...
CSS 代码校验器 csslint: 在 sublime text 编辑器中安装和配置 csslint
本文主要介绍在 sublime text 3 编辑器中配置 csslint 的方法步骤，以帮助你快速完成相关配置，避免花费更多的时间去探索。 1. 安装 csslint 打开 cmd 命令提示符，使用 node 进行全局安装 csslint npm i eslint -g –registry=http://registry.npm.taobao.org/ –disturl=https://npm.taobao.org/dist 2. 安装 sublime text 相关插件 打开 sublime text，打开 preferences->Package Control (ctrl+shift+l)，搜索和安装如下两个插件： SublimeLinter SublimeLinter-csslint 进入项目根目录，新建一个名称为 .csslintrc 的文件 ...
使用 JSDoc 与 docstrap 生成 JavaScript 项目 API 文档
JSDoc 规范是 JavaScript 最为流行的一套 JS 注释规范，许多 IDE 编辑器都对其提供内核或插件级别的支持。 根据 JSDoc 规范书写注释的 JavaScript 文件，可以借助 JSDoc 工具生成标准的使用文档，也可以被 IDE 编辑器用于代码提示。 JSDoc 默认的文档模板比较单调，docstrap 提供了 14+ 种 bootstrap 风格的模板，使用 docstrap 使得生成的文档更美观易用。 下面志文工作室针对 JSDoc 与 docstrap 安装使用的方法与要点作简要介绍。 一、安装 JSDoc 与 Docstrap 首先进入项目根目录。 1.1 安装 JSDoc npm i -g jsdoc 1.2 安装 Docstra ...
pt 与 px、em、rem 的区别与换算
DPI/pt/px 单位的含义 DPI(Dots Per Inch) 每英寸像素数。Windows 系统默认是 96dpi，Apple 系统默认是 72dpi。 pt (point，磅) 是一个物理长度单位，指的是 72 分之一英寸。 px (pixel，像素) 一个虚拟长度单位，是计算机系统的数字化图像长度单位，如果 px 要换算成物理长度，需要指定精度 DPI，在扫描打印时一般都有 DPI 可选。常见浏览器的默认字体大小都是 16px。 由于屏幕大小的差异性，相同大小的字体在不同屏幕下显示的效果差异比较大。那么动态的放大/缩小字体就变得比较重要。显然针对每一处的字体设置都去做兼容是复杂的， ...
linux centos 升级 openssl
centos 升级 openssl 安装相关依赖 apt-get install zlib1g zlib1g-dev 下载 cloudflare/sslconfig git clone https://github.com/cloudflare/sslconfig 下载 openssl 并解压 wget -O openssl.zip -c https://github.com/openssl/openssl/archive/OpenSSL_1_0_2h.zip unzip openssl.zip mv openssl-OpenSSL_1_0_2h/ openssl cd openssl patch -p1 < ../sslconfig/patches/openssl__chacha20_poly1305_draft_and_rfc_ossl102g.patch 执行编译 # 编译为静态库 ./config shared zlib # 编译为动态库 # ./config shared zlib-dyna ...
