IT数码 购物 网址 头条 软件 日历 阅读 图书馆
TxT小说阅读器
↓语音阅读,小说下载,古典文学↓
图片批量下载器
↓批量下载图片,美女图库↓
图片自动播放器
↓图片自动播放器↓
一键清除垃圾
↓轻轻一点,清除系统垃圾↓
开发: C++知识库 Java知识库 JavaScript Python PHP知识库 人工智能 区块链 大数据 移动开发 嵌入式 开发工具 数据结构与算法 开发测试 游戏开发 网络协议 系统运维
教程: HTML教程 CSS教程 JavaScript教程 Go语言教程 JQuery教程 VUE教程 VUE3教程 Bootstrap教程 SQL数据库教程 C语言教程 C++教程 Java教程 Python教程 Python3教程 C#教程
数码: 电脑 笔记本 显卡 显示器 固态硬盘 硬盘 耳机 手机 iphone vivo oppo 小米 华为 单反 装机 图拉丁
 
   -> 移动开发 -> 微信小程序使用图片转base64一次性提交多图片 -> 正文阅读

[移动开发]微信小程序使用图片转base64一次性提交多图片

微信小程序使用图片转base64一次性提交多图片

前言

大家都知道微信小程序提交图片只能一张一张的提交,如果需要一次性提交多张图片,那么一般的方法都是进行循环提交。那么使用图片转base64,然后后台再将base64转成图片就可实现一次性提交多张图片了。我使用的uniapp与php配合上传图片,话不多说,直接上代码。


前端代码

let images = [];
var last = this.fileList.length - 1;//fileList 选择的图片数组
var _this = this;
this.fileList.forEach((value,index)=>{
	//该方法是异步的,这里我主要测试base64是否能上传图片,所以同异步就没有严格操作了
	wx.getFileSystemManager().readFile({
		filePath: value.url,
		encoding:"base64",
		success: function (data){
			images.push(data.data);//返回base64编码结果,但是图片的话没有data:image/png
			if(index==last){//因为这个方法是异步的,所以判断是否为最后一个,这里没启效果。
			//请自行处理异步,主要测base64是否能上传图片
				_this.testCommitImages(images);//请求上传图片方法
			}
		},
	});
});

testCommitImages(images){
	this.api.Post('/testImages', {images:JSON.stringify(images)}, (res) => {
		// 上传图片成功
		if(res.data.code == 1) {
			console.log(res.data.msg);
		// 上传不成功,toast返回信息
		}else {
			this.$u.toast(res.data.msg, 2000);
		}
	})
}

后台代码

public function testImages(){
     $images = I("images/s",'','strip_tags');//接受JSON字符串
     $images=json_decode($images,true);
     $path = "test/".date("Ymd",time());
     if (!is_dir($path)){ //判断目录是否存在 不存在就创建
         mkdir($path,0777,true);
     }
     $success_num = 0;
     foreach($images as $image){
         $imageName = "0312_".date("His",time())."_".rand(1111,9999).'.png';
         $imageSrc=  $path."/". $imageName;
         $image_str = base64_decode($image);//将base64转换成图片 注意如果你图片转base46的时候
         //加了前缀 data:image/jpeg;base64,等格式 需要将逗号后面的base64码提取出来才行
         $r = file_put_contents($imageSrc, $image_str);//保存图片 返回的是字节数
         if($r){
             $success_num++;
         }  
     }
     $this->S(json_encode($success_num));
 }

总结

以上就是今天要讲的内容,本人已经亲测有效。

  移动开发 最新文章
Vue3装载axios和element-ui
android adb cmd
【xcode】Xcode常用快捷键与技巧
Android开发中的线程池使用
Java 和 Android 的 Base64
Android 测试文字编码格式
微信小程序支付
安卓权限记录
知乎之自动养号
【Android Jetpack】DataStore
上一篇文章      下一篇文章      查看所有文章
加:2022-03-15 22:41:49  更:2022-03-15 22:43:48 
 
开发: C++知识库 Java知识库 JavaScript Python PHP知识库 人工智能 区块链 大数据 移动开发 嵌入式 开发工具 数据结构与算法 开发测试 游戏开发 网络协议 系统运维
教程: HTML教程 CSS教程 JavaScript教程 Go语言教程 JQuery教程 VUE教程 VUE3教程 Bootstrap教程 SQL数据库教程 C语言教程 C++教程 Java教程 Python教程 Python3教程 C#教程
数码: 电脑 笔记本 显卡 显示器 固态硬盘 硬盘 耳机 手机 iphone vivo oppo 小米 华为 单反 装机 图拉丁

360图书馆 购物 三丰科技 阅读网 日历 万年历 2024年11日历 -2024/11/24 17:30:24-

图片自动播放器
↓图片自动播放器↓
TxT小说阅读器
↓语音阅读,小说下载,古典文学↓
一键清除垃圾
↓轻轻一点,清除系统垃圾↓
图片批量下载器
↓批量下载图片,美女图库↓
  网站联系: qq:121756557 email:121756557@qq.com  IT数码