随笔分类 - 安全以及性能优化
主要是前端安全性以及性能优化
vue2 升级 vue3部分注意事项
摘要：备注：部分升级时遇到的问题简单整理（后续补充） 一）部分方法转化:参考（升级指南：https://gogocode.io/zh/docs/vue/vue2-to-vue3） （1）Filters（过滤器在vue3中已经废弃） ①全局混入的过滤器将filters转化成方法（methods） ②局部过滤
阅读全文
编写一个 vue 组件发布至 npm
摘要：转载：https://kuangyx.cn/docs/%E6%96%87%E7%AB%A0/%E5%89%8D%E7%AB%AF/%E7%BC%96%E5%86%99%E4%B8%80%E4%B8%AAvue%E7%BB%84%E4%BB%B6%E5%8F%91%E5%B8%83%E8%87%B3n
阅读全文
Charles使用教程
摘要：一、Charles教程（一）Charles使用教程Charles是一个HTTP代理/ HTTP监视器/反向代理，能够查看其机器和Internet之间的所有HTTP和SSL / HTTPS流量。这包括请求，响应和HTTP标头（包含cookie和缓存信息） Charles 是在 Mac /Windows
阅读全文
浏览器插件（谷歌）
摘要：利用js简单实现谷歌插件： 1: 首先,我们需要创建一个文件夹,命名随意 然后,我们需要创建一个manifest.json的文件,命名必须要这个,这个是谷歌内核浏览器的入口类配置文件 { //插件名 "name": "lstDemo", //版本号 "version": "1.0", //谷歌12后
阅读全文
跨域问题处理（已处理IOS兼容问题 ）
摘要：问题描述: vue项目使用axios 请求 在 安卓和pc端正常请求 但是在ios（ios12是我们遇到的）上会出现 跨域 预请求失败 导致 在catch会捕获 Network error ； 导致问题出现的原因： 是由于header里面带了很多请求参数，而后端设置的response.setHead
阅读全文
前端性能分析 Chrome Dev Tools 之 Performance
摘要：作为前端开发，肯定对 Chrome 的 dev tools 不陌生，除了日常 Debug，还提供了一个非常强大的功能：performance 用做性能分析。 window.performance 提供了一组精确的数据，配合数据上报即可实现简单的性能统计。 1. 属性字段首先可以打开官方提供的测试页：
阅读全文
【JS】深入理解事件循环,
摘要：众所周知，JavaScript 是一门单线程语言，虽然在 html5 中提出了 Web-Worker ，但这并未改变 JavaScript 是单线程这一核心,，可是浏览器又能很好的处理异步请求，那么到底是为什么呢？ 浏览器执行线程 在解释事件循环之前首先先解释一下浏览器的执行线程：浏览器是多进程的，
阅读全文
微信小程序无法抓包的解决办法及原因分析
摘要：问题描述 最近在开发调试微信小程序，开发完成后用自己的安卓手机查看体验版时，打开fiddler抓包代理工具，发现小程序获取列表失败并报request:fail-202:net:ERR_CERT_AUTHORITY_INVALID 错误，可是关闭fiddler后有能正常浏览。 解决办法 初步怀疑是fi
阅读全文
vue篇之事件总线（EventBus）
摘要：EventBus的简介 EventBus 又称为事件总线。在Vue中可以使用 EventBus 来作为沟通桥梁的概念，就像是所有组件共用相同的事件中心，可以向该中心注册发送事件或接收事件，所以组件都可以上下平行地通知其他组件，但也就是太方便所以若使用不慎，就会造成难以维护的灾难，因此才需要更完善的V
阅读全文
彻底理解浏览器的缓存机制（http缓存机制）
摘要：一、概述 浏览器的缓存机制也就是我们说的HTTP缓存机制，其机制是根据HTTP报文的缓存标识进行的，所以在分析浏览器缓存机制之前，我们先使用图文简单介绍一下HTTP报文，HTTP报文分为两种： 同步sau交流学习社区（首发）：https://www.mwcxs.top/page/565.html 1
阅读全文
详解 TCP 连接的“ 三次握手 ”与“ 四次挥手 ”
摘要：TCP connection 客户端与服务器之间数据的发送和返回的过程当中需要创建一个叫TCP connection的东西； 由于TCP不存在连接的概念，只存在请求和响应，请求和响应都是数据包，它们之间都是经过由TCP创建的一个从客户端发起，服务器接收的类似连接的通道，这个连接可以一直保持，http
阅读全文
详解HTML5中rel属性的prefetch预加载功能使用
摘要：在HTML5中,有个很有用但常被忽略的特性,就是预先加载(prefetch),它的原理是: 利用浏览器的空闲时间去先下载用户指定需要的内容,然后缓存起来,这样用户下次加载时,就直接从缓存中取出来,效率就快了. 举个例子说明:比如要预先加载某个页面,可以这样: XML/HTML Code <link
阅读全文
浏览器沙盒是什么
摘要：转载：https://www.cnblogs.com/lovesong/p/5087423.html 是什么 沙盒（sandbox），另称沙箱，是一种按照安全策略限制程序行为的执行环境。“沙盒”技术的实践运用流程是：让疑似病毒文件的可疑行为在虚拟的“沙盒”里充分运行，“沙盒”会记下它的每一个动作；当
阅读全文
vue中mixins的理解及应用
摘要：vue中提供了一种混合机制--mixins，用来更高效的实现组件内容的复用。最开始我一度认为这个和组件好像没啥区别。。后来发现错了。下面我们来看看mixins和普通情况下引入组件有什么区别？ mixins 混合 (mixins) 是一种分发 Vue 组件中可复用功能的非常灵活的方式。 混合对象可以包
阅读全文
vue项目实现路由按需加载(路由懒加载)的3种方式
摘要：转自：https://segmentfault.com/a/1190000011519350 vue异步组件 es提案的import() webpack的require,ensure() vue异步组件技术 异步加载 vue-router配置路由 , 使用vue的异步组件技术 , 可以实现按需加载
阅读全文
同源策略和跨域请求解决方案
摘要：转载链接：https://www.jianshu.com/p/bce07495b77c 一、一个源的定义 如果两个页面的协议，端口（如果有指定）和域名都相同，则两个页面具有相同的源。举个例子： 下表给出了相对http://a.xyz.com/dir/page.html同源检测的示例: URL 结果
阅读全文
CDN加速原理
摘要：转载：https://www.jianshu.com/p/1dae6e1680ff 一、什么是 CDN CDN的全称是(Content Delivery Network)，即内容分发网络。其目的是通过在现有的Internet中增加一层新的CACHE(缓存)层，将网站的内容发布到最接近用户的网络”边缘
阅读全文
vue keep-alive以及activated,deactivated生命周期的用法
摘要：转载：https://www.jianshu.com/p/0272c0fe9392 vue官网的描述： <keep-alive> 包裹动态组件时，会缓存不活动的组件实例，而不是销毁它们。和 <transition> 相似，<keep-alive> 是一个抽象组件：它自身不会渲染一个 DOM 元素，也
阅读全文
如何预防xss攻击
摘要：转载：https://blog.csdn.net/hxpjava1/article/details/81005195； 1. XSS攻击原理 XSS原称为CSS(Cross-Site Scripting)，因为和层叠样式表(Cascading Style Sheets)重名，所以改称为XSS(X一般
阅读全文