简易项目

cnpm init egg --type=simple
npx create-nuxt-app front

项目规范

commitlint,eslint,prettier,
husky 验证

git flow actions 验证

登录权限

图片验证码 svg-captcha
密码加密 md5
session 模式后端 setCookie 前端无需操作鉴权, redis 存储取值

jwt 模式 前端登录后 后端将登录信息和过期时间加密成一个 token,前端存入 localstorage 并在 axios 为每个请求携带上 jsonwebtoken

middleware 验证头部 header.authorization 的 token

邮箱验证 nodemailer

文件上传

浏览器选择文件 上传到服务器 返回上传进度 保存到服务器

为什么要用 multipart/form-data

因为application/x-www-form-urlencoded不适合用于传输大型二进制数据或者包含非 ASCII 字符的数据。平常我们使用这个类型都是把表单数据使用 url 编码后传送给后端,二进制文件无法一起编码进去。

而使用application/json,后端需要对文本进行特殊的解析,效率较低

多种格式上传

FormData
const file = document.getElementById('file').files[0];
var form = new FormData();
form.append('file', file);
Blob
ArrayBuffer
Base64

FileReader

前端文件上传亮点