Cloud development Image processing

One, two-dimensional code qrcode

In the mobile Internet era, QR code is a very important entrance, sometimes we need to put some text, WEB and even files, pictures, business cards and other information into a small QR code, so that users can sweep the code through the mobile phone to obtain the information transmitted. Cloud functions can also create QR codes with the help of third-party modules, such as node-qrcode.

Technical documentation: node-qrcode Github address

Using developer tools, create a cloud function, such as qrcode, and then add the dependency on the latest version of qrcode latest at package.json and install it with npm install:

"dependencies": {
    "qrcode": "latest"
  }

Then enter the following code in index.js, where the created QR code is written to a temporary folder, and then the fs.createReadStream method is used to read the picture, upload it to cloud storage, or use cloud storage as a transition to implement an operation from the service side to the small terminal.

const cloud = require('wx-server-sdk')
const fs = require('fs')
const QRCode = require('qrcode')
cloud.init({
    env: cloud.DYNAMIC_CURRENT_ENV
  })
exports.main = async (event, context) => {
//text为二维码里包含的内容，将创建的二维码图片先存储到/tmp临时文件夹里，命名为qrcode.png
  const text="二维码里的有腾讯云云开发"
  await QRCode.toFile('/tmp/qrcode.png',text, {
  color: {
    dark: '#00F',  // 蓝点
    ight: '#0000' // 透明底
  }
}, function (err) {
    if (err) throw err
    console.log('done')
   })
  //读取存储到/tmp临时文件夹里的二维码图片并上传到云存储里，返回fileID到小程序端
  const fileStream = await fs.createReadStream('/tmp/qrcode.png')
  return await cloud.uploadFile({
    cloudPath: 'qrcode.jpg',
    fileContent: fileStream,
  })
}

After executing the cloud function, we can see in the cloud storage the QR code image we generated, .jpg library. If you want to deeply customize a QR code that better meets your requirements, you can go through the links to the technical documentation given above.

Second, Sharp high-speed image processing library

Sharp is a high-speed image processing library that facilitates image editing operations such as cropping, formatting, rotational transformation, filter addition, picture composition (such as watermarking), picture stitching, etc., and supports JPEG, PNG, WebP, TIFF, GIF and SVG formats. Sharp is used on the cloud function side to process pictures, while cloud storage can act as a bridge between the service side and the small terminal to pass the picture.

Because image processing is a very performance-consuming thing, not only will the memory of cloud functions have requirements, may also cause the cloud function timeout, the following is just to study the feasibility of using cloud functions to process pictures, we do not do so in the actual development, it is recommended to use cloud development expansion capabilities to process images, more powerful (in a later section, we will introduce).

Technical documentation: Sharp official technical documentation

Using the developer tool, create a cloud function such as sharp, then add the dependency of the latest version of n ode-qrcode latest at package.json, and right-click the cloud function directory to select the input command npm install installation dependency in the terminal:

"dependencies": {
    "sharp": "latest"
 }

Then enter the following code in the index.js where we assume that the source of the picture is cloud storage, we need to download the picture first, and then use sharp to process the picture, after processing the picture back to the cloud storage.

const cloud = require('wx-server-sdk')
const fs = require('fs')
const path = require('path')
cloud.init({
    env: cloud.DYNAMIC_CURRENT_ENV,
})
const sharp = require('sharp');
exports.main = async (event, context) => {
//这里换成自己的fileID，也可以在小程序端上传文件之后，把fileID传进来event.fileID
    const fileID = 'cloud://xly-xrlur.786c-xly-xrlur-1300446086/1572315793628-366.png'
//要用云函数处理图片，需要先下载图片，返回的图片类型为Buffer
    const res = await cloud.downloadFile({
      fileID: fileID,
    })
    const buffer = res.fileContent  
//sharp对图片进行处理之后，保存为output.png，也可以直接保存为Buffer
    await sharp(buffer).rotate().resize(200).toFile('output.png')
// 云函数读取模块目录下的图片，并上传到云存储
    const fileStream = await fs.createReadStream(path.join(__dirname, 'output.png'))
    return await cloud.uploadFile({
        cloudPath: 'sharpdemo.jpg',
        fileContent: fileStream,
    })
}

You can also let sharp do not need to first to toFile into a picture, but directly into buffer, so that you can be directly as a parameter to fileContent uploaded to cloud storage, such as:

const buffer2 = await sharp(buffer).rotate().resize(200).toBuffer();
    return await cloud.uploadFile({
        cloudPath: 'sharpdemo2.jpg',
        fileContent: buffer2,
    })

It should be noted that sharp has certain preconsidetions, node .js version needs to be v10.13.0 plus, and the server where the cloud function is located is configured libvips binaries, the cloud function of cloud development is not very supportive at present, the future cloud development will upgrade the version of Nodejs. Regarding the library of image processing, we can also go to the Github awesome-nodejs project to see if there are any other suitable solutions, but more recommended is the use of cloud-developed image processing expansion capabilities, or strongly recommend that all users with image processing needs should install image processing expansion capabilities.