这里我们通过申请 let’t encrypt 的证书并自动更新,实现使用 https 来通过外网访问群辉 nas. 1 准备工具 有固定 ip 的云主机(我选的是阿里云的 ecs) 备案的域名(我选择的是万网上购买的域名,经过实名登记和备案两个步骤) ssh 工具 群辉(ds218+) 2 域名注册/备案这一步网上有很多教程,我这里就不详细说了,但是如果你是从阿里云或者其他国内大型云服务商购买的域名的话,通过他们来提交备案信息可以加快备案的流程以及成功率,我从发起备案到备案完成一共也就花了不到一天时间. 3.ssl 证书申请/自动续期用到的工具在这里https://github.com/ ...
v2ray + nginx 实现 traffic_mask
本文介绍的是将穿墙流量用常见的 https/tls 方式包装,大大降低 vps 被 block 的几率,在敏感时期保持稳如狗的外网访问通道。 v2ray 介绍V2Ray 是近几年十分流行的网络工具,其功能强大,用途不限于突破防火墙,但因其能有效翻墙而广为人知。V2Ray 有如下大放异彩的特点: 开源。V2Ray 是 Project V 的核心工具,源代码开源;多协议支持。传输层支持 TCP、mKCP、WebSocket 等,上层协议支持 Socks、Shadowsocks、以及自定义的 VMess 等;多入口和多出口。V2Ray 可同时支持多个入站和出站协议,每个协议独立工作;多平台支持。 ...
使用 vscode 插件实现在小程序中使用 less/sass/scss
总所周知,微信小程序的官方开发工具(微信开发者工具极其难用),因此我切换到了宇宙第一编辑器 vscode 进行小程序的开发.使用 vscode 开发可以安装两个扩展插件:minapp(支持微信小程序标签、属性的智能补全,并且提示中包含文档内容)和 wechat-snippet(这个插件主要的功能就是代码辅助,代码片段自动完成,可以作为上个插件的补充) 同时由于微信魔改的 css 文件(.wxss)并不支持 scss/less 等,所以这里我们也通过 vscode 插件来实现用 scss/less 写小程序样式 1.less安装 easy-less修改 vscode 配置文件// 对Easy ...
vue 项目 监听页面滚动并固定元素到顶部
一个常见的需求,页面滚动过一段距离后将某个元素固定在页面顶端,常见于固定长表格的表头 实现: 1. 监听滚动距离//项目初始化时监听滚动事件data(){ return { isFixed:false }}mounted() { window.addEventListener("scroll", this.handleScroll); },//摧毁组件时取消监听 destroyed() { window.removeEventListener("scroll", this.han ...
echarts.js 绘制地图/图表
安装 echart.jsnpm npm install echarts --save yarn yarn add echarts 按需加载 ehcart.js全量加载: var echarts = require('echarts'); 默认使用 require(‘echarts’) 得到的是已经加载了所有图表和组件的 ECharts 包,因此体积会比较大,如果在项目中对体积要求比较苛刻,也可以只按需引入需要的模块。 // 引入 ECharts 主模块 var echarts = require('echarts/lib/echarts'); // 引入 ...
微信 jssdk 踩坑实录(nodejs实现后台)
1最近做 H5 有一个需求,要在网页链接分享到微信好友的显示描述和自定义缩略图,并在分享到朋友圈的时候显示缩略图.开始我觉得这是一个很简单的需求,应该在网页上配置一下就好了,后来才发现自己的真的是 too young,我花了一天半的时间来处理这个问题,最终得到了完美的解决,这里我记录下自己的踩坑经历,以便日后查阅. 2微信官方是这么说的: 为规范自定义分享链接功能在网页上的使用,自 2017 年 4 月 25 日起,JSSDK“分享到朋友圈”及“发送给朋友”接口,自定义的分享链接,其域名或路径必须与当前页面对应的公众号 JS 安全域名一致,否则将调用失败。例如,当前页面是 http://ww ...
react 项目中按需加载 antd
初次接触 react 和 antd,如有不对的地方请谅解. 安装 antdyarn add antd 在 app.js 中使用: import { Button } from 'antd'; 这时浏览器会有提示信息: You are using a whole package of antd, please use https://www.npmjs.com/package/babel-plugin-import to reduce app bundle size. 意味着我们是在全量引入 antd,这样会对网络请求与性能有一定的影响,这里我们借助babel-plugi ...
在 vue 项目中使用 postcss-px-to-viewport
在用 vue 开发手机端页面时,推荐使用 postcss-px-to-viewport 来将 px 转为 viewport 安装# npmnpm install postcss-loader postcss-px-to-viewport --save-dev# yarnyarn add postcss-loader postcss-px-to-viewport -D 在 vue.config.js 中配置module.exports = { css: { loaderOptions: { postcss: { plugin ...
前端页面嵌入 lcd 字体
前端嵌入 lcd 数字字体前端如何嵌入字体 这篇文章主要讨论的是如何嵌入数字 lcd 字体. 为了超越“Web 安全字体”的局限,在网页上使用一些用户电脑上不太可能会安装的字体,微软曾率先提出了@font-face 规则。这个规则后来进入 W3C 的 CSS Fonts Module Level 3 模块,于是就有了前端常用的 Web 自定义字体技术: @font-face { font-family: "MyWebFont"; src: url("webfont.eot"); /* 兼容IE9 */ src: url("webfont.eot?#iefix") format ...