自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+

NurTuam—何永杰

学无止境

  • 博客(32)
  • 收藏
  • 关注

原创 把正式域名映射到本地开发服务器

有时候我们会遇到接口需要线上域名才能够调试时,往往都是要上传代码后再构建,去到线上环境看,但一旦要反复修改,就又要重新上传,重新构建,这样操作太烦锁了,所以如果能有一个插件可以反向代理,把正式域名映射到本地开发服务器就好了

2022-11-01 11:12:02 1179 1

原创 Vite+Vue3增加版本号记录(验证线上环境是否已更新到最新版本)

有时候更新代码到线上域名时,会不知道自己的代码是否已更新到或者是否因为浏览器缓存而导致页面还是旧的,所以我们需要有一个东西去验证是否已经更新。

2022-10-31 14:31:26 3045 2

原创 使用更具可读性的方式设置Typescript类型

TypeScript 提供了一些内置的实用类型,可以更好的方式将类型从一种形式转换到另一种形式。这些内置的类型全局可用的,所以可以很方便的使用它们。Typescript泛型在了解 TypeScript 实用、类型之前,类型别名和泛型很重要。我们以在TypeScript中为任何现有类型创建类型别名。type MyString = string;let helloWorldMessage: MyString = 'Hello Wisdom Geek';泛型用于创建可重用的类型别名。假设我们有一个

2021-06-15 11:29:20 217 3

原创 csdn活动:免费领取会员啦!

最近,CSDN官方已推出最新版本V2.7的浏览器插件,此次更新主要是添加了活动,每周五领取CSDN会员。其实对于经常使用CSDN的我发现这个插件是非常不错的,它连自己站内的广告都屏蔽了,可谓是勇气可嘉呀????????。这是在谷歌浏览器扩展应用中安装插件后的样子。这是在浏览器打开时的样子,界面可以是比较漂亮的了,背景图可以点击右下角的风车图标随时更换,可以自行添加网址并生成以上自定义图标,方便开发者打开经常打开的网页。这是官网的宣传网页:以上活动只要下载插件就可以参与。最新插件地址:点击

2021-01-22 10:14:55 10854 15

原创 使用Vue3.0+vite初始化项目总结

前言众所周知,[email protected]集成的模块化工具是webpack,也是企业用的比较热门、成熟的模块化管理工具,那么除了webpack,比较热门的模块化工具还有snowpack、vite。weback跟snowpack的区别:注入css方式不同(大同小异)他们都有loader处理器对css进行解析,但并不会直接生成单独的css文件(依附的是mini-css-extract-plugin),而是加载一个js模块,然后在模块中通过DOM中API将css文本作为style标签的内容插入页面中:等于在

2020-12-29 16:39:02 3613 1

转载 [记录九]Vue+node+koa2+mysql+nginx+redis,全栈开发小程序和管理员管理系统项目——在服务器清除小程序上传的废弃图片

前言首先,实现小程序上传与下载的逻辑我这里是这么实现的:小程序点击图片调服务器提供的api——服务器收到此请求获取图片文件的信息并读取和写入本地,比如写到项目的某个文件中去——然后在api中返回一个映射地址,此地址就是上传的图片的服务端项目的相对位置——小程序拿到地址直接显示,并在最终请求的时候已数组的形式发回给服务端——期间服务端会将小程序显示的图片地址对应的图片文件返回去。正常业务是这样的,但是小程序上传完图片,又不想要了(比如实际上传了5张,最终删掉两张,剩下三张),但是此时服务端已经写入了被小程序

2020-12-11 17:05:50 124

转载 如何爬取线上小程序源码

前言前段时间看到某某小程序做得还不错,对于开发者来说肯定想搞一搞接口和源码啥的,但是我用抓包软件发现抓不了,反扒了。所以就直接撸源码撸。前期准备以下都是在电脑上装的:手机模拟器:MUMU模拟器 / 夜神模拟器 推荐使用MUMU模拟器文件管理器:re文件管理器装好上面的模拟器后,打开模拟器,在里面安装re管理器和微信:打开微信,访问你想要爬下来的小程序后使用RE管理器打开路径:你会看到像c31ad******es72这样类似的文件,这是多个微信号产生的文件。怕找不到的话先删除掉这些类似的文

2020-11-08 14:03:43 2899 4

原创 uniapp 多端兼容开发遇到的问题总结(四) ——专题:uView在弹出层里使用索引列表

前言在使用uView开发项目中,遇到了一个业务场景: 点击输入框弹出底部窗口,内置电话号码区号索引列表,点击切换区号 :当我根据逻辑以为在 u-popup 里加入 u-index-list 就行了,结果遇到问题了:索引列表滚动不了;选择索引字符,列表吸顶不了;瞄点与顶部距离有偏差。所以作者开始排查,但api文档没写相关用法,于是开始百度,但发现大家都在询问…(可能大家也百度过这类文章:https://ask.dcloud.net.cn/question/103729)于是作者只能去修改源

2020-11-06 19:39:26 7326 11

原创 uniapp 多端兼容开发遇到的问题总结(三)

昨天作者在Uniapp的插件市场里无意找到了一个很适合自己业务场景的UI框架 —— uView UI , 为啥说适合呢,大家有读过我前几篇文章的人都应该看出,比较出名的移动端UI库,像VantUI、ThorUI 这些 在某些平台测试时会有各种各样的问题,其官方文档也指出有些组件只对某些平台有效,解决办法也只能按需引入自己需要的对应该平台的组件,最终项目就会thorUI和VantUI掺杂在一起,这样对后期项目维护,多多少少也会有不方便的地方,那uView UI有哪些好处呢?uView UI的特性兼容安卓

2020-10-29 10:33:46 1210 1

原创 uniapp 多端兼容开发遇到的问题总结(二)

上篇文章说到当我同一套代码切换回h5时发现 van-dropdown-menu 和 van-datetime-picker 没效果显示,甚至还报错了,所以针对这个问题 这两个地方我选用了 thorUI 的 top-dropdown 和 tui-datetime,调一下样式,问题就完美解决啦!注意:所有组件最好是按需引入,不要全局引入;一来可以减少打包体积,二来是兼容性问题,当然如果你只是一两个小程序平台的话,那按需跟全局也没什么差别,满足自己的业务需求选用的UI库才是最合适的。第二个问题就是vantUI

2020-10-25 15:10:41 1191

原创 uniapp 多端兼容开发遇到的问题总结(一)

前言基于业务需求,需要开发小程序并同时在多个平台发布,那无疑选择uniapp框架开发最适合。即可以节省开发成本,又可以减少开发时间,简直太爽了!但一套这么强大的框架固然也有许多坑等着我们去踩,只有踩坑才能让我们慢慢熟悉了解,那么下面就是记录我在开发过程中遇到了的问题:技术栈选用:uniapp + VantUIvan-dropdown-menu 下拉菜单切换初次从tab1->tab2 效果没问题;再从tab2->tab1 事件没进排查问题:遮罩层级问题,导致点击没效果解决:改变源码

2020-10-20 19:24:54 4256

转载 [记录八]Vue+node+koa2+mysql+nginx+redis,全栈开发小程序和管理员管理系统项目——使用定时任务执行脚本

前言系统的日常维护必然不能单靠人24小时守着电脑去操作系统;像数据的同步、交易流水的校验、订单号的初始值等等需要在晚上或者系统使用量最低的时候去做,避免数据的丢失。为此选好时间让系统自动在那个时间去执行脚本就显得非常重要了。本节介绍定时执行脚本。下载node-schedule依赖yarn add node-schedule导入使用//app.jsconst schedule = require('node-schedule')const script = require('./util/sc

2020-10-09 17:18:06 182 1

转载 [记录七]Vue+node+koa2+mysql+nginx+redis,全栈开发小程序和管理员管理系统项目——生成请求日志

前言日志是系统非常重要的东西,倘若生成环境中突然报错或异常,要想快速知道哪里出现了问题,最快的方式就是查看系统日志。日志不仅仅是系统异常后帮助定位错误的作用,也可以了解用户操作了什么请求,客户端ip和所在地址都是可以知道的,将用户的操作信息保存下来供系统管理员查看。下面来看看node是如何将日志信息保存下来并提供api给前端查看。日志表结构这是数据库的其中一张数据表,我将请求日志信息保存在这,方便管理员可以查看。创建生成日志的中间件//app.js// 日志app.use(async (ct

2020-10-09 17:09:53 193

转载 [记录六]Vue+node+koa2+mysql+nginx+redis,全栈开发小程序和管理员管理系统项目——服务端图片上传与下载

本项目需要涉及前端上传图片与显示图片,为此自己实践一下图片相关的东西,挺有意思所以就分享出来。实现思路:服务端的处理方式是将前端上传的文件保存在服务端本地,然后重命名该文件名字,再将图片在服务端的路径存入表中,前端请求图片地址的时候去服务端找出文件并返回给前端显示。在routes文件夹下新建一个common.js文件//common.js//导入所需模块const router = require('koa-router')()const api = require('../controller

2020-09-30 17:45:46 124

转载 [记录五]Vue+node+koa2+mysql+nginx+redis,全栈开发小程序和管理员管理系统项目——使用swagger自动生成接口文档

因为我们是异地对接接口文档,为此有对接文档是非常必要的,经过对比我选用swagger,但是node使用swagger有很多坑(细节)需要注意,我花费了两天时间才将文档展现出来,尤其是对注释部分需要严格按照格式去写。我这里选用swagger-jsdoc和koa2-swagger-ui去实现。首先我们在routes文件夹中另起一个文件swagger.js,为什么在routes文件下呢?因为在给到别人看文档的时候你是打开127.0.0.1:300/swaggger这样的网址的,所以它相当于node的其中一个路

2020-09-28 11:20:57 128

转载 [记录四]Vue+node+koa2+mysql+nginx+redis,全栈开发小程序和管理员管理系统项目——token控制接口权限

上节我们已了解后端是如何将数据加密成token以及如何解密回用户数据的,但是并没有做到用户没有登录就不可以请求某个接口(需要用户信息的api),这样不控制的话就直接请求那就会报错了,当然为了安全是肯定要对大部分接口进行登录后才能调用的控制的。这里我采用中间件去控制。在utils文件夹下新建一个whiteList.js文件这里就写免登录的接口路由,这些是客户端不传登录态token也是可以调用成功了,后面需要不登录就能调用接口就直接在这个数组后面加多个接口的路由。在app.js中编写一个中间件,根据上面

2020-09-24 17:29:27 133

转载 [记录三]Vue+node+koa2+mysql+nginx+redis,全栈开发小程序和管理员管理系统项目——token校验登录态

项目中凡是涉及到用户登录注册的都需要一个登录态来验证用户的登录状态,常用的登录台无外乎是token、session啊这些标识。这里我使用的是token字段。token一般会包含用户的个人信息,如:账号、账号id、用户名等等,更为安全的是加入一个自定义的盐(salt)一起加密,防止用户信息泄漏。下面就一起来使用一下:说到token,肯定会想到后端是怎么知道前端给我的token是不是我传给他的有效值呢?就是说后端需要有个值去跟前端传过来的token进行比较才知道合法性。所以后端在生成token的同时自己也需要

2020-09-24 17:25:29 109

转载 [记录二]Vue+node+koa2+mysql+nginx+redis,全栈开发小程序和管理员管理系统项目——编写接口路由

前言写这个项目需要用到很多的依赖,node导入依赖也很方便,直接:let mysql=require('mysql')以下是我做这个项目使用到的依赖:后面都会一一来使用和介绍。编写接口编写接口之前需要配置数据库和写一个处理sql语句的方法。在controllers文件夹下新建defaultConfig.js和mysqlConfig.js。//defaultConfig.jsconst config = { // 数据库配置 database: { DATABASE:

2020-09-24 17:08:19 167 3

转载 [记录一]Vue+node+koa2+mysql+nginx+redis,全栈开发小程序和管理员管理系统项目——前期准备

前言做兄弟,在心中!~最近和兄弟们在开发一款小程序以及配套的后台管理系统,有个兄弟主要负责后端的开发,选用了适合前端人的服务端开发语言node.js,开发过程中一边解决问题和积累经验,精神可嘉,作为他的兄弟的我为了共同学习和有此需求的童鞋们,因此分享给你们一并进步!此博客会一直更新到这个项目的结束以及在生产环境上遇到的问题的总结,纯属个人的锻炼技术。如果有不足的地方,大家可以留言多多指出,我们会努力改进的。开发环境前期准备:1、下载集成环境(⚠️下载它的最新版避免踩坑。)。MxSrvs集成软件:它

2020-09-24 16:58:36 181

原创 JS原型相关知识点(面试)

文章目录前言原型一把梭typeof && instanceof 原理浅析ES5 中的继承实现方式ES6 类的实现原理原型一把梭函数对象和普通对象`__proto__`prototypeconstructortypeof && instanceof 原理基本用法原理浅析instanceof基本用法前言要重新拾回技术的热情啦,所以为了基础积累或者为了以后面试需要,还是要好好总结一番~原型一把梭函数对象和普通对象__proto__prototypeconstruct

2020-09-10 17:44:39 226 1

转载 从Vue源码角度深挖Watch、Computed

实例分析computed和watch前言这篇文章将带大家全面理解vue的watcher、computed和user watcher,其实computed和user watcher都是基于Watcher来实现的,我们通过一个一个功能点去敲代码,让大家全面理解其中的实现原理和核心思想。所以这篇文章将实现以下这些功能点:实现数据响应式基于渲染wather实现首次数据渲染到界面上数据依赖收集和更新实现数据更新触发渲染watcher执行,从而更新ui界面基于watcher实现computed基于wa

2020-08-25 22:23:05 159

原创 防抖节流之总结篇

防抖节流之总结篇前言为了处理用户行为会频繁的触发事件执行,而对于DOM的操作、资源加载等耗费性能的处理,很可能会导致界面卡顿,甚至浏览器奔溃,而函数的节流与防抖就是为了解决类似需求而产生的。防抖概念:在短时间内多次触发同一个函数,只执行最后一次。应用场景:表单输入验证表单输入触发搜索 ajaxresize/scroll/touch/mouseove 事件原理:通过计时器延迟函数执行,短时间内再次触发时重置并添加新计时器。实现:基础版:function debounce(fn,w

2020-08-13 21:47:07 333 2

原创 小程序Canvas注意的问题

小程序Canvas注意的问题前言当我们要做海报生成、描绘图片后保存这类需求时,往往离不开一个原生组件 —— canvas;但canvas在文档中都是一些常规的操作,所以导致不能满足我们日常所要的需求,当我们实际开发的过程中,就会遇到各种各样的坑,所以我收集了下常见的问题,希望大家可以多多参考!~1. canvas的异步执行canvas 中很多 API 都是异步执行,这导致很多问题!例如:点击按钮保存图片为什么是空的等等…canvasContext.drawImage 不能直接用网络图片(也

2020-08-03 23:41:32 624 2

原创 修改github地址

github地址改变之前的文章的GitHub地址要发生点变化噢,改为这个:https://github.com/NurTuam我也会尽量放多些开源项目进去给大家学习的~!多多支持!本人会持续更新哒 ❤️

2020-08-02 21:30:35 719 1

原创 ES的语法糖-babel的可选链和双问号语法

ES的语法糖-babel的可选链和双问号语法前言ES全称为ECMAScript,是JavasSript的一种语言标准。ECMAScript发布新语法规范需向TC39委员会提案,任何人都可以向其会提案。TC39由包括许多浏览器厂商在内的各方组成,提案需要经历五个阶段,每个阶段的变动都需要由TC39委员会批准(传送门:TC39),如下: Stage 0: strawman——最初想法的提交。 Stage 1: proposal(提案)——由TC39至少一名成员倡导的正式提案文件,该文件包括API事例。 St

2020-08-02 21:23:25 3093

原创 webpack提速构建

写在开头项目开发过程中插件使用得都不知道多爽!~ 特别是一些非常另类的需求,真的不喜欢自己花大量的时间和精力去写写改改,用开源插件可能一个小时就搞定了,但单项目要发包或者构建时,问题出现了:打开太慢了!(因此我还背过不少的锅…)发现问题随着时间的迁移和代码体积越来越庞大,开发体验的问题也就随之出现。比如,使用webpack-dev-server启动服务时,你可能需要等待90s;又比如,改一行...

2020-01-11 17:16:39 244

原创 vue+element el-upload上传的二次封装

el-upload上传功能的二次封装不得不说,vue+elemenUI开发后台管理系统,就像西红柿配鸡蛋一样,真的超搭哒~~(不是说vue搭其他UI库就有缺陷,但从业务出发来说无疑是快和强的)el-uploa使用方法:https://element.eleme.cn/#/zh-CN/component/upload做后台就必会遇到上传Excel文件的功能啦,所以为了方便自己的开发和简化代码,...

2019-10-31 11:15:38 3015

原创 commonJS规范下的webpack

为什么要使用webpack假设:a.js 依赖 b.jsb.js 依赖 c.jsc.js 依赖 d.js所以在前端去引用这些依赖的时候,往往是这样的: <script src='a.js'></script> <script src='b.js'></script> <script src='c.js'></sc...

2019-07-22 20:47:08 384

原创 前端性能优化相关知识点

前端性能优化—总结哎呀~~,这篇文章半年前我就想写了,哈哈哈

2019-06-23 17:51:54 212

原创 微信小程序 语音录制功能和文件(ppt、word、excel、pdf、txt格式)上传

语音录制提醒:因为开发者工具不能接收语音文件,所以要使用真机调试测试噢~思路:使用小程序API wx.startRecord 、wx.stopRecord 方法(调用前 记得 app.js 添加 scope.record),获取到本地录音后上传到服务器,返回该服务器文件地址。wxml文件: <button class="{{luStatu?'btTouch':'bt'}}" b...

2019-05-25 17:19:25 1662 3

原创 小程序 - 实现【一键复制】、【一键保存】功能

需求:制作类似三里商学院小程序的【复制文案】、【一键保存】功能。目的:使用户更便捷地提取想要的信息。使用【一键复制】思路:把需要的文字复制到手机剪贴板,使用小程序API wx.setClipboardData 方法。wxml文件:<!-- 一键复制 --><view class='co_copy' bindtap='bindcopy' data-descripti...

2019-03-29 11:24:39 1226 2

原创 微信小程序 页面传值文本解密问题

微信小程序 页面传值文本解密问题遇到问题最近在做小程序,遇到这样一个需求:将百度的Ueditor编辑器存入的文本数据显示在小程序中,需要保留之前的样式,这就用到了 WxParse插件,它能够用解析html标签,也能全部解析。首先要下载WxParse插件第一步:去 https://github.com/icindy/wxParse 下载wxParse,注意:只拷贝wxParse文件夹。...

2019-02-05 00:58:02 461

空空如也

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

提示
确定要删除当前文章?
取消 删除