- 博客(23)
- 收藏
- 关注
RSS订阅原创 自建npm代理
序言使用verdaccio自建npm proxy registry是为了解决工作中面临的两个问题。缺少私有registry来存储包最近我需要将一些包上传到registry，因为这会减少我迭代时的工作量。可问题在于，涉及到 商业机密 的包是不适合上传到npm这种公共仓库的。例如我正在编写的_生成浏览器指纹_的包，因为它一旦被公开就会失去大部分价值。又例如被应用在前端脚手架内的包，因为它们都是为公司业务逻辑量身打造的。其他registry不够稳定在日常工作中有些包总是下载缓慢甚至时常下载失败，即使切换
2022-05-07 19:10:08
649
原创 利用FingerprintJS做浏览器指纹的实现方案
背景运营同事发现大量的拼单、淘宝和闲鱼上的会员账号租借服务、外借账号等问题已经影响到了公司营收。为了缓解这种问题，我们决定限制单一账号能够保持登陆状态的设备数量，以此提高租借账号的成本。要想限制设备，首先要解决的问题就是如何识别一台设备。这可以借助FingerprintJS 来解决，然而并不是所有指纹选项都能够投入到生产环境。高熵值的指纹确实可以增加设备的识别率，但却会导致设备指纹频繁变化，从而引起用户频繁掉线，最终影响用户体验。因此我需要解决的第一个问题就是在设备识别率和用户体验之间找到一个熵值的平衡点
2022-05-07 18:20:01
6748
原创 FingerprintJS分析
数据每条记录都包含下列字段。指纹(由小写字母和数字组成的32位字符串)下列32项是从用户浏览器收集到的指纹的名称。每个名称对应表的一个同名字段。fonts、domBlockers、fontPreferences、audio、screenFrame、osCpu、languages、colorDepth、deviceMemory、screenResolution、hardwareConcurrency、timezone、sessionStorage、localStorage、indexedDB、op
2022-05-07 17:27:58
5094
2
原创 nuxt配置sentry
目录接入官方服务0.注册账户1. 安装2.初始化3. 配置环境变量4. 使用上传sourceMap1. 安装2. 修改 webpack 配置3. 配置环境变量4. 一些可能产生的疑惑配置过程中的问题记录问题：找不到源文件和sourceMap的映射关系@sentry/cli下载失败接入官方服务0.注册账户提示几点。email地址和password会用作登录的账号密码。billingEmail的作用是接收异常报告，sentry监控到异常之后会发送报告到此邮箱。如果你没有填写billingEma
2021-03-18 18:16:49
1542
2
原创 [vue3源码] reactivity包概述（附注释版源码地址）
目录前言reactivity包是阅读源码的一个好开始Vue响应式基本思路将响应式逻辑分为三个阶段更有助于理解初始化依赖收集触发响应computed api的运行逻辑初始化依赖收集触发响应前言从本文开始，我不会再对源码做逐行解释，而是选择以api作为切入点，自顶向下地剖析其原理。 如果读者对源码的细节有兴趣，或者需要查看代码的逐行解析则可以参考这个项目(待上传)。这是我对源码加过注释的版本，注释几乎覆盖每一行代码，不仅有对源码的解释也有我自己当时的所感所想。阅读本文前可以先阅读以下内容：ES6——
2021-02-24 00:09:40
514
原创 docker部署Mysql并实现持久化存储
目标使用docker部署Mysql重置密码导入表结构持久化存储(即使删除容器的情况下)目录结构root/docker/项目名称├── mysql│ ├── Dockerfile│ │ ├── present.sql│ │ └── privileges.sql│ └── setup.sh└── docker-compose.ymldocker-c...
2020-02-19 19:40:48
4090
原创 reactRouter路由守卫与最佳实践
目录前言阶段一阶段二参考 前言路由守卫是开发中很常用的功能，然而reactRouter是没有提供路由守卫的api的，只能由我们自己实现。我会先实现路由守卫的基本功能，然后逐步完善它。于是我将分两个阶段对代码做介绍。阶段一：实现基本功能阶段二：多重权限(身份)阶段一这个阶段我想做到以下几点：根据路由配置生成路由根据路由配置生成嵌套的动态路由对个别路由增加...
2020-02-15 20:16:27
2999
原创 【react学习笔记】项目配置(typeScript)
使用cra创建项目在项目中使用tscreate-react-app 项目名 --template typescript为什么使用cra呢？因为它会自动安装并配置ts相关的包，以及jest测试包等常用的包，以及一些常用的webpack配置，比如热重载、优化后的打包配置等，还直接配置好了对es6+的各自新特性的支持。而且，如果将来cra增加了新功能，我们可以只修改package.json中rea...
2020-02-13 22:20:21
2327
原创 【mobx学习笔记】异步操作方法
目录前言action/runInActionasync/awaitflow 前言mobx的action中调用异步函数的时候，会有一个“陷阱”。下面举例说明假设有这样一个类class Store { @observable test1 = 0 @observable test2 = 0 @computed get testCom() { ...
2020-02-10 21:38:19
3147
1
原创 nginx+ssl+反向代理+egg
配置SSL https://help.aliyun.com/document_detail/98728.html?spm=a2c4g.11186623.2.12.5657625a91Qdju#concept-n45-21x-yfb反向代理 https://blog.csdn.net/weixin_44563906/article/details/98223512思路是使用nginx做反向代理，...
2020-01-07 09:06:43
1884
原创 webhook+docker+nginx实现vue项目的持续集成
目录前言思路容器外build目录结构webhook-giteedeploy-dev.shdocker-compose.ymlDockerfiledefault.conf首次拉取项目启动服务器脚本可能遇到的问题Permission denied 前言本文将分享如何将vue项目托管到docker上，同时也是对《webhook+docker实现vue项目的持续集成》的补充。...
2019-12-25 15:20:17
528
原创 webhook+docker实现vue项目的持续集成
目录前言准备工作Dockerfile编写服务器脚本webhook服务端使用git拉取项目启动服务器脚本安全组配置 前言前段时间将使用vue编写的项目文档署到了云服务器，可是后续每次项目文档有修改时都需要我手动将代码push到云服务器和码云，并且还要重启docker容器，实在麻烦。于是开始研究持续集成，希望在我使用git将项目push到码云之后可以自动将项目同步到云服务...
2019-12-24 20:27:44
695
原创 【前端基础】回流与重绘
目录基本概念DOM TreeCSSOMRender Tree重绘与回流重绘回流区别何时触发重绘回流优化策略浏览器自己的布局属性样式动画 基本概念DOM Tree浏览器会将html文本解析成DOM Tree，DOM Tree的每一个节点对应着一个dom元素。DOM Tree中包含了所有的DOM节点，包括display:none和<head>。CSSOM...
2019-12-12 16:06:42
268
原创 Vue SSR
目录何为SSRVue SSR流程依赖源码对源码的补充说明关闭splitChunks选项 项目已上传至码云[email protected]:yangguang110/Vue_SSR_Demo.git 何为SSR从需求出发来回答这个问题。SPA应用有两个缺点，一是首屏加载缓慢，二是SEO不友好。因为浏览器在请求一个SPA的时候，服务器发送给浏览器的html...
2019-12-11 19:53:33
1029
2
原创 【探究Vue原理】对Vue2.0的数据响应式的探究
目录开篇1. 开篇 开篇关于Vue 1.0中响应式的分析可以看我这篇博文。与Vue1相比Vue2引入了虚拟DOM，这大大优化了Vue在大项目中的表现。本文会分析什么是虚拟DOM，为什么要引入它，它又是怎么工作的。之后再谈谈什么是响应式，它又是如何实现的。以及响应式与虚拟DOM之间的关联。我会尽量详细的阐述文中可能涉及的一切知识，文章可能稍显冗长，我会将可跳过的地...
2019-12-04 17:53:36
512
原创 git相关
为ssh连接创建公钥删除.ssh文件夹（直接搜索该文件夹）下的known_hosts(手动删除即可，不需要git）在下载好的Git中的bin目录下打开bash.exe输入命令ssh-keygen -t rsa -C "username" (注：username为你git上的用户名)如果执行成功。返回：Generating public/private rsa key pair.E...
2019-11-08 09:11:36
275
原创 【探究Vue原理】watcher的异步更新
目录开篇同步更新异步更新异步更新的源码分析flushSchedulerQueuequeueWatcher 开篇 之前的文章提到过，当用户修改了组件状态之后，dep会通知它所关联的watcher进行更新。更新过程分两种，一种是同步更新，另一种是异步更新。 同步更新 如果一个watcher实例的sync属性被置为true，则表明此watc...
2019-09-02 20:57:59
2125
原创 【探究Vue原理】对Vue2.0的数据响应式的探究——依赖收集
1. pushTarget(this)2. value = this.getter.call(vm, vm)3. popTarget()不知道读者还记不记得我上篇文章提到的defineReactive函数，在这个函数内部有这么一段代码：/* 下面对当前属性做响应式改造，本质上就是对属性的访问和赋值操作做拦截。 当用户将来通过this.xxx访问某个响应式的对象的时候，就会触发它...
2019-09-02 10:09:08
398
原创 【后端基础扫盲】koa洋葱圈原理
首先平时我们写middle ware都是像下面这样对不对？async function fn1(next) { console.log('fn1') await next() console.log('end fn1')}async function fn2(next) { console.log('fn2') await next() co...
2019-08-31 14:46:56
744
原创 【Vue最佳实践】css
目录开篇用sass代替css全局style处理自动注入mixin和变量到全局 开篇本文是Vue最佳实践系列的第一篇，整个系列将会分享我自己在使用vue过程中自己总结的以及吸取来的vue“最”佳实践策略。第一篇文章准备介绍css的最佳实践，因为css是前端技术栈里面最简单的部分，所以我觉得从这里入手还挺合适的。 用sass代替css对sa...
2019-08-29 17:42:56
274
原创 【探究Vue原理】Diff算法
Vue只对同级元素作比较。那问题就简单了许多了。两个数组作比较只需要一个双层循环就搞定了。举个例子，我现在对oldVNode数组的第一个元素(节点)做判断，我要拿着这个元素去和newVNode里面的元素一个个比过去，假设在对比到新数组中第三个元素的时候发现它和自己一模一样，则表示oldVNode数组的第一个元素的位置发生了变化，在新数组中它变到了第三的位置。此时对一号操作的判断完毕，判断结果为...
2019-08-24 16:25:48
974
原创 Vue项目优化心得分享
目录开篇环境异步组件prefetch(预拉取)perload(预加载)按需引入将第三方的公共css放到index.html的标签内参考 开篇 本该继续更新【Vue探究】系列文章的，但今天我怀着激动的心情打算和大家分享下有关Vue项目优化的一点心得。 先说下我遇到的问题。手上的项目目前虽然只完成了三分之二，但已经有100多个页面，和20多个公共组件了。在调试环境下，代码大小高达...
2019-08-13 14:23:26
614
1
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人