微信小程序 因文件大小不能使用本地背景圖片解決方法


因微信文件只允許2m,所以不能給圖片太多空間。所以出現背景圖片的坑

解決方案1: 把背景圖片放到服務器文件件下,直接將路徑給url。 得是https開頭的路徑才可以

 

解決方案2:將圖片轉換成base64的碼,將碼放到url里

  1.是把圖片轉成base64碼:

   wx.chooseImage({
        success: function(res) {
          console.log(wx.getFileSystemManager().readFileSync(res.tempFilePaths[0], "base64"))
        },
      })

 

 

  這個方法直接在微信js里調用,然后將自己要轉碼的圖片選擇執行后,會打印在console控制台里。
注意:打印的碼需要在前面加上: "data:image/jpg;base64,"    加上雙引號里的內容,才可以。逗號不能少了
 
如下路是我轉換的 base64碼:

 

 但是要加上  data:image/jpg;base64,    才完整。

 

注意:當背景圖有圓角時,會出現意想不到得bug, 解決方法:

我是給元素設置了圓角,然后加了鋪滿解決的。

  border-radius: 20rpx;
background-size: cover;

 

 這是我的使用方法。


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM