This post talks about how to generate a snapshot image from canvas and upload to Node.js, and then save to BOS. Since BOS has limit for file name, we first save it locally on Node.js server and then upload to BOS.
Generate Images from Canvas
This generates a path starting with data:image/png;base64, and if you enters this path in Web Browsers, it gives the image generated.
Upload to Node.js Server
I use jQuery to post the data url to Node.js.
On the server side, we use req.body.img to get the posted parameter.
Since Node.js has a limit for post data, we need to set the limit to be large enough in app.js.
Upload to BOS
BOS is a object storage service provided by Baidu. With npm baidubce-sdk, we can have an easy access to it with Node.js. Here is an example of uploading file to BOS.
Here, localName is the file name on Node.js server, while remoteName is the file name you want to store in the BOS bucket.
BOS has a limit for file name, so we can’t just use the generated base64 name data:image/png;base64,... as localName.
One approach is to save the image on Node.js server as temporary image with random name and upload to BOS, which will then be deleted from Node.js server afterwards.