From 034744959f2656204135ad33a001dfa4e287a018 Mon Sep 17 00:00:00 2001 From: zoujiandong <10130823232@qq.com> Date: Fri, 16 Jan 2026 10:58:35 +0800 Subject: [PATCH] =?UTF-8?q?1.16=E6=9B=B4=E6=96=B0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- components/bangbang-screenShot.vue | 91 +++++++ .../bangbang-screenShot.vue | 91 +++++++ package.json | 1 + pages_app/buyPoint/buyPoint.vue | 1 + pages_app/myCode/myCode.vue | 232 +++++----------- pages_app/myWelfare/myWelfare.vue | 6 + tsconfig.json | 1 + .../sp-html2canvas-render/changelog.md | 57 ++++ .../sp-html2canvas-render.vue | 110 ++++++++ .../sp-html2canvas-render/package.json | 86 ++++++ uni_modules/sp-html2canvas-render/readme.md | 11 + .../sp-html2canvas-render/utils/index.js | 255 ++++++++++++++++++ utils/image-tools.js | 152 +++++++++++ 13 files changed, 922 insertions(+), 172 deletions(-) create mode 100644 components/bangbang-screenShot.vue create mode 100644 components/bangbang-screenShot/bangbang-screenShot.vue create mode 100644 uni_modules/sp-html2canvas-render/changelog.md create mode 100644 uni_modules/sp-html2canvas-render/components/sp-html2canvas-render/sp-html2canvas-render.vue create mode 100644 uni_modules/sp-html2canvas-render/package.json create mode 100644 uni_modules/sp-html2canvas-render/readme.md create mode 100644 uni_modules/sp-html2canvas-render/utils/index.js create mode 100644 utils/image-tools.js diff --git a/components/bangbang-screenShot.vue b/components/bangbang-screenShot.vue new file mode 100644 index 0000000..39e1531 --- /dev/null +++ b/components/bangbang-screenShot.vue @@ -0,0 +1,91 @@ + + + + + + + + + diff --git a/components/bangbang-screenShot/bangbang-screenShot.vue b/components/bangbang-screenShot/bangbang-screenShot.vue new file mode 100644 index 0000000..39e1531 --- /dev/null +++ b/components/bangbang-screenShot/bangbang-screenShot.vue @@ -0,0 +1,91 @@ + + + + + + + + + diff --git a/package.json b/package.json index 0072a1b..4859213 100644 --- a/package.json +++ b/package.json @@ -12,6 +12,7 @@ "@xkit-yx/utils": "^0.7.2", "crypto-js": "^4.2.0", "dayjs": "^1.11.18", + "html2canvas": "^1.4.1", "image-tools": "^1.4.0", "js-base64": "^3.7.8", "js-md5": "^0.8.3", diff --git a/pages_app/buyPoint/buyPoint.vue b/pages_app/buyPoint/buyPoint.vue index 4d50187..de33a8f 100644 --- a/pages_app/buyPoint/buyPoint.vue +++ b/pages_app/buyPoint/buyPoint.vue @@ -76,6 +76,7 @@ msg: { "price":res.data.amount, "order_id":res.data.order_id, + "trade_no":res.data.trade_no, 'jifen':res.data.point, }, }); diff --git a/pages_app/myCode/myCode.vue b/pages_app/myCode/myCode.vue index a1f4308..fd1f81f 100644 --- a/pages_app/myCode/myCode.vue +++ b/pages_app/myCode/myCode.vue @@ -1,8 +1,10 @@ - diff --git a/uni_modules/sp-html2canvas-render/package.json b/uni_modules/sp-html2canvas-render/package.json new file mode 100644 index 0000000..1e91cbb --- /dev/null +++ b/uni_modules/sp-html2canvas-render/package.json @@ -0,0 +1,86 @@ +{ + "id": "sp-html2canvas-render", + "displayName": "基于html2canvas和renderjs 指定盒子截图 截屏 截长屏", + "version": "1.2.3", + "description": "基于html2canvas和renderjs的页面指定盒子截图，截屏，可截长屏，页面生成图片", + "keywords": [ + "截图", + "截屏", + "截长屏", + "生成图片", + "html2canvas" +], + "repository": "", + "engines": { + "HBuilderX": "^3.8.0" + }, + "dcloudext": { + "type": "component-vue", + "sale": { + "regular": { + "price": "0.00" + }, + "sourcecode": { + "price": "0.00" + } + }, + "contact": { + "qq": "" + }, + "declaration": { + "ads": "无", + "data": "插件不采集任何数据", + "permissions": "无" + }, + "npmurl": "" + }, + "uni_modules": { + "dependencies": [], + "encrypt": [], + "platforms": { + "cloud": { + "tcb": "y", + "aliyun": "y", + "alipay": "n" + }, + "client": { + "Vue": { + "vue2": "y", + "vue3": "y" + }, + "App": { + "app-vue": "y", + "app-nvue": "u" + }, + "H5-mobile": { + "Safari": "y", + "Android Browser": "y", + "微信浏览器(Android)": "y", + "QQ浏览器(Android)": "y" + }, + "H5-pc": { + "Chrome": "y", + "IE": "y", + "Edge": "y", + "Firefox": "y", + "Safari": "y" + }, + "小程序": { + "微信": "u", + "阿里": "u", + "百度": "u", + "字节跳动": "u", + "QQ": "u", + "钉钉": "u", + "快手": "u", + "飞书": "u", + "京东": "u" + }, + "快应用": { + "华为": "u", + "联盟": "u" + } + } + } + } +} \ No newline at end of file diff --git a/uni_modules/sp-html2canvas-render/readme.md b/uni_modules/sp-html2canvas-render/readme.md new file mode 100644 index 0000000..536aee2 --- /dev/null +++ b/uni_modules/sp-html2canvas-render/readme.md @@ -0,0 +1,11 @@ +# sp-html2canvas-render + +### 文档迁移 + +> 防止文档失效，提供下列五个地址，内容一致 + +- [地址一](https://sonvee.github.io/sv-app-docs/docs-github/src/plugins/sp-html2canvas-render/sp-html2canvas-render.html) +- [地址二](https://sv-app-docs.pages.dev/src/plugins/sp-html2canvas-render/sp-html2canvas-render.html) +- [地址三](https://sv-app-docs.4everland.app/src/plugins/sp-html2canvas-render/sp-html2canvas-render.html) +- [地址四](https://sv-app-docs.vercel.app/src/plugins/sp-html2canvas-render/sp-html2canvas-render.html) (需要梯子) +- [地址五](https://static-mp-74bfcbac-6ba6-4f39-8513-8831390ff75a.next.bspapp.com/docs-uni/src/plugins/sp-html2canvas-render/sp-html2canvas-render.html) (有IP限制) diff --git a/uni_modules/sp-html2canvas-render/utils/index.js b/uni_modules/sp-html2canvas-render/utils/index.js new file mode 100644 index 0000000..1ef6bc0 --- /dev/null +++ b/uni_modules/sp-html2canvas-render/utils/index.js @@ -0,0 +1,255 @@ +function getLocalFilePath(path) { + if (path.indexOf('_www') === 0 || path.indexOf('_doc') === 0 || path.indexOf('_documents') === 0 || path.indexOf( + '_downloads') === 0) { + return path + } + if (path.indexOf('file://') === 0) { + return path + } + if (path.indexOf('/storage/emulated/0/') === 0) { + return path + } + if (path.indexOf('/') === 0) { + let localFilePath = plus.io.convertAbsoluteFileSystem(path) + if (localFilePath !== path) { + return localFilePath + } else { + path = path.substr(1) + } + } + return '_www/' + path +} + +function dataUrlToBase64(str) { + let array = str.split(',') + return array[array.length - 1] +} + +let index = 0 + +function getNewFileId() { + return Date.now() + String(index++) +} + +function biggerThan(v1, v2) { + let v1Array = v1.split('.') + let v2Array = v2.split('.') + let update = false + for (let index = 0; index < v2Array.length; index++) { + let diff = v1Array[index] - v2Array[index] + if (diff !== 0) { + update = diff > 0 + break + } + } + return update +} + +export function pathToBase64(path) { + return new Promise(function(resolve, reject) { + if (typeof window === 'object' && 'document' in window) { + if (typeof FileReader === 'function') { + let xhr = new XMLHttpRequest() + xhr.open('GET', path, true) + xhr.responseType = 'blob' + xhr.onload = function() { + if (this.status === 200) { + let fileReader = new FileReader() + fileReader.onload = function(e) { + resolve(e.target.result) + } + fileReader.onerror = reject + fileReader.readAsDataURL(this.response) + } + } + xhr.onerror = reject + xhr.send() + return + } + let canvas = document.createElement('canvas') + let c2x = canvas.getContext('2d') + let img = new Image + img.onload = function() { + canvas.width = img.width + canvas.height = img.height + c2x.drawImage(img, 0, 0) + resolve(canvas.toDataURL()) + canvas.height = canvas.width = 0 + } + img.onerror = reject + img.src = path + return + } + if (typeof plus === 'object') { + plus.io.resolveLocalFileSystemURL(getLocalFilePath(path), function(entry) { + entry.file(function(file) { + let fileReader = new plus.io.FileReader() + fileReader.onload = function(data) { + resolve(data.target.result) + } + fileReader.onerror = function(error) { + reject(error) + } + fileReader.readAsDataURL(file) + }, function(error) { + reject(error) + }) + }, function(error) { + reject(error) + }) + return + } + if (typeof wx === 'object' && wx.canIUse('getFileSystemManager')) { + wx.getFileSystemManager().readFile({ + filePath: path, + encoding: 'base64', + success: function(res) { + resolve('data:image/png;base64,' + res.data) + }, + fail: function(error) { + reject(error) + } + }) + return + } + reject(new Error('not support')) + }) +} + +export function base64ToPath(base64) { + return new Promise(function(resolve, reject) { + if (typeof window === 'object' && 'document' in window) { + base64 = base64.split(',') + let type = base64[0].match(/:(.*?);/)[1] + let str = atob(base64[1]) + let n = str.length + let array = new Uint8Array(n) + while (n--) { + array[n] = str.charCodeAt(n) + } + return resolve((window.URL || window.webkitURL).createObjectURL(new Blob([array], { + type: type + }))) + } + let extName = base64.split(',')[0].match(/data\:\S+\/(\S+);/) + if (extName) { + extName = extName[1] + } else { + reject(new Error('base64 error')) + } + let fileName = getNewFileId() + '.' + extName + if (typeof plus === 'object') { + let basePath = '_doc' + let dirPath = 'uniapp_temp' + let filePath = basePath + '/' + dirPath + '/' + fileName + if (!biggerThan(plus.os.name === 'Android' ? '1.9.9.80627' : '1.9.9.80472', plus.runtime.innerVersion)) { + plus.io.resolveLocalFileSystemURL(basePath, function(entry) { + entry.getDirectory(dirPath, { + create: true, + exclusive: false, + }, function(entry) { + entry.getFile(fileName, { + create: true, + exclusive: false, + }, function(entry) { + entry.createWriter(function(writer) { + writer.onwrite = function() { + resolve(filePath) + } + writer.onerror = reject + writer.seek(0) + writer.writeAsBinary(dataUrlToBase64(base64)) + }, reject) + }, reject) + }, reject) + }, reject) + return + } + let bitmap = new plus.nativeObj.Bitmap(fileName) + bitmap.loadBase64Data(base64, function() { + bitmap.save(filePath, {}, function() { + bitmap.clear() + resolve(filePath) + }, function(error) { + bitmap.clear() + reject(error) + }) + }, function(error) { + bitmap.clear() + reject(error) + }) + return + } + if (typeof wx === 'object' && wx.canIUse('getFileSystemManager')) { + let filePath = wx.env.USER_DATA_PATH + '/' + fileName + wx.getFileSystemManager().writeFile({ + filePath: filePath, + data: dataUrlToBase64(base64), + encoding: 'base64', + success: function() { + resolve(filePath) + }, + fail: function(error) { + reject(error) + } + }) + return + } + reject(new Error('not support')) + }) +} + +/** + * 图片地址转换为base64格式图片 + * @param {string} url 图片地址 网络地址 本地相对路径 + * @param {string} type base64图片类型 默认png + */ +export function urlToBase64(url, type = 'png') { + let promises + + // 网络地址 或者h5端本地相对路径 可使用request方式 + promises = new Promise((resolve, reject) => { + uni.request({ + url: url, + method: 'GET', + responseType: 'arraybuffer', + success: (res) => { + const base64 = `data:image/${type};base64,${uni.arrayBufferToBase64(res.data)}` + resolve(base64); + }, + fail: (err) => { + reject(err); + }, + }) + }) + + // #ifdef APP + if (!url.startsWith('http')) { + // app真机本地相对路径 + promises = new Promise((resolve, reject) => { + // 使用compressImage获取到安卓本地路径file:///... + uni.compressImage({ + src: url, + quality: 100, + success: (res) => { + const tempUrl = res.tempFilePath + plus.io.resolveLocalFileSystemURL(tempUrl, (entry) => { + entry.file((e) => { + let fileReader = new plus.io.FileReader(); + fileReader.onload = (r) => { + resolve(r.target.result) + } + fileReader.readAsDataURL(e) + }) + }) + }, + fail: (err) => { + reject(err); + }, + }) + }) + } + // #endif + + return promises +} \ No newline at end of file diff --git a/utils/image-tools.js b/utils/image-tools.js new file mode 100644 index 0000000..07fb5de --- /dev/null +++ b/utils/image-tools.js @@ -0,0 +1,152 @@ +function getLocalFilePath(path) { + if (path.indexOf('_www') === 0 || path.indexOf('_doc') === 0 || path.indexOf('_documents') === 0 || path.indexOf('_downloads') === 0) { + return path + } + if (path.indexOf('file://') === 0) { + return path + } + if (path.indexOf('/storage/emulated/0/') === 0) { + return path + } + if (path.indexOf('/') === 0) { + var localFilePath = plus.io.convertAbsoluteFileSystem(path) + if (localFilePath !== path) { + return localFilePath + } else { + path = path.substr(1) + } + } + return '_www/' + path +} + +export function pathToBase64(path) { + return new Promise(function(resolve, reject) { + if (typeof window === 'object' && 'document' in window) { + if (typeof FileReader === 'function') { + var xhr = new XMLHttpRequest() + xhr.open('GET', path, true) + xhr.responseType = 'blob' + xhr.onload = function() { + if (this.status === 200) { + let fileReader = new FileReader() + fileReader.onload = function(e) { + resolve(e.target.result) + } + fileReader.onerror = reject + fileReader.readAsDataURL(this.response) + } + } + xhr.onerror = reject + xhr.send() + return + } + var canvas = document.createElement('canvas') + var c2x = canvas.getContext('2d') + var img = new Image + img.onload = function() { + canvas.width = img.width + canvas.height = img.height + c2x.drawImage(img, 0, 0) + resolve(canvas.toDataURL()) + canvas.height = canvas.width = 0 + } + img.onerror = reject + img.src = path + return + } + if (typeof plus === 'object') { + plus.io.resolveLocalFileSystemURL(getLocalFilePath(path), function(entry) { + entry.file(function(file) { + var fileReader = new plus.io.FileReader() + fileReader.onload = function(data) { + resolve(data.target.result) + } + fileReader.onerror = function(error) { + reject(error) + } + fileReader.readAsDataURL(file) + }, function(error) { + reject(error) + }) + }, function(error) { + reject(error) + }) + return + } + if (typeof wx === 'object' && wx.canIUse('getFileSystemManager')) { + wx.getFileSystemManager().readFile({ + filePath: path, + encoding: 'base64', + success: function(res) { + resolve('data:image/png;base64,' + res.data) + }, + fail: function(error) { + reject(error) + } + }) + return + } + reject(new Error('not support')) + }) +} + +export function base64ToPath(base64, extName) { + return new Promise(function(resolve, reject) { + if (typeof window === 'object' && 'document' in window) { + base64 = base64.split(',') + var type = base64[0].match(/:(.*?);/)[1] + var str = atob(base64[1]) + var n = str.length + var array = new Uint8Array(n) + while (n--) { + array[n] = str.charCodeAt(n) + } + return resolve((window.URL || window.webkitURL).createObjectURL(new Blob([array], { type: type }))) + } + var fileName; + if (!extName) { + extName = base64.match(/data\:\S+\/(\S+);/) + if (extName) { + extName = extName[1] + } else { + reject(new Error('base64 error')) + } + fileName = Date.now() + '.' + extName; + } else { + fileName = Date.now() + extName; + } + if (typeof plus === 'object') { + var bitmap = new plus.nativeObj.Bitmap('bitmap' + Date.now()) + bitmap.loadBase64Data(base64, function() { + var filePath = '_doc/uniapp_temp/' + fileName + bitmap.save(filePath, {}, function() { + bitmap.clear() + resolve(filePath) + }, function(error) { + bitmap.clear() + reject(error) + }) + }, function(error) { + bitmap.clear() + reject(error) + }) + return + } + if (typeof wx === 'object' && wx.canIUse('getFileSystemManager')) { + var filePath = wx.env.USER_DATA_PATH + '/' + fileName + wx.getFileSystemManager().writeFile({ + filePath: filePath, + data: base64.replace(/^data:\S+\/\S+;base64,/, ''), + encoding: 'base64', + success: function() { + resolve(filePath) + }, + fail: function(error) { + reject(error) + } + }) + return + } + reject(new Error('not support')) + }) +} \ No newline at end of file