#
[精品] [置顶] VSCode插件开发全攻略(一)概览

文章索引 VSCode插件开发全攻略(一)概览VSCode插件开发全攻略(二)HelloWordVSCode插件开发全攻略(三)package.json详解VSCode插件开发全攻略(四)命令、菜单、快捷键VSCode插件开发全攻略(五)跳转到定义、自动补全、悬停提示VSCode插件开发全攻略(六)开发调试技巧VSCode插件开发全攻略(七)WebViewVSCode插件开发全攻略(八)代码片段... 阅读全文

@2018-09-03 前端综合 浏览(74888)
#
[精品] [置顶] HTTPS从认识到线上实战全记录

前言关于HTTPS,基本上你想知道的都在这里了。本文原标题《HTTPS原理与实践》,下图是本文配套PPT的目录截图: 前言原理篇认识HTTPS什么是HTTPSSSL/TLSHTTPS的优点HTTPS的缺点HTTPS原理小明和小红的故事单向认证回到小明和小红的故事双向认证引申思考如何保证公钥不被篡改为何正式传输时使用对称加密CA何为CACA如果作恶怎么办顶级证书私钥泄露怎么办SSL证书证书的种... 阅读全文

@2017-12-19 前端综合 浏览(12125)
#
[精品] [置顶] 【干货】Chrome插件(扩展)开发全攻略

写在前面我花了将近一个多月的时间断断续续写下这篇博文,并精心写下完整demo,所以转载务必保留出处。本文所有涉及到的大部分代码均在这个demo里面:https://github.com/sxei/chrome-plugin-demo ,大家可以直接下载下来运行。 另外,本文图片较多,请耐心等待加载完毕。 本文目录: demo部分截图: 鉴于有很多网友有交流学习Chrome插件的诉求... 阅读全文

@2016-12-19 前端综合 浏览(157675)
#
20行代码封装复制到剪贴板函数:copyToClipboard

一直非常不喜欢类似clipboardjs的使用方式(至于依赖flash的ZeroClipboard.js那就更不推荐了),和DOM耦合太重,使用起来非常不方便: <button class="btn" data-clipboard-text="Just because you can doesn't mean you should — clipboard.js"> Copy t... 阅读全文

@2024-02-29 JavaScript 浏览(95)
#
esModule内联代码的导入导出实现

背景浏览器层面的esModule在设计的时候不太完美,只能import外部JS,如果某个<script type="module">是通过内联代码直接写在HTML里面的反而没法导入: <script type="module">export default 123;</script><script type="module">// 无法导入上面的模... 阅读全文

@2024-01-23 JavaScript 浏览(168)
#
iconfont如何批量添加图标

方法首先,找到你想批量添加的图片地址,比如 https://www.iconfont.cn/collections/detail?cid=22664 : 打开控制台,粘贴如下代码执行,稍等几秒钟,不出意外的话180个图片已经全部添加到购物车了 [...document.querySelectorAll('.block-icon-list li span[title="添加入库"]')].f... 阅读全文

@2022-11-13 前端综合 浏览(2401)
#
frp内网穿透实战

什么是frpfrp是一个使用非常简单的开源内网穿透软件,代码地址:https://github.com/fatedier/frp ,使用条前提你需要有一台公网服务器,大致原理是:公网服务器监听某个端口等待内网服务器连接,内网服务器连接成功后用户访问公网的某一个端口,访问的所有内容都会转发到内网服务器,也就是所有的请求都会经过公网服务器转发一次,还不是真正的完全内网穿透。 准备工作 准备一台公网... 阅读全文

@2022-09-23 Linux基础 浏览(1425)
#
记一次线上服务器重装系统全过程

其实整个系统重装和迁移在6月12晚上就完成了(花了好几个小时,一直搞到凌晨),只不过由于mysql换了版本导致时间插入一直有问题,一直没时间解决,今天才把重装过程补上来。 背景现在在用的ECS服务器还是2015年买的,当时为了省空间故意挑选了比较老的centos6.5系统,空间是省下来了,后面暴露的问题越来越多了。时间来到了2022年,连centos官方都已经放弃维护了,我用的却还是上古... 阅读全文

@2022-07-24 Linux基础 浏览(1097)
#
请立即修改Chrome如下傻逼默认设置,关闭Chrome阻止第三方Cookie设置

如题Chrome不知道从哪个版本开始,更改了一个非常傻逼的默认设置,默认隐身窗口禁用第三方cookie,这给各大网站带来非常大的不便。 什么是禁用第三方cookie,比如我在www.baidu.com 跨域调用 www.qq.com 的接口,即便我非常信任这个接口,明确这个接口是可信任的,且添加了SameSite=None、credentials: 'include'等设置,任然无法把 www.... 阅读全文

@2022-04-18 前端综合 浏览(1941)
#
Content-Disposition:设置某个文件强制下载

强制下载通过给某个URL设置Content-Disposition头部,可以强制浏览器把它当成一个附件去下载,而不是在浏览器中打开,甚至还可以指定下载保存的文件名,其优先级高于有类似作用的download属性: Content-Disposition: inlineContent-Disposition: attachmentContent-Disposition: attachment; fi... 阅读全文

@2021-12-21 HTTP 浏览(2233)
#
JavaScript的toFixed()方法的坑总结

网上几乎所有文章都是错的网上有2类文章: 一类是toFixed科普文章,像W3CSchool直接说toFixed是按照四舍五入,这属于完全错误的,甚至MDN都完全没有提到如何舍入;还有一类是介绍toFixed的坑的文章,这类文章一般都有部分错误,网上绝大部分文章都指出,toFixed是按照银行家舍入法来执行的,实际测试并非如此。 所谓银行家舍入法:四舍六入五看情况,五后非零直接入,五后为零... 阅读全文

@2021-07-02 JavaScript 浏览(1142)
#
【前端搞PS】图片增加圆角

用CSS给图片增加圆角一行border-radius就搞定,PS却一直不会,今天特意学习了下。 打开一张图片,全选: 选择 —> 修改 -> 平滑: 设置圆角大小: Ctrl+Shift+I反选,Delete删除,搞定!(记得右键 -> 取消选择) ... 阅读全文

@2021-04-28 Photoshop 浏览(2377)
#
Referrer-Policy

写在前面无意中发现从百度搜索打开的页面可以通过document.referrer拿到上一个页面的完整URL(地址格式一般类似https://www.baidu.com/link?url=xxxxxxxx),而通过谷歌搜索打开的新页面只能拿到上一个页面的域名、不包括path部分(形如https://www.google.com/),猜测一定是百度做了什么特殊处理,测试了一下: 测试代码: fet... 阅读全文

@2020-11-26 HTTP 浏览(3906)
#
【饭前娱乐】如何在不改前端代码的情况下修改img的宽度

如上图:已知config是从接口读取的,由于历史原因前端把图片宽度写死了,现在需要替换图片,但是宽度变了,问:如何在不改前端代码只改接口的情况下将图片宽度修改成指定宽度。 答案: 一开始想到的方法绕了一个大弯: var config = { src: 'xxx.png', tip: '这是提示<script>setTimeout(function(){var a ... 阅读全文

@2020-11-25 前端综合 浏览(3311)
#
Linux服务器测试最大带宽和实时网速

测试最大带宽speedtest-cli是一个用Python编写的轻量级Linux命令行工具,在Python2.4至3.4版本下均可运行,安装: yum install python-pip –ypip install speedtest-cli 输入speedtest-cli测试最大下载和上传带宽(下图中的单位Mbit/s需要除以8才是我们一般说的多少M/s): 显示实时网速也就是类似3... 阅读全文

@2020-06-12 Linux基础 浏览(6937)
#
谨记:Cookie的作用域不区分协议和端口

误区一:是否区分协议和端口受阮一峰某篇博客里面错误描述影响: 网上大把的文章都说Cookie作用域由protocol、domain、和port决定,实际上这是大错特错的,比如下面这位同学,有人在网上问“cookie作用域区分协议和端口吗”,然后他像贴圣旨一样把阮一峰博客的截图贴一下: 这篇博客是它16年写的,尽管评论里面有很多人指出来这个地方写错了,但他时至今日仍没有更正过来。 ... 阅读全文

@2020-05-12 前端综合 浏览(12006)
#
2行代码生成包含大小写字母和数字的随机字符串

2行代码生成指定长度字符串/** * 生成长度为len的包含a-z、A-Z、0-9的随机字符串 */function generateStr(len = 18) { // 一行代码生成0-9、A-Z、a-z、总长度为62的字符数组 var arr = [...new Array(62)].map((item, i) => String.fromCharCode(i + (i ... 阅读全文

@2020-05-11 JavaScript 浏览(4127)
#
如何一行代码生成内容为0到N的数组

本以为下面这行代码就可以实现: (new Array(5)).map((item, idx) => idx) 但是: 至于为什么会是这样,我没有仔细追究,如果有知道的朋友欢迎指出。 正确方法: // 第一种方法Array.apply(null, {length: 10}).map((item, idx) => idx)// 第二种方法[...new Array(10)].... 阅读全文

@2020-04-30 JavaScript 浏览(3417)
#
first-child 和 first-of-type 的区别

区别: p:first-child的含义:匹配父元素的第一个子元素、并且这个元素必须是P,如果不是则匹配不到;p:first-of-type的含义:匹配父元素的第一个类型是P的子元素; 最大误区:大部分人刚开始接触时会想当然以为first-child是first-of-type的效果,但其实,first-of-type才是大部分人想要的。 示例: <style>p:firs... 阅读全文

@2020-04-22 CSS 浏览(1436)
第1页,共15页