微信小程序之base64轉(zhuǎn)為本地圖片

在生成海報時 需要在海報里生成對應id的商品二維碼,可以使用字符串轉(zhuǎn)化為二維碼圖片,但是其圖片格式為base64,在微信開發(fā)者工具可以正常查看,但是手機測試無法顯示,需要把base64圖片轉(zhuǎn)為本地圖片。

1.新建base64src.js文件

// 小程序分享二維碼是base64格式,在制作分享圖時,需要轉(zhuǎn)換為圖片格式

const FILE_BASE_NAME = 'tmp_base64src'; //自定義文件名

function base64src(base64data, cb) {
  const [, format, bodyData] = /data:image\/(\w+);base64,(.*)/.exec(base64data) || [];
  if (!format) {
    return (new Error('ERROR_BASE64SRC_PARSE'));
  }
  const filePath = `${wx.env.USER_DATA_PATH}/${FILE_BASE_NAME}.${format}`;
  const buffer = wx.base64ToArrayBuffer(bodyData);
  fsm.writeFile({
    filePath,
    data: buffer,
    encoding: 'binary',
    success() {
      cb(filePath);
    },
    fail() {
      return (new Error('ERROR_BASE64SRC_WRITE'));
    },
  });
};

export { base64src };
2、在需要使用的文件中引入并使用
import { base64src } from '../../utils/base64src.js'
Page({
  data: {
    shareQrImg: "data:image/jpeg;base64,/9j/4AAQSkZJRgA........GASDFKGKF=" //base64圖片
  },
  onLoad: function (options) {
    base64src(this.data.shareQrImg, res => {
      console.log(res) // 返回圖片地址,直接賦值到image標簽即可
    });
  },
})
3、如果需要網(wǎng)絡圖片轉(zhuǎn)換成base64格式。
wx.request({
  url: "https://s0.2mdn.net/simgad/10657937226496242109",
  method: 'GET',
  responseType: 'arraybuffer',
  success: (res) => {
    let base64 = wx.arrayBufferToBase64(res.data);
    let userImageBase64 = 'data:image/jpg;base64,' + base64;
    console.log(userImageBase64); // 打印base64格式圖片
    // 如果需要使用本地緩存圖片,請參照第一步
  }
})
最后編輯于
?著作權歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時請結合常識與多方信息審慎甄別。
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務。

相關閱讀更多精彩內(nèi)容

  • Swift1> Swift和OC的區(qū)別1.1> Swift沒有地址/指針的概念1.2> 泛型1.3> 類型嚴謹 對...
    cosWriter閱讀 11,650評論 1 32
  • silk v3錄音轉(zhuǎn)olami語音識別和語義處理的api服務(ubuntu16.04服務器上實現(xiàn)) 重要的寫在前面...
    墨跡zz閱讀 1,826評論 2 6
  • 午飯后,孩子隨手拿出一本書《三字經(jīng)》,媽媽和我一起讀吧,兒子背的前后連貫、朗朗上口。這是中國古代歷史文化的寶貴遺產(chǎn)...
    f65d0cc1f4f0閱讀 149評論 0 0
  • 當當當,夏天來臨,大學即將畢業(yè),就租了個小房,答辯、搬家、道別、盡是忙碌。這幾天,我便陸陸續(xù)續(xù)的將輔料盡量備齊,都...
    半面藝人閱讀 685評論 1 7
  • 我在等一個人,等一場美麗的邂逅,我總是在心里默默地想,如果有一天相愛了,我和你會用怎樣的一種方式相遇。是用那一種款...
    惟愿你安閱讀 1,357評論 14 9

友情鏈接更多精彩內(nèi)容