吴纯玲的博客

qiankun会把静态资源的加载拦截，改用fetch方式获取资源，所以要求这些资源支持跨域。虽然qiankun也提供了解决方案，但支持跨域的方式也颇为复杂，有没有更简单的方式，纯前端实现？幸在qiankun提供了excludeAssetFilter。

问题：组件库内有一个PDF预览功能，引用了vue-pdf，（多个项目均有引用这个组件库）。项目打包build后产生worker文件，发布生产访问404通过伟大的搜索引擎找到各种类似的解决方案：修改node_modules里的打包目录，如，vue使用vue-pdf预览开发正常，打包报错work.js404_波塞冬的博客-CSDN博客_vue-pdfvue中使用vue-pdf打包之后预览报错hash+worker.js路径不对404_茶荼-CSDN博客_vue-pdf 打包报错但是这个解决方案被

一个通用的http方法应该有以下功能（1）请求头携带通用数据，例如token、用户名称等（2）对响应结果做统一的过滤处理：①未登录进行登录重定向（有登录要求的系统才需要）；②二进制流数据处理（通常是文件下载）③请求成功判断②请求失败通用处理：弹窗提示错误信息（根据选用的组件做UI通用）实现逻辑：（1）通过请求拦截器和响应拦截器加上通用的逻辑（2）如果使用了vue框架的还可以挂在在vue实例上，方便通过 this 访问完整代码如下：import axio.

JavaScript库Lodash.js：综合工具库，如常见的节流、防抖Numeral.js：格式化和操作数字Moment.js：格式化和操作日期时间UI库vxe-table：基于vue的表格组件，满足绝大部分表格需求

/***斐波那契数列：第n项等于前两项之和:0/1/1/2/3/5/8/13/21/34/....*//***使用递归实现，并不是最好的方法，因为存在大量的重复计算，例如获取第5个元素*f(5)*=f(4)+f(3)*=f(2)+f(3)+f(1)+f(2)*=f(2)+f(1)+f(2)+f(1)+f(2)*=1+0+1+0+1*=3*其中，f(1)/f(2...

冒泡排序算法思想：通过两两比较相邻值，如果反序则交换位置，这样较小的元素会冒泡到前面，较大的元素会沉淀至尾部实现思路：（1）设置一个哨兵，默认值为数组长度-1；*（2）通过i++循环两两比较相邻值，反序则交换位置，这样较小的元素会冒泡到前面，较大的元素会沉淀至尾部；一次循环过后，最大的元素会沉淀到尾部，哨兵位置-1*（3）继续i++循环直到哨兵位置为0...

/** * * @param {*} date 日期类型字符串或时间戳 * @param {*} formatString 格式化范本，如 yyyy-MM-dd hh:mm:ss * @return 返回符合格式要求的日期字符串 */ function formatDate(date, formatString) { if (!formatString) { // 无值则取默认值 yyyy-MM-dd hh:mm:ss formatString = 'yyyy-M..

在这里，先贴一篇文章 《非科班前端人的一道送命题：0.1+0.2 等于 0.3 吗？》

1.什么是XSS？hacker利用网页漏洞，将恶意代码植入网页中，使用户加载并执行这段恶意代码，达到攻击的目的。2.XSS可以达到什么目的？恶意代码通常是JavaScript，js能做什么事情就代表xss也能做什么事情。①获取用户cookiecookie代表用户的身份令牌，可想而知，一旦cookie被hacker获取，hacker就可以登录网站，假冒用户做他想做的事情，盗取用户信息。②劫持流量进行恶意跳转例如我们在网页中插入一段代码<script> ...

前端监控一般包括：1.性能监控；2.错误监控1.前端性能这里引用他人文章对前端性能的描述：通常前端性能可以认为是用户获取所需要页面数据或执行某个页面动作的一个实时性指标，一般以用户希望获取数据的操作到用户实际获得数据的时间间隔来衡量。简单的总结一下，就是一般用时间来衡量前端性能。比如一些耳熟能详的：白屏时间、首屏时间等那么当我们打开一个网页，如果获取跟网页性能相关的时间呢？2.性能数据采集打开控制台，输入window.performance可以看到performan...

现在市面上已经有很多成熟全局埋点的分析系统支持，比如腾讯移动端分析-小程序分析若让我们自己封装一个全局浏览记录上报呢？小程序的页面由Page({})构成，页面的生命周期有onLoad，每次页面加载会调用onLoad。要做浏览记录的上报，可以利用onLoad做文章。onLoad() { pageBrowse() // 上报浏览记录方法 --- 后面再讲这个方法怎么写，可以根据业务需求变动}但是如果在每个页面的onLoad都调用上报方法，未免太低效。若有50个页面，...

目录前言1. 逻辑分析2. websocket3. 小程序端代码实现4.服务端代码实现后记前言有兴趣的同学先扫码体验一下小程序继我的个人小程序（“你划我猜出题器”）上线第二版本（自建词库）后，又有新的想法涌现出来，做一个“谁是卧底”在线随机发牌吧（有时间再写一下第一个版本跟第二个版本的博文）。既然如此，就要思考一下“谁是卧底”的技术实现点。词的来源，可利...

目录前言1.需求场景2.页面效果图3.线上地址4.项目分析前言大三的时候写过一个小demo，socket.io实现在线匿名聊天室博客地址：https://blog.csdn.net/qq_30604453/article/details/64159036demo地址：http://www.chunling.online:2800/（此处请不要计较样式，毕竟...

目录前言1.开发前准备工作2.后台开发工作3.前端开发工作4.调试工作前言先回顾一下微信开发中涉及的各种概念以及微信网页授权的流程图【微信开发】常见的openid/unionid/session_key/access_token究竟是个啥？官方API文档：微信网页开发-网页授权1.开发前准备工作开发前的准备工作很简单，登录微信公众号后台...

我用的方法很简单，在App.vue中的生命周期函数created中，监听页面刷新，在页面刷新的时候，将store的数据及时存储在sessionStorage中，然后刷新完毕后就可以将sessionStorage中的数据再取出来用created () { //页面刷新store数据备份 if (localStorage.cmstoken) { this.$rout...

转至阮一峰的ECMAScript6入门 http://es6.ruanyifeng.com/#docs/stylees6知识点编程风格let代替var全局常量和线程安全在let和const之间优先使用const，尤其是在全局环境下所有函数声明都应该设置为常量const，符合函数式编程思想const声明，阅读代码的人立刻会意识到不应该修改这个值const防止无意间修改变量所...

1. flex布局下使用绝对定位结果：ios少部分机型的（ios10）和部分安卓机型的样式错乱，比如通过flex布局实现的子元素居中效果会不起作用。鉴于之前也遇到的类似的问题，很快就总结出一套规律：flex布局下不要使用绝对定位(absolute/fixed) .parent { display: flex; flex-direction: row; al...

原生js实现轮播图，说难不难，说简单不简单。基础套路还是来复习一下吧。先看图。先看html结构！很简单！ &lt;div class="slider"&gt; &lt;div class="slide-item slide-item-1"&gt;1&lt;/div&gt; &lt;div class="slide-item slide-item-2"

适配前先搞清楚几个像素的概念 像素概念： 1)物理像素：显示器上最小的物理显示单位 2)设备独立像素（也叫逻辑像素）：虚拟概念，一个可以由程序使用的最小虚拟像素点（css像素） 3)设备像素比：也叫dpr，可以通过window.devicePixelRatio获取。 设备像素比 = 物理像素 / 设备独立像素...

import axios from "axios";import baseUrl from "../../setBaseUrl";axios.defaults.baseURL = baseUrl;import { Loading, Message } from "element-ui";const loadingOptions = { lock: true, text: "拼命加...

排序算法平均情况最好情况最坏情况空间复杂度稳定性冒泡排序O(n2)O(n)O(n2)O(1)稳定快速排序O(nlog2n)O(nlog2n)O(n2)O(log2n)~O(n)不稳定直接插入排序O(n2)O(n)O(n2)O(1)稳定希尔排序O(nlog2n)~O(n2)O(n1.3)O(n2)O(1)不稳定简单选择排序O(n2)O(n2)O(n2)O(1)不稳定堆排序O(nlog2n)

JS继承有四种方式，分别是组合继承、原型式继承、寄生式继承、寄生组合式继承。其中最常用的是组合继承。1.组合继承：使用原型链继承共享的属性和方法，通过构造函数继承实例属性function Animal(name){ this.name = name;}Animal.prototype.sayName = function(){ alert(this.name);}funct...

add方法，传入一个参数items。items是一个数组，数组元素为{name:String,price:Number}。通过add方法可以在在购物车列表新增商品bind方法，实现点击删除，能够删除对应的列同时，注意总计的商品总价应该符合逻辑计算，所有价钱应该保留小数点后2位。<!DOCTYPE html><html> <head&...

同源策略：它是由Netscape提出的一个著名的安全策略。现在所有支持JavaScript 的浏览器都会使用这个策略。所谓同源是指，域名，协议，端口相同。跨域：跨域，指的是浏览器不能执行其他网站的脚本。它是由浏览器的同源策略造成的，是浏览器对javascript施加的安全限制。不受同源策略限制：①script标签的src属性；②img标签的src属性；③iframe标签的src属性；④link的hr

// 解析urlfunction getQueryStringArgs(){ var qs = (location.search.length&gt;0?location.search.substring(1):""); var args = {}; var items = qs.length?qs.split("&amp;"):[]; var item = null; v...

1.注意作用域（1）避免全局查找：将在一个函数中会用到多次的全局对象存储为局部变量总是没错的。 function updateUI(){ var imgs = document.getElementsByTagName('img'); for (var i = 0; i &lt; imgs.length; i++) { imgs[i].title = document.t...

var browser = { versions: function () { var u = navigator.userAgent, app = navigator.appVersion; return { //移动终端浏览器版本信息 trident: u.indexOf('Trident') &...

这是一个迷思。 $(document).on('click','.more',function(){ getRecord(page+1,5)});more结点是通过dom操作，后期在页面追加生成的。 上述代码是给more结点添加点击事件。 当我愉快地拿起真机测试时，所有安卓的手机测试完美！ 唯独同事的苹果机，点击事件不起作用。 泪如雨下。...

点击查看源代码》》》代码仓库今天用nodejs和socket.io实现在线聊天功能。总结一下socket.io的基本用法首先安装socket包 npm install socket.io在服务器端引用const socketio = require("socket.io");安装完包，引用这个socket的js文件 。他...

ajax有一个进度事件progress可以用于监听文件上传的进度  xhr.onprogress=function(event) { if( event.lengthComputable) { var percent = parseInt(event.position/event. totalS...

 以下是FullPage.js学习笔记    FullPage.js全屏滚动插件使用说明 FullPage.js是一个基于jquery的插件，它能够方便轻松地制作出全屏网站，主要功能有：支持鼠标滚动支持多个回调函数支持手机、平板触摸事件支持CSS3动画支持窗口缩放窗口缩放时自动调整可设置滚动宽度、背景颜色、滚动速度、循环选项、回调、文本对齐方式等下...

最近在做项目，是一个后台管理系统，需要很多前后台的数据交互。其中都是用到了ajax的异步交互。最开始接触 是直接使用 jquery ajax ，是一个比较方便的框架，使用简单。无需知道原理  直接  $.get();/$.post(); 就可以实现数据交互。但是当我需要实现一个进度条的功能时，我就一脸懵逼了。跟师兄要了实现进度条的代码，他用的都是原生的ajax，鉴于我没有学习过原生ajax，而...

&lt;style type="text/css"&gt; #tip{ border:2px #ff9900 solid; background:#ffffcc; width:200px; height:80px; display:none; } &lt;/style&gt; &lt;/head&gt; &lt;body&gt; &lt;div id="ou...

&lt;body&gt; 姓名： &lt;input type="text" name=""/&gt; 年龄：&lt;input type="text" name=""/&gt; &lt;button&gt;提交&lt;/button&gt; &lt;/body&gt; &lt;script type=&quo

实现网页换肤当点击颜色小图标时实现换肤，即     对导航条nav以及body的背景颜色进行更换 小图标的设置为（以红色为例）边框  border：1px  red solid；背景色 background：red；当图标被点击时背景色变为白色background：white； 其他的小图标类似 所以将  background：white；设置为类c...

/************************** 银行卡工具函数 *************************/ /*@param bank 银行卡所属银行简称，例如CCB/ICBC/....*/ /*@return bankname 银行卡所属银行中文名称 */ export function bankName(bank){ var bankname; ...

目录1. 常用的正则判断2. 常用的日期格式化3. Dom.js 常用DOM操作4. Bom.js 常用BOM操作5. DataType.js 数据类型判断6. Function.js 常用工具函数7. Http.js 请求函数封装8. WXHttp.js 微信请求函数封装1. 常用的正则判断/** 正则检验 */function isP...

1.JavaScript的定义 JavaScript是一种专门为与网页交互而设计的脚本语言。有下列三部分组成 ①ECMAScript，提供核心语言功能 ②文档对象模型（DOM），提供访问与操作网页内容的方法与接口 ③浏览器对象模型（BOM），提供与浏览器交互的方法与接口2.在HTML中使用javascript <script>元素 属性：async（异步），表示应该立即下载脚本；asyn