nodejs 图片转换，批量压缩图片,上传图片

使用fs实现base64 与png/jpg/jpeg 互相转换

png与jpg转换

// 因为要用到异步操作所以需要用到util.promisify将函数转换
//第一种写法，
const util = require('util')
const readFile=util.promisify(fs.readFile)
readFile('./index.png').then(res=>{
    //得到图片的编码后  
     fs.writeFile('./index.jpg',res,(err)=>{
         //写入到jpg文件里
         if(err){console.log(err)}
         console.log('写入成功')s
     })
})
//第二种写法
  const util=require('util');
  const readFile=util.promisify(fs.readFile);
  const aa=async ()=>{
        const data=await readFile('./index.png');
        fs.writeFile('./index.jpg',data,err=>{
            if(err){console.log(err);return;}
            console.log('写入成功');
        })
  }
  aa()

 //第三种写法
 const data=fs.readFileSync('./index.png');
 fs.writeFile('./index.jpg',data,err=>{
     if(err){console.log(err);return;}
     console.log('写入成功')
 })

png与base64转换

const base=(url)=>{
const data=fs.readFileSync(url).toString('base64');
   return 'data:image/bmp;base64,'+data
}
  base(url);//url图片的路径

base64与png转换

  const BasePng=(base)=>{
      //base就是需要转换的base64编码
      const data=base.replace(/^data:image\/\w+;base64,/,'')
      //通过正则匹配掉base64的前缀
      fs.writeFile('./index.png',data,'base64',err=>{
          if(err){console.log(err);return;}
          console.log('写入成功')
      })
  }

使用images实现图片压缩

实现图片批量压缩需要使用到images模块，所以需要先npm install images

  const fs=require('fs');
  const images=require('images');
  const MySet=new Set();
  //声明一个集合用来存储所有图片文件的后缀
  MySet.add('jpg');
  MySet.add('png');
  MySet.add('jpeg')
  const jpgY=(path)=>{
      //path就是需要压缩图片的文件夹路径
      fs.readdir(path,(err,data)){
          if(err){console.log(err);return;}
          data.forEach(item=>{
              //对文件夹的内容进行遍历
              const FilePath=path+'/'+item
              fs.stat(FilePath,(err,stat)){
                  if(err){console.log(err);return;}
                  if(stat.isFile()){
                      //判断是文件还是文件夹
                      if(MySet.has(item.split('.')[1])){
                          //如果是文件则判断后缀是否是图片文件
                          const outPutName=path+'/author_'+item;
                          images(FilePath).save(outPutName,{ quality : 30  }) //图片质量为30
                      }
                  }else{
                      //如果是文件夹则循环进行遍历
                     jpgY(FilePath);
                  }
              }
          })
      }
  }
  jpgY('./Img')

nodejs实现前端上传图片后端接收

首先需要写一个前端简易的上传图片调取接口功能(html+jquery) 然后node通过koa搭建接口，接收图片保存

  //index.html
    <input id="fileupload" type="file" class="form-control" name="file">
    <script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>
    <script>
        $("#fileupload").on("change", function () {
            var file = this.files[0];
            var data = new FormData();
            data.append("file", file);
            $.ajax({
                type: "post",
                url: "/Img",
                data: data,
                contentType: false,
                //默认文件类型application/x-www-form-urlencoded  设置之后multipart/form-data
                processData: false,
                // 默认情况下会对发送的数据转化为对象 不需要转化的信息
                success: function (res) {
                    console.log(res,'res')
                    // source = res.picAddr;
                },
            });
        })
    </script>

    //index.js
const Koa = require('koa');
const app = new Koa();
const bodyParse=require('koa-body')
const router=require('koa-router')();
router.post('/Img',ctx=>{
    ctx.body='接收成功1'
   ctx.req.on('data', data=>{
    const buf=new Buffer(data);
      //拿到传过来的参数后写入module里
      fs.writeFile('./module/inputs.jpeg',buf,err=>{
         if(err){console.log(err);return;}
         console.log('存储成功')
      })
    });
  
})
router.get('/index',async ctx=>{
     ctx.type='html';
     ctx.body=fs.readFileSync('./index.html')
})
app.use(router.routes(), router.allowedMethods());
app.use(bodyParse({
    multipart:true,
}))
app.listen('3000', () => {
  console.log(`server is running at http://localhost:3000`)
});