一直想找一个动效，因为以前一直都是使用mode="out-in"；这种一般也就fade这种动效好看，如果要更好看一点，就需要花点心思了。效果原理通过给每个路由的自定义属性meta设置一个层级，第一层，第二层，第三层，也可以理解为第一页，第二页，第三页。然后通过这个层级关系判断页面是往左还是往右。源码[hide]vue<template> <div id="app"> <transition :name="transitionName"> <keep-alive&g...
听别人说node可以写爬虫，然后我去尝试了一下，有点累啊，大概原理其实用jq都能做出来效果，只是说没有后台操作了。原理利用http模块发出请求获取到网页信息通过cheerio插件进行提取信息保存遇到的一些问题首先就是提取信息，因为获取到的其实是一个html页面的内容，我们需要进行提取，这里当然用jq会方便很多，但是node里面没有jq，只有cheerio这个伪jq，所以很多jq的方便的方法，使用这个插件用不出来。特别是$(".box:nth-child(2)")这种选择器就无法使用，只能通过eq，和find进行截取，然后再each循环，性能上应该很浪费。转义有的站点他...
我找了很多个插件，发现都好难用，npm哪里的说明等于没有，你根本不知道他哪些配置参数怎么弄，百度的文章真的是五花八门，不是抄就是缺胳膊短腿， 想来想去还是自己写好了。日志的格式我是仿 koa-logger，我感觉他这个样式还不错，但是他这个插件只能console输出，如果是测试环境，还行，但是上线后作为日志保存，就不太行。我尝试去用他的方法去保存，会乱码，编码我也设置为utf8了，所以无解啊。（超蛋疼有没有）预览相对来说还是比较简单。原理通过中间件的形式，正常请求和发生错误，为此，我们需要创建一个全局的错误处理中间件，在这个里面我们触发自己写的日志方法。const logger = re...
centos 跨域模板location * { add_header Access-Control-Allow-Origin *; add_header Access-Control-Allow-Methods 'GET, POST, OPTIONS,DELETE,PATCH'; add_header Access-Control-Allow-Headers 'DNT,X-Mx-ReqToken,Keep-Alive,User-Agent,X-Requested-With,If-Modified-Since,Cache-Contr...
首先我们需要安装node，具体本博客搜索node，有一篇对应的教程。首先我们需要宝塔，因为需要ng反代，node他本身不能绑定域名的，所以就很蛋疼，如果我们还要配置https，用node来做就头疼的要死，用宝塔不到三分钟就搞定了。[hide]部署文件我们创建一个用于存放serve服务的文件夹，然后将server后端的一系列文件都传上去。cd /xxx/xx/xxx/xx 进入你的存放文件的目录此时我们可以像平时一样输入node server.js来启动后端服务，此时我们可以进行调试的。但是有个问题，这样启动的话，ssh命令界面一关闭，这个服务也就关闭了，我们不可能长期开着这个ssh窗口...
这个问题一般是出现在在路由鉴权的功能上。我们在路由守卫里面判断，当用户已经登录了，点击进入访客页，那么在进入之前我们next({name:"Home"})跳转到首页。然后就会报错：Error: Redirected from X to Y via a navigation guard.百度和谷歌找了好久，很多人都说是代码里面重定向过多，拜托，这种应该是键盘侠，如果真的过多，早就解决问题，还问个鸡腿。首先这个问题大部分都是出现在vue-router v3.1及以上的版本我觉得可能是插件的问题，因为出现这个问题的提问时间基本都是这两个月内出现的。唯一的解决办法就是降级，将...
es6的解构非常好用，可以省去很多代码。为此我测试了一些场景的错误没有对应的keyconst {data} = {datas:"文本"};这种情况下，有值，但是key无法解析，那么就会返回undefined，也就是data输出是个undefined没有值const {data} =null;这种情况就会报错，这个报错会停止js的运行，所以我们需要用try--catch捕获key对应的值为nullconst {data} ={datas:null};这种情况也不会报错，他会把null拿到综合情况const {data,test} ={datas:null};这种情况并不...
这个玩意真的太恶心了，强行换行，原本一行解决问题，现在要三行，真是日了狗了。找了半天发现只有一个方法：安装Beautify插件安装完毕后打开首选项 ---- 搜索 setting 随便找个选项，只要他有显示 在settings.json 中编辑 点击这个进入到配置文件他就是一个json对象，我们在第一个花括号里面加上如下内容："beautify.config": { "brace_style": "collapse,preserve-inline" }实际效果应该是：{ xxxxxx这里有很多自定义的配置...
生成管理员账号一般如果自己手动去改文件，设置一个name一个password也行，但是太麻烦了，node有一个模块，可以以问题得形式询问用户，然后用户输入内容，回车后会触发一个回调，回调的参数就是用户输入的内容。首先我们需要引入一个官方的模块：readline；libs/rl.jsconst readline = require("readline"); let rl = readline.createInterface({ input: process.stdin, output: process.stdout }); rl.questionAs...
对于密码的话，一般使用md5签名转成唯一的32位字符。md5不管文件有多大，都是只会生成32位，并且同一个文件，签名后结果都是相同的，而且这个结果不能反向破解，只能一个个的试，这种也称为暴力破解。暴力破击可以破解相对比较简单的密码，比如：123456 这种纯数字的。而且就算我们对同一个密码做两次md5，第一次生成的md5，第二次将第一次md5再次签名，一样也容易被人暴力破解。所以一般在第二次加密的时候，使用一段随机的字符，长度无所谓，中文都可以。libs/md5.jsmd5方法需要引入原生加密模块crypto。const crypto = require("crypto&quo...
整合一下服务：核心模块koa 框架koa-router 路由koa-static 发送静态文件（静态化文件）promise-fs 文件读写uuid 全局唯一标识符数据处理koa-better-body post数据和文件koa-convert koa-better-body的转换async方式的插件memorystream 内存流，高速数据生成promise-mysql 数据库sessionkoa-session sessionredis和bluebird redis后端渲染koa-ejs目录结构libs 用于存放自己写的通用模块log 用于存...
服务端渲染全称的 server side rendering 也就是所谓的ssr了，经常看到vue的一个关于seo优化的一个方案或者是防止首页白屏，一般选用ssr方案。优点：seo友好无兼容问题安全性高代码精简相对客户端渲染 client side rendering 客户端有两个优点：降低服务端，带宽压力用户体验好js运行速度快，生成html比服务端一个来回快很多。服务端渲染框架pug（jade）以前叫jade，现在叫pug，改名了。使用npm i pugconst pug=require('pug'); pug.renderFile( //模板 �...
使用mysql的话，虽然很稳定，但是相对读写来说，速度没有放在内存中快，于是我们可以使用redis首先是安装由于redis是针对linux的，window版本则是由微软小组进行转制作维护的，下载地址在githubredislinux版直接官网下载，或者用宝塔直接装。window版本的已经很老了，只有3.0，现在官网都6.0了，github是16年更新的。找到一个非官方的版本，目前更新到5.0了redis下载zip文件，解压打开redis server即可。使用需要安装两个插件，一个是redis，一个是用于将redis的老方法转为新异步方法的插件bluebirdnpm i redis bl...
session 的一些问题无法共享，因为所有网站不可能共用一台服务器，可能会有多个不安全，如果服务器崩溃，数据也会丢失性能低，普通的session文件都是存放本地，io非常慢（相对）于是就有两中方式进行优化：丢数据库mysql丢redis中mysqlkoa作者提供了一个接口store，这个接口也是在session的配置对象里的，他是一个对象，里面有三个生命周期函数，我称之为生命周期函数。他们会在session操作完后触发。server.use(session({ maxAge: 20 * 60 * 1000, renew: true, store: { ...
cookiecookie用于判断用户是谁，一般都是使用签名算法进行加密。加上cookie本身大小有限制，总大小才32k，头信息也才32k，所有不能太大，而且不能太多，最多20条，容量这样一算的话，单条才4k。koa创建cookie直接通过ctx对象：ctx.cookies.set(key,value);读取：ctx.cookies.get(key);签名server.keys = ["aaaa", "bbbb", "cccc"]; router.get("/", async ctx => { ct...
FormData是一种容器，用于模拟表单，向服务器发送数据，简单点来讲，他就是一个对象，键值对形式的对象。创建方式new出一个FormData对象，然后手动传入参数直接使用一个from元素转成FormData对象使用方式原生ajax配合使用let form = new FormData(); form.append("name","mulingyuer"); form.append("pass","123456"); let xhr = new XMLHTTPRequest(); xhr.open(&q...
禁用不处理文件禁用文件上传//post数据中间件 server.use(convert(body({ multipart : true })));buffer另一种文件上传形式，也是布尔值//post数据中间件 server.use(convert(body({ buffer : true })));限制上传大小有三个设置：maxFieldsSize 限制一个字段的最大大小 （默认20mb）maxFileSize 限制单个文件的最大大小 (默认200mb)maxFields 限制字段数量，比如限制最多20个文件上传 （默认100...
GET数据get的数据相对来时很简单，直接从ctx的query属性里面就可以直接获取到对应的数据router.get("/",async ctx=>{ console.log(crx.query); });POST数据post 相对来说难一点，我们需要使用一个中间件帮助我们获取数据安装：koa-better-bodynpm i koa-better-body由于这个插件使用的是generator，koa会提示这个不推荐的报错，所以我们还需要一个koa的转换插件：koa-convertnpm i koa-convert我们需要在激活body时 ，用conver...
按照官方的教程，在main文件中引入自定义的less文件，在这个前提下，我们需要less语言解析yarn add less less-loader --dev安装完我们main引入自定义的less文件，结果启动的时候出现错误：Inline JavaScript is not enabled .bezierEasingMixin();这个错误一般是因为新版本less带来的，你可以换旧版，比如5.0的版本我们在项目根目录找到vue.config.js文件，没有你就创建这个文件填入以下：module.exports = { css: { loaderOptions: {...
安装npm i koa-static一般建议创建一个目录专门保存静态文件，比如目录名：staticstatic一般放在最末尾use激活，表示如果前面的路由设置，或其他的都没有对应的，就进入的请求文件这。const Koa = require("koa"); const static = require("koa-static"); const server = new Koa(); server.listen(8080); server.use(require("./router")); server.use(stat...
最近评论