form-data&mock&跨域

param获取路由里面的参数，query获取问号后面的参数

chalk包自定义字体颜色

form-data文件处理

input type=file上传文件， 要取到文件内容应该在dom选择后面加上.files[0]

formidable 因为express本身不能接收formdata，所以需要这个包(或者multer)来处理文件上传

form-data前端处理

const avatar = document.querySelector("#avatar").files[0];
//把文件组合成ajax需要的数据要用到form-data
//FormData是一个对象，用于ajax上传文件
const data = new FormData();
//使用append方法添加字段
//append第一个参数为后端所需要的参数名
data.append('avatar',avatar);
//这里添加除了文件之外的其它字段
data.append('name','tom');
//使用fetch处理请求
fetch('/api/v1/upload',{
  method:'post',
  body:data
})
.then(response => response.json())
.then(resp => {
  if(resp.code === 200){
    console.log(resp);
    avatarImg.setAttribute('src',resp.data.url);
  }
})

form-data路由处理

router.post('/upload',(req,res,next)=>{
  const form = new formidable.IncomingForm();
  //设置上传目录，express的静态资源目录
  form.uploadDir = path.join(process.cwd(),'public/uploads');
  //保持文件后缀
  form.keepExtensions = true;

  //解析请求
  form.parse(req, function(err, fields, files) {
    //fields是除文件外的其它字段，files是文件，err是错误信息
    //实际在后端工作时，还会去判断fields里面是否有关于权限的字段，比如token
    if(files){
      //files.avatar.path为图片的路径
      res.json({
        code:200,
        data:{
          errMsg: '上传成功',
      	  //extname获取文件扩展名，basename获取文件全部名字
          url: '/uploads/' + path.basename(files.avatar.path)
        }
      })
    }
  });
})

MOCKJS

npm i mockjs -S nodejs安装mock库

URL参数
params 获取路由里面的参数
query 获取问号后面的参数

//加上通配符id可以根据请求来做响应(rap2无法)
//只请求和id对应的数据
const generateDataById = (id) => {
  return Mock.mock({
    "code":200,
    data: [
      {
        id,
        "title": "@ctitle(2,10)",
        "img": "@image( '228x246', '@color',  '@word' )",
        "price": "@integer(50,500)",
        "label": "@cword('家人聚会',2)",
        "label_num": "@integer(0,3)"
      }
    ]
  })
}
router.get('/:id', function(req, res, next) {
  const {
    id
  } = req.params;
  res.json(generateDataById(id));
});

/*router.get('/:uid', function(req, res, next) {
	http://localhost:3000/api/v1/users/123456?id=1中，params的值为{uid:'123456'},query的值为{id:'1'}
}*/