微信小程序图片上传oss
2024-06-11 20:52:29
1.新建四个文件
base64.js
const Base64 = {// private property_keyStr: "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/=",// public method for encodingencode: function (input) {var output = "";var chr1, chr2, chr3, enc1, enc2, enc3, enc4;var i = 0;input = Base64._utf8_encode(input);while (i < input.length) {chr1 = input.charCodeAt(i++);chr2 = input.charCodeAt(i++);chr3 = input.charCodeAt(i++);enc1 = chr1 >> 2;enc2 = ((chr1 & 3) << 4) | (chr2 >> 4);enc3 = ((chr2 & 15) << 2) | (chr3 >> 6);enc4 = chr3 & 63;if (isNaN(chr2)) {enc3 = enc4 = 64;} else if (isNaN(chr3)) {enc4 = 64;}output = output +this._keyStr.charAt(enc1) + this._keyStr.charAt(enc2) +this._keyStr.charAt(enc3) + this._keyStr.charAt(enc4);}return output;},// public method for decodingdecode: function (input) {let output = "";let chr1, chr2, chr3;let enc1, enc2, enc3, enc4;let i = 0;input = input.replace(/[^A-Za-z0-9\+\/\=]/g, "");while (i < input.length) {enc1 = this._keyStr.indexOf(input.charAt(i++));enc2 = this._keyStr.indexOf(input.charAt(i++));enc3 = this._keyStr.indexOf(input.charAt(i++));enc4 = this._keyStr.indexOf(input.charAt(i++));chr1 = (enc1 << 2) | (enc2 >> 4);chr2 = ((enc2 & 15) << 4) | (enc3 >> 2);chr3 = ((enc3 & 3) << 6) | enc4;output = output + String.fromCharCode(chr1);if (enc3 != 64) {output = output + String.fromCharCode(chr2);}if (enc4 != 64) {output = output + String.fromCharCode(chr3);}}output = Base64._utf8_decode(output);return output;},// private method for UTF-8 encoding_utf8_encode: function (string) {string = string.replace(/\r\n/g, "\n");var utftext = "";for (var n = 0; n < string.length; n++) {var c = string.charCodeAt(n);if (c < 128) {utftext += String.fromCharCode(c);} else if ((c > 127) && (c < 2048)) {utftext += String.fromCharCode((c >> 6) | 192);utftext += String.fromCharCode((c & 63) | 128);} else {utftext += String.fromCharCode((c >> 12) | 224);utftext += String.fromCharCode(((c >> 6) & 63) | 128);utftext += String.fromCharCode((c & 63) | 128);}}return utftext;},// private method for UTF-8 decoding_utf8_decode: function (utftext) {var string = "";var i = 0;var c = c1 = c2 = 0;while (i < utftext.length) {c = utftext.charCodeAt(i);if (c < 128) {string += String.fromCharCode(c);i++;} else if ((c > 191) && (c < 224)) {c2 = utftext.charCodeAt(i + 1);string += String.fromCharCode(((c & 31) << 6) | (c2 & 63));i += 2;} else {c2 = utftext.charCodeAt(i + 1);c3 = utftext.charCodeAt(i + 2);string += String.fromCharCode(((c & 15) << 12) | ((c2 & 63) << 6) | (c3 &
63));i += 3;}}return string;}
}
export default Base64crypto.js
var base64map = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/";
let Crypto = {};
Crypto.HMAC = function (hasher, message, key, options) {// Allow arbitrary length keyskey = key.length > (hasher._blocksize * 4) ?hasher(key, {asBytes: true}) :util.stringToBytes(key);// XOR keys with pad constantsvar okey = key,ikey = key.slice(0);for (var i = 0; i < hasher._blocksize * 4; i++) {okey[i] ^= 0x5C;ikey[i] ^= 0x36;}var hmacbytes = hasher(util.bytesToString(okey) +hasher(util.bytesToString(ikey) + message, {asString: true}), {asBytes: true});return options && options.asBytes ? hmacbytes :options && options.asString ? util.bytesToString(hmacbytes) :util.bytesToHex(hmacbytes);
}
var util = Crypto.util = {// Bit-wise rotate leftrotl: function (n, b) {return (n << b) | (n >>> (32 - b));},// Bit-wise rotate rightrotr: function (n, b) {return (n << (32 - b)) | (n >>> b);},// Swap big-endian to little-endian and vice versaendian: function (n) {// If number given, swap endianif (n.constructor == Number) {return util.rotl(n, 8) & 0x00FF00FF |util.rotl(n, 24) & 0xFF00FF00;}// Else, assume array and swap all itemsfor (var i = 0; i < n.length; i++)n[i] = util.endian(n[i]);return n;},// Generate an array of any length of random bytesrandomBytes: function (n) {for (var bytes = []; n > 0; n--)bytes.push(Math.floor(Math.random() * 256));return bytes;},// Convert a string to a byte arraystringToBytes: function (str) {var bytes = [];for (var i = 0; i < str.length; i++)bytes.push(str.charCodeAt(i));return bytes;},// Convert a byte array to a stringbytesToString: function (bytes) {var str = [];for (var i = 0; i < bytes.length; i++)str.push(String.fromCharCode(bytes[i]));return str.join("");},// Convert a string to big-endian 32-bit wordsstringToWords: function (str) {var words = [];for (var c = 0, b = 0; c < str.length; c++, b += 8)words[b >>> 5] |= str.charCodeAt(c) << (24 - b % 32);return words;},// Convert a byte array to big-endian 32-bits wordsbytesToWords: function (bytes) {var words = [];for (var i = 0, b = 0; i < bytes.length; i++, b += 8)words[b >>> 5] |= bytes[i] << (24 - b % 32);return words;},// Convert big-endian 32-bit words to a byte arraywordsToBytes: function (words) {var bytes = [];for (var b = 0; b < words.length * 32; b += 8)bytes.push((words[b >>> 5] >>> (24 - b % 32)) & 0xFF);return bytes;},// Convert a byte array to a hex stringbytesToHex: function (bytes) {var hex = [];for (var i = 0; i < bytes.length; i++) {hex.push((bytes[i] >>> 4).toString(16));hex.push((bytes[i] & 0xF).toString(16));}return hex.join("");},// Convert a hex string to a byte arrayhexToBytes: function (hex) {var bytes = [];for (var c = 0; c < hex.length; c += 2)bytes.push(parseInt(hex.substr(c, 2), 16));return bytes;},// Convert a byte array to a base-64 stringbytesToBase64: function (bytes) {// Use browser-native function if it exists//if (typeof btoa == "function") return btoa(util.bytesToString(bytes));app返回403，暂时注释var base64 = [],overflow;for (var i = 0; i < bytes.length; i++) {switch (i % 3) {case 0:base64.push(base64map.charAt(bytes[i] >>> 2));overflow = (bytes[i] & 0x3) << 4;break;case 1:base64.push(base64map.charAt(overflow | (bytes[i] >>> 4)));overflow = (bytes[i] & 0xF) << 2;break;case 2:base64.push(base64map.charAt(overflow | (bytes[i] >>> 6)));base64.push(base64map.charAt(bytes[i] & 0x3F));overflow = -1;}}// Encode overflow bits, if there are anyif (overflow != undefined && overflow != -1)base64.push(base64map.charAt(overflow));// Add paddingwhile (base64.length % 4 != 0) base64.push("=");return base64.join("");},// Convert a base-64 string to a byte arraybase64ToBytes: function (base64) {// Use browser-native function if it existsif (typeof atob == "function") return util.stringToBytes(atob(base64));// Remove non-base-64 charactersbase64 = base64.replace(/[^A-Z0-9+\/]/ig, "");var bytes = [];for (var i = 0; i < base64.length; i++) {switch (i % 4) {case 1:bytes.push((base64map.indexOf(base64.charAt(i - 1)) << 2) |(base64map.indexOf(base64.charAt(i)) >>> 4));break;case 2:bytes.push(((base64map.indexOf(base64.charAt(i - 1)) & 0xF) << 4) |(base64map.indexOf(base64.charAt(i)) >>> 2));break;case 3:bytes.push(((base64map.indexOf(base64.charAt(i - 1)) & 0x3) << 6) |(base64map.indexOf(base64.charAt(i))));break;}}return bytes;}
};
Crypto.mode = {};
export default Crypto;sha1.js
import Crypto from './crypto.js';
/*!* Crypto-JS v1.1.0* http://code.google.com/p/crypto-js/* Copyright (c) 2009, Jeff Mott. All rights reserved.* http://code.google.com/p/crypto-js/wiki/License*/
(function () {// Shortcutvar util = Crypto.util;// Public APIvar SHA1 = Crypto.SHA1 = function (message, options) {var digestbytes = util.wordsToBytes(SHA1._sha1(message));return options && options.asBytes ? digestbytes :options && options.asString ? util.bytesToString(digestbytes) :util.bytesToHex(digestbytes);};// The coreSHA1._sha1 = function (message) {var m = util.stringToWords(message),l = message.length * 8,w = [],H0 = 1732584193,H1 = -271733879,H2 = -1732584194,H3 = 271733878,H4 = -1009589776;// Paddingm[l >> 5] |= 0x80 << (24 - l % 32);m[((l + 64 >>> 9) << 4) + 15] = l;for (var i = 0; i < m.length; i += 16) {var a = H0,b = H1,c = H2,d = H3,e = H4;for (var j = 0; j < 80; j++) {if (j < 16) w[j] = m[i + j];else {var n = w[j - 3] ^ w[j - 8] ^ w[j - 14] ^ w[j - 16];w[j] = (n << 1) | (n >>> 31);}var t = ((H0 << 5) | (H0 >>> 27)) + H4 + (w[j] >>> 0) + (j < 20 ? (H1 & H2 | ~H1 & H3) + 1518500249 :j < 40 ? (H1 ^ H2 ^ H3) + 1859775393 :j < 60 ? (H1 & H2 | H1 & H3 | H2 & H3) - 1894007588 :(H1 ^ H2 ^ H3) - 899497514);H4 = H3;H3 = H2;H2 = (H1 << 30) | (H1 >>> 2);H1 = H0;H0 = t;}H0 += a;H1 += b;H2 += c;H3 += d;H4 += e;}return [H0, H1, H2, H3, H4];};// Package private blocksizeSHA1._blocksize = 16;
})();ossUtil.js
import Crypto from './crypto.js';import './sha1.js';import Base64 from './base64.js';const uploadFileSize = 1024 * 1024 * 20; // 上传文件的大小限制20m// 获取本地存储的oss信息let _ossConfValue = wx.getStorageSync("_ossConfValue");console.log(_ossConfValue);if (_ossConfValue) {_ossConfValue = JSON.parse(_ossConfValue)}const accesskey = _ossConfValue.accessKeySecret || "";const OSSAccessKeyId = _ossConfValue.accessKeyId || "";console.log(OSSAccessKeyId);console.log(accesskey);export default {// 设置文件上传大小以及失效时间_getPolicy() {let policyText = {"expiration": "2029-01-01T12:00:00.000Z", //设置该Policy的失效时间，超过这个失效时间之后，就没有办法通过这个policy上传文件了"conditions": [["content-length-range", 0, uploadFileSize] // 设置上传文件的大小限制]};return Base64.encode(JSON.stringify(policyText))},// 设置Signature_getSignature(message) {let bytes = Crypto.HMAC(Crypto.SHA1, message, accesskey, {asBytes: true});return Crypto.util.bytesToBase64(bytes);},// 获取文件后缀名_getSuffix(filename) {let suffix = ''let pos = filename.indexOf('.')if (pos != -1) {suffix = filename.substring(pos)}return suffix;},// 设置上传的图片地址getImgName() {return `${_ossConfValue.filePath}${this.guid()}${new Date().getTime()}.png`;},// 设置上传的文件地址getFileName(fileType) {return `${_ossConfValue.filePath}${new Date().getTime()}@${fileType}`;},// 获取STS签名get_STS() {return new Promise((resolve, reject) => {// 设置文件上传大小以及失效时间 let policy = this._getPolicy();let res = {filePath: _ossConfValue.filePath,OSSAccessKeyId,url: _ossConfValue.domainName, // 远程aliyun地址policy, // policy信息signature: this._getSignature(policy) // signature信息};resolve(res)})},guid() {return 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function (c) {var r = Math.random() * 16 | 0,v = c == 'x' ? r : (r & 0x3 | 0x8);return v.toString(16);});}};2. 封装微信本地调用图像函数
function wxChooseImage(sourceType = ['album', 'camera'], count = 1, sizeType = ['original', 'compressed']) {return new Promise((resolve, reject) => {wx.chooseImage({count,sizeType,sourceType,success(res) {resolve(res);},fail(e) {reject(e)}})})
}3.approve
// pages/nameApprove/index.js
import http from "../../api/httpUtils"
import Url from "../../api/url"
const app = getApp()
import {wxToast,wxSwitchTab,wxChooseImage,wxUploadFile,generateRandom
} from '../../api/wxSdkUtils'
import OSSUtil from "../../utils/ossUtil.js"Page({/*** 页面的初始数据*/data: {identityCardUrl: "",idCardNum: "",name: "",address: "",uploadUrl: "",uploadImg: "",ocrUrl: "",ocrIdCardDto: {},avatarUrl: "",needOrc: true},async approveIdCard() {let sign = await OSSUtil.get_STS();let {filePath,url,policy,signature,OSSAccessKeyId} = signlet key = filePath + generateRandom(20) + '.png'let sourceType;if (!this.data.needOrc) {sourceType = ['camera']}wxChooseImage(sourceType).then(res => {const tempFilePaths = res.tempFilePathsif (this.data.needOrc) {this.setData({uploadUrl: res.tempFiles[0].path,ocrUrl: key})} else {this.setData({avatarUrl: key})console.log("自拍", this.data.avatarUrl);}let params = {url,filePath: tempFilePaths[0],name: "file",formData: {key, // 服务器文件夹 + 文件路径policy, // policy信息OSSAccessKeyId,signature, // signature信息success_action_status: "200"}}console.log(params);this.uploadFile(params)})},uploadFile(params) {wxUploadFile(params).then(res => {console.log(res);if (this.data.needOrc) {this.ocrDiscern()} else {this.setData({needOrc: true})this.smApprove();}}).catch(err => {wxToast({title: '上传失败',icon: "none"})})},smApprove() {let params = {avatarUrl: this.data.avatarUrl,ocrIdCardDto: this.data.ocrIdCardDto,identityCardUrl: this.data.ocrUrl,}http.post(Url.related.approve, params).then(res => {wxToast({title: '实名认证成功'})wx.navigateBack({delta: 1})})},ocrDiscern() {let params = {front: true,imgUrl: this.data.ocrUrl}http.post(Url.common.ocr, params).then(res => {console.log("orc识别成功", res);let {name,idCardNum,address} = resthis.setData({idCardNum,namme,address,ocrIdCardDto: res})})},handleSave: function () {if (!this.data.idCardNum) {wxToast({title: '请输入身份证',icon: "none"})return;}if (!this.data.name) {wxToast({title: '请输入姓名',icon: "none"})return;}if (!this.data.address) {wxToast({title: '请输入身份证地址',icon: "none"})return;}this.setData({needOrc: false,ocrIdCardDto: {...this.data.ocrIdCardDto,idCardNum: this.data.idCardNum,name: this.data.name,address: this.data.address,}})this.approveIdCard()},onLoad: function (options) {// this.src = require()console.log("OSSUtil", OSSUtil);},
})微信小程序图片上传oss相关推荐
- 微信小程序图片上传九宫格拖拽组件
微信小程序图片上传&九宫格拖拽组件 前言 图片上传加九宫格拖拽是一个比较常用的组件,常用于发帖或者评论等内容上传模块,我这篇九宫格拖拽的思路是借鉴了一款优雅的小程序拖拽排序组件实现这篇文章 实 ...
- **微信小程序图片上传+后台PHP修改图片名称**
微信小程序图片上传+后台PHP修改图片名称 前端代码:比较随意 <view class="weui-uploader"><view class="img ...
- 微信小程序图片上传（文字识别）
要点:OCR文字识别 图片上传 在最近的项目中遇到需要进行OCR识别,中间遇到的坑记录一下 OCR接口:采用百度OCR通用文字识别 在进行调试过程中遇到下列问题: 百度ocr接口1.对图片经行base ...
- 微信小程序 图片上传与内容安全审核
文章目录 原由 内容审核种类 小程序云开发 图片检测 创建云函数 编写图片检测代码 小程序图片处理 图片上传 图片压缩 云函数安全检测接入 文本检测 最后的坑 原由 之前有开发一个微信小程序,拥有图片 ...
- 微信小程序图片上传到java后台
前言 关于云存储的文件上传,我想说的真的挺多的,这是一篇纯原创的基于小程序 或者是SpringBoot的云存储的全过程. 整篇教学很细很细,适合于所有的java学习者,特别是刚刚结束学习java想要练 ...
- uniApp 生成微信小程序图片上传提示 fail url not in domain list 的解决方法
问题表现: uniApp 生成微信小程序,获取内容程序不报错,但是图片上传提示 fail url not in domain list 错误. 问题分析: 微信小程序:服务器域名配置 每个微信小程序需 ...
- 微信小程序-图片上传
微信小程序有原生的API接口,来进行图片的选取.上传 wx.chooseImage(Object object) | 微信开放文档 (qq.com)https://developers.weixin. ...
- C#实现微信小程序图片上传
C#后端接口: public string FileUploads() {string parameters = "";try{string path = "/tmp/& ...
- java 微信图片上传_微信小程序图片上传java端以及前端实现
小程序的图片上传与传统的图片上传方式有一些不一样 如果你有幸看到这篇文章,恭喜你,你可以完美解决了. 话不多说,前后端代码一并奉上: (基于springmvc ) @Controller @Reque ...
最新文章
- LiveData使用和生命感知原理
- 铁大Facebook——电梯演讲
- android include 点击事件,Android 多个include标签的监听事件处理
- IE8给你选择的理由
- PHP高效获取远程图片尺寸和大小(转)
- bzoj 1058: [ZJOI2007]报表统计（set+multiset）
- 为什要学习烹饪？学习烹饪迫在眉睫
- 开发Shell脚本解决DOS安全Linux服务器生产案例
- python大作业五子棋人人对战_五子棋总结（人人对战）
- HeadFirstJava 7，8，9
- ucinet计算聚类系数大于1怎么办_ucinet使用说明技巧.ppt
- 生成树协议STP 网络冗余技术
- Cloudera 简介、安装和升级、管理、操作文档
- C++ 学习笔记（22） Builder Pattern
- 天大《模拟电子技术基础》大作业期末考核
- 教你如何理解贝叶斯公式
- 集成WEB服务器的蓝牙路由器及低功耗BLE WIFI 网络规划和实施
- 学习WordPress必须知道的函数(转)
- 教育网校搭建哪个好？
- 水晶报表填充.Net Objects数据源