diff --git a/package.json b/package.json index 4b0e0a8107001b697da0579b77a5b215e36007a3..a96f2e7eb17de2fe445ce7a026bcc74caf4f0ada 100644 --- a/package.json +++ b/package.json @@ -36,6 +36,7 @@ "dependencies": { "base64-arraybuffer": "^0.2.0", "intersection-observer": "^0.7.0", + "pako": "^1.0.11", "safe-area-insets": "^1.4.1" }, "private": true, diff --git a/src/core/service/api/context/canvas.js b/src/core/service/api/context/canvas.js index cca1b43299d4ec969ccf42759a2740e3b39571bf..4beb30eaa0b408166defa5c686660d02f73e305a 100644 --- a/src/core/service/api/context/canvas.js +++ b/src/core/service/api/context/canvas.js @@ -801,16 +801,21 @@ export function canvasGetImageData ({ width, height }, callbackId) { - var pageId = getCurrentPageId() + const pageId = getCurrentPageId() if (!pageId) { invoke(callbackId, { errMsg: 'canvasGetImageData:fail' }) return } - var cId = canvasEventCallbacks.push(function (data) { - var imgData = data.data + const cId = canvasEventCallbacks.push(function (data) { + let imgData = data.data if (imgData && imgData.length) { + if (__PLATFORM__ === 'app-plus' && data.compressed) { + const pako = require('pako') + imgData = pako.inflateRaw(imgData) + delete data.compressed + } data.data = new Uint8ClampedArray(imgData) } invoke(callbackId, data) @@ -842,13 +847,23 @@ export function canvasPutImageData ({ var cId = canvasEventCallbacks.push(function (data) { invoke(callbackId, data) }) - // fix ... + let compressed + if (__PLATFORM__ === 'app-plus') { + const pako = require('pako') + data = pako.deflateRaw(data, { to: 'string' }) + compressed = true + } else { + // fix ... + data = Array.prototype.slice.call(data) + } + operateCanvas(canvasId, pageId, 'putImageData', { - data: Array.prototype.slice.call(data), + data, x, y, width, height, + compressed, callbackId: cId }) } diff --git a/src/core/view/components/canvas/index.vue b/src/core/view/components/canvas/index.vue index aab7a474608dd6ee7050b1cab28f40751200879f..0af208f61a814e0845f87d0c3aa8bde70875f427 100644 --- a/src/core/view/components/canvas/index.vue +++ b/src/core/view/components/canvas/index.vue @@ -435,16 +435,24 @@ export default { context.drawImageByCanvas(canvas, x, y, width, height, 0, 0, destWidth, destHeight, false) let result try { + let compressed if (dataType === 'base64') { data = newCanvas.toDataURL(`image/${type}`, qualit) } else { const imgData = context.getImageData(0, 0, destWidth, destHeight) - // fix [...]展开TypedArray在低版本手机报错的问题,使用Array.prototype.slice - data = Array.prototype.slice.call(imgData.data) + if (__PLATFORM__ === 'app-plus') { + const pako = require('pako') + data = pako.deflateRaw(imgData.data, { to: 'string' }) + compressed = true + } else { + // fix [...]展开TypedArray在低版本手机报错的问题,使用Array.prototype.slice + data = Array.prototype.slice.call(imgData.data) + } } result = { errMsg: 'canvasGetImageData:ok', data, + compressed, width: destWidth, height: destHeight } @@ -470,6 +478,7 @@ export default { y, width, height, + compressed, callbackId }) { try { @@ -478,6 +487,10 @@ export default { } const canvas = getTempCanvas(width, height) const context = canvas.getContext('2d') + if (__PLATFORM__ === 'app-plus' && compressed) { + const pako = require('pako') + data = pako.inflateRaw(data) + } context.putImageData(new ImageData(new Uint8ClampedArray(data), width, height), 0, 0) this.$refs.canvas.getContext('2d').drawImage(canvas, x, y, width, height) canvas.height = canvas.width = 0 diff --git a/yarn.lock b/yarn.lock index 51f4000653f8acdb4135fc8883a2136a56f7ee93..82c3579dfe94ece2f5ab0d65c933a6ab6cfb6231 100644 --- a/yarn.lock +++ b/yarn.lock @@ -7680,6 +7680,11 @@ p-try@^2.0.0: resolved "https://registry.npmjs.org/p-try/-/p-try-2.2.0.tgz#cb2868540e313d61de58fafbe35ce9004d5540e6" integrity sha512-R4nPAVTAU0B9D35/Gk3uJf/7XYbQcyohSKdvAxIRSNghFl4e71hVoGnBNQz9cWaXxO2I10KTC+3jMdvvoKw6dQ== +pako@^1.0.11: + version "1.0.11" + resolved "https://registry.yarnpkg.com/pako/-/pako-1.0.11.tgz#6c9599d340d54dfd3946380252a35705a6b992bf" + integrity sha512-4hLB8Py4zZce5s4yd9XzopqwVv/yGNhV1Bl8NTmCq1763HeK2+EwVTv+leGeL13Dnh2wfbqowVPXCIO0z4taYw== + pako@~1.0.5: version "1.0.11" resolved "https://registry.npmjs.org/pako/-/pako-1.0.11.tgz#6c9599d340d54dfd3946380252a35705a6b992bf"