- 博客(92)
- 收藏
- 关注
RSS订阅原创 Http知识
2. 协商缓存：第一次请求，服务器会返回Last-Modified（资源的最后修改时间）和ETag（资源的唯一标识，字符串），浏览器再次请求的时候会带上if-Modified-Since或if-None-Match去请求，服务器会进行比较，如果一致则304，从客户端缓存获取资源，如果不一致，则返回200，带上新的标识和资源；可能会造成http对头阻塞：当顺序发送的请求序列中的一个请求因为某种原因被阻塞时，在后面排队的所有请求也一并被阻塞，会导致客户端迟迟收不到数据。二、nginx配置http2.0。
2023-05-08 17:09:49
609
原创 webpack和vite: Gzip打包压缩
Gzip压缩是一种http请求优化方式，通过压缩文件体积来提高请求加载速度。需要前端打包生成.gz后缀的文件，同时nginx配置文件启动gzip
2023-03-13 11:06:21
1413
原创 vue3 + typescript 实操踩的坑
前提：vue3其实也上了很久了，现在都vue3.2了，上个月中才开始在真正的项目中使用上。记录一下遇到的知识点和踩过的坑。
2022-08-01 15:12:34
438
原创 Taro UI 表单验证
前提其实这个很久之前就想写了，但是因为最近一直在搞vue3，就拖到现在了。TaroUI对表单的验证不是很友好，所以写了个表单组件，涵盖验证功能。
2022-08-01 10:52:02
1369
1
原创 Taro（React+typescript）+Taro Ui 踩坑
前提：因为需要做个采集的h5，想用React写，因此选择了Taro+Taro UI，其实之前也写过，但是在正式项目中并没有使用过，因此踩了一些坑
2022-06-15 17:12:46
1194
原创 地图飞线图 echart+高德地图实现
前提：其实这个东西已经做了很久了，但是因为昨天他突然不显示了，所以重新整了一下实现效果：一、引入echart的两个js和高德地图<!-- 引入echarts --><script src="./static/js/echarts.min.js"></script><script src="./static/js/echarts-amap.min.js" charset="UTF-8"></script><!-- .
2022-05-19 10:58:00
2115
原创 uniapp 蓝牙连接条码枪/扫描枪 HID模式
需求：要求蓝牙连接条码枪，接受条码枪扫描的数据一、原理蓝牙连接条码枪HID模式，其实就相当于一个键鼠输入设置，按下条码枪按钮，input的就自动显示输入的数据 蓝牙连接条码枪BLE模式，是蓝牙广播模式，需要主动接收广播，这一块我还没有实现出来，后续研究后再补上二、代码1. 获取已经连接上的蓝牙设备（原生native.js）// 原生native.js蓝牙 获取已经连接的条码枪，这一步需要提前连接条码枪search() { var main = plus.android.runtim
2022-05-10 16:43:35
3770
12
原创 微信小程序：IOS访问不了接口，安卓可以正常访问
前提：以前的小程序都是访问腾讯云、阿里云这些云端服务器，证书都是正常的。这一次是部署的服务器，证书是有问题，导致小程序端IOS访问不了接口，但是安卓可以正常访问一、小程序访问包括IOS访问有问题，安卓可以正常访问二、检测证书是否正常检测网站SSL服务器证书安装检查器_OPENSSL工具包_迅通诚信通过检测网站，如果检测网站所有证书都正常，就可以了。我那时候检测结果是缺少中间证书，所以IOS访问不了三、找技术经理解决证书问题，解决好了就可以访问了哈哈哈...
2022-04-24 15:04:37
3430
原创 签名组件 微信小程序/Vue
一、微信小程序<template> <div class="bmxt box-jwbs"> <div class="content-jwbs"> <div> 请在下面方框中使用正楷字体签名 </div> <div class="box-autograph"> <canvas class="firstCanvas"
2022-03-10 10:10:46
1450
原创 uni-app 打开文件(文件或文件流)
需求：uniapp可以在平板上面打开excel文件或word文件，可以用wps打开后打印1. 创建个koa项目模拟后台返回二进制文件流const router = require("koa-router")();const xlsx = require("node-xlsx");router.get("/excel", async (ctx, next) => { const res = [ ["name", "age"], ["wuliu", "111"],
2022-02-17 10:35:26
5661
3
原创 uni-app 踩坑
开头：最近做一个平板app，比较简单，为了快速开发上手，所以用uniapp，踩了一些坑相关链接：uni-app官网一、开发工具+基础模板1. 使用HBuilder X编辑器进行开发DCloud - HBuilder、HBuilderX、uni-app、uniapp、5+、5plus、mui、wap2app、流应用、HTML5、小程序开发、跨平台App、多端框架2. 新建项目，选择uni-app默认模板，其他的配置（store、router、api等）自己加上去3. ui库（uni-u
2022-01-24 17:16:16
8760
原创 vue 图片拖拽验证码
思路：1. 需要从后台获取：小拼图的初始位置y,小拼图的图片以及背景图片；2：图片滑动之后将小拼图的x和y传给后台一、封装图片拖拽code组件<template> <div id="slideVerify" class="slide-verify" :style="widthlable" onselectstart="return false;"> <canvas ref="canvas" :width="w" :height="h" />
2021-04-23 16:58:35
1766
2
原创 flv.js的使用
需求：因为之前项目用的是vue-video-player的flash模式播放flv，而谷歌浏览器在2021并不支持flash，因此采用哔哩哔哩团队开发的flv.js进行替换1. 引入依赖npm install flv2. 代码<videoclass="video-playervjs-custom-skin"ref="videoElement"controlsautoplaymuted>You...
2021-04-12 17:36:14
595
原创 node 复制图片到另外一个文件夹
代码const fs = require("fs");var files = fs.readdirSync("./public/1/"); // 需要复制的所有图片files.forEach(item => { var readStream = fs.createReadStream("./public/1/"+ item); // 被复制文件 // 创建一个写入流 var writeStream = fs.createWriteStream("./public/
2021-03-17 17:42:43
843
2
原创 vite+vue3+element-plus搭建项目 踩坑
需求：因为vue3出了一段时间了，element也出了基于vue3.x版本的element-plus，vite打包听说很快，尝试一下。一、用vite构建项目npm install -g create-vite-appcreate-vite-app vite_demonpm install二、安装element-plus依赖，在main.js全局引入PS：element-plus不兼容element-ui，一些提示类组件前面要加El，比如ElMessagenpm install e
2021-03-17 17:39:43
2905
3
原创 node express 导入excel转成想要的excel格式下载
需求：根据不同考试，导入不同格式的excel，再将excel转成想要的格式一、创建一个experss项目express 文件名二、使用html模板1. npm install ejs2.app.jsvar ejs = require("ejs"); // 引入ejsapp.engine("html", ejs.__express);app.set("view engine", "html");三、界面文件 index.html<!DOCTYPE html>
2021-03-04 17:54:35
361
1
原创 vue 在线看PDF(PC端和移动端)
一、PC端：直接用iframe，让后台返回文件流就可以看到了<template> <div> <!-- PDF --> <iframe :src="url" width="100%" height="900px"></iframe> </div></template><script>export default { data() { return {
2021-01-21 14:28:31
879
原创 微信小程序 uploadFile 加 复杂对象属性
const info = { ksjhid: this.ksjhid, sbno: '0f607264fc6318a92b9e13c65db7cd3c', 'collectKsInfo.examinee.ksxm': this.username, 'collectKsInfo.examinee.sfzh': this.idcard}wx.uploadFile({ url: baseUrl + projectName + url, //仅为示例，非真实的接口地址 filePath: file.
2020-08-20 15:27:23
362
原创 element-ui table树结构 增删查改+全选 踩坑
前提：项目表格是树结构，增删查改不能刷新整个表格，因为官网关于树结构表格的方法比较少，所以踩坑分享下一、关于全选坑：树结构里面它只勾选第一层的数据，子数据都是没有勾选的解决方法：@select-all=“selectAll” 写个方法自己全选....不过这也是有坑的，这种方法只能在一次性拿到tableDatad的情况下使用。我试了异步加载树结构好像没拿到tableData，所以不能进行全选代码：<el-table ref="table" :data="tableData"
2020-05-28 14:47:10
2292
3
原创 微信小程序（3）swiper组件和自定义顶部
前提：又派去别的组开发小程序了...记录一下这次开发用到的组件和遇到的问题一、swiper组件 因为要左右滑动切换图片，所以就用了swiper组件，其实这个组件调用很简单，用mpvue的时候要使用事件用@change就可以了<swiper :indicator-dots="false" :autoplay="false" :current="current" @c...
2020-04-28 17:14:18
639
原创 vue-video-player 播放m3u8流
一、安装npm install videojs-contrib-hls -s二、引入之前我是用import'videojs-contrib-hls' 没有用的！！！用下面这种才可以consthls=require('videojs-contrib-hls')Vue.use(hls)三、引入option参数consturl='https://...
2020-03-20 11:03:28
2922
2
原创 ASE加密和解密
import CryptoJS from 'crypto-js'const keyStr = 'XXXXXXX' // 秘钥// 加密export const encryptAes = message => { var key = CryptoJS.enc.Utf8.parse(keyStr) var srcs = CryptoJS.enc.Utf8.parse(mess...
2020-03-04 17:48:18
720
1
原创 DEC解密
一、安装crypto-jsnpm install crypto-js二、代码import cryptoJs from 'crypto-js'const key = 'ABCDEFGFEDCBA1234567890_' // 秘钥export const encryptDes = message => { const keyHex = cryptoJs.enc.Utf...
2020-02-26 16:00:16
758
2
原创 微信小程序调用摄像头
一、调用摄像头与身份证对比验证 摄像头层级太高，要用cover-view和cover-image写按钮和icon，才能覆盖在camera上二、代码<template> <div class="bmxt container-camera"> <camera device-position="front" flash...
2019-12-30 18:06:48
12076
5
原创 微信小程序（2）
前提：最近因为被派去别的组，开发微信小程序，遇到了很多坑，记录一下一、框架 1. mpvue 2. vant-ui二、踩过的坑1. 分包 因为有一次提交的时候，提示主包文件过大，不能超过2M，所以就需要将代码分包 需要注意的是：tabBar标签所需要的路由链接，都必须写在主包里面，packageA和packageB必须在pages文件下 ap...
2019-12-30 18:04:41
344
原创 浏览器摄像头调用拍照
1. 调用摄像头getCompetence() { this.validTip = '验证中' var _this = this this.thisCancas = document.getElementById('canvasCamera') this.thisContext = this.thisCancas.getContext('2d'...
2019-11-20 19:44:26
642
原创 浏览器播放语音SpeechSynthesisUtterance
目的：因为公司项目需要来浏览器播放语音，看了科大讯飞的产品，后面有发现html5有原生的api，更加方便，所以使用了一、语音合成和语音识别 “语音识别(Speech Recognition)”目前的就Chrome浏览器和Opera浏览器默认支持，但是，“语音合成(Speech Synthesis)”的兼容性要好上太多了Chrome，FF，Edge，Safari等等都是支持的。二...
2019-10-25 11:43:35
9578
5
原创 Reate路由 react-router-dom
一、概念 实现页面跳转二、安装yarn add react-router-dom三、根组件引入 import { BrowserRouter, Route } from 'react-router-dom'<BrowserRouter> <Route path="/" exact render={() => <div&g...
2019-09-26 14:20:16
329
原创 element-ui upload 使用formData和不使用formData
前提：因为需求允许上传文件或不上传文件，尝试了用element-ui的upload写上传，探究怎样写最简洁一、使用formdata<el-upload ref="upload" class="avatar-uploader" :action="VUE_APP_BASE_API+'/sysBase/updateSysBase?trackId='+trackId...
2019-09-20 15:17:02
7476
2
原创 Redux
一、概念 1. React是由facebook团队开发 2. Redux = Reducer + Flux 3. 实现组件之间状态互相传递二、工作流程三、安装yarn add reduxyarn add react-redux四、下载Redux DevTools五、代码store/index.jsimport { cr...
2019-09-18 11:23:19
76
原创 vue 兄弟组件传值
前言：一般兄弟组件传值，我们会想到用子传给父，再传给另外一个子；或者采用vuex进行传值。前者过于麻烦，后者又感觉没必要用到vuex，这时候就可以用下面这个方法进行兄弟间的传值一、创建一个bug文件作为介质传值二、主动传值的子组件importBusfrom'@/utils/bus'Bus.$emit('changeDepartment',msg)三、接收传值...
2019-08-14 17:19:40
369
原创 qs 数组格式
前言：因为和后台对接，传数组的时候格式都不是后台想要的，记录一下一、概念qs.stringify()作用是将对象或者数组序列化成URL的格式二、数组格式1. 默认方括号export function addScene(data) { return request({ url: '/cemsys/scene/addScene', m...
2019-08-12 11:57:03
1964
原创 微信小程序 mpVue + vant
相关链接：微信小程序：https://developers.weixin.qq.com/miniprogram/dev/component/input.htmlvant：https://youzan.github.io/vant-weapp/#/buttonmpVue:https://github.com/Rychou/mpvue-vant/tree/master/demom...
2019-08-08 19:07:43
199
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人