Scratch3.0 儲存縮略圖

修改原生元件

// 首先修改元件 RenderWebGL.js, 添加 preserveDrawingBuffer: true
// 檔案位址 node_modules\scratch-render\src\RenderWebGL.js 

// 修改前
static _getContext (canvas) {
    return twgl.getWebGLContext(canvas, {alpha: false, stencil: true});
}

// 修改後
static _getContext (canvas) {
    return twgl.getWebGLContext(canvas, {alpha: false, stencil: true, preserveDrawingBuffer: true});
}
           

擷取畫布對象，儲存成圖檔到七牛雲上

// 将類名為stage_stage_DTWo5的canvas對象轉換成png對象
$("canvas.stage_stage_DTWo5")[0].toBlob(function (blob) {
    // 使用七牛儲存檔案需要使用npm七牛雲的js元件
	let observable2 = qiniu.upload(blob, "儲存的檔案名", "七牛Token", {}, {});
	let observer2 = {
		next(res){
			console.log("作品縮略圖上傳進度：", res.total.percent+"%");
		},
		error(err){
			console.log("作品縮略圖上傳異常：", err);
		},
		complete(res){
			console.log("作品縮略圖上傳結果：", res);
		}
	}
	observable2.subscribe(observer2) // 上傳開始
}, "image/png");