企业🤖AI智能体构建引擎,智能编排和调试,一键部署,支持私有化部署方案 广告
需求:     目前需要在一个页面中加载使用很多image组件,加载图片,采用的是\[data:image..base64,...\]格式的图片直接放在src里.但在真机测试时,可以导致wxml里内容太多,小程序直接无响应.所以想着把 从服务端传来的base64格式的图片转成本地文件路径后,再放到image组件的src里. 解决:     在社区里查了好多帖子,发现都是提此类问题,但均没有结果.后来在网上找到了解决方法,现分享如下:     var base64 = "data:image...";//base64格式图片     var imgPath = wx.env.USER\_DATA\_PATH+'/页面名称'+'你的图片名'+ '.png';     //如果图片字符串不含要清空的前缀,可以不执行下行代码. //var imageData = base64.replace(/^data:image\\/\\w+;base64,/, ""); var imageData\=qr\_code.replace(/^data:image\\/jpg\\/png\\/gif;base64,/,"");     var fs = wx.getFileSystemManager();     fs.writeFileSync(imgPath, imageData, "base64");  至此就可以用imgPath(图片的本地文件路径)进行后继大家想要的操作了!  注意用完后,及时清理本地文件.释放储存空间. 最后:发现社区中已有此种解决方法了,之前没找到. ~~~ /** * 获取小程序二维码 * @return mixed */ public function getMiniQRcode($page='pages/index/index',$scene='',$is_return_url=1) { $url = "https://api.weixin.qq.com/wxa/getwxacodeunlimit?access_token=".$this->get_access_token(); $data['scene'] = $scene; $data['page'] = $page; $data['width'] = 280; $result = $this->requestURL($url,$data,'POST'); $result_code = json_decode($result,true); if (isset($result_code['errcode'])) { return $result_code; } $path = "./upload/miniapp_".mt_rand(0,1000)."_".microtime(true).".png"; $file = fopen($path,"w");//创建件准备写入,文件名xcxcode/wxcode1.jpg为自定义 fwrite($file,$result);//写入 if ($is_return_url) { return $path; } else { // unlink($path); // dd($scene); // header('Content-Type:image/jpg'); // exit($result); if($fp = fopen($path,"rb", 0)) { //这里是返回base64图片 $gambar = fread($fp,filesize($path)); fclose($fp); $base64 = chunk_split(base64_encode($gambar)); unlink($path); // // 输出 // $encode = '<img src="data:image/jpg/png/gif;base64,' . $base64 .'" >'; // echo $encode; // 输出 return "data:image/jpg/png/gif;base64,". $base64; } } } ~~~ getQRcode () { let _this = this this.$http.get('/api/xxxxxxxxxxxxx/getMiniQRcode', {}).then((res) => { if (res) { // 后台返回的base64图片格式去掉空格和换行 let str = res.replace(/\. +/g, '') str = str.replace(/[\r\n]/g, '') _this.qrcode = str } else { console.log('图片不存在') } }).catch(err => { console.log(err.status, err.message) }) }