原創聲明:本文為作者原創,未經允許不得轉載,經授權轉載需注明作者和出處
已知的方法:先上傳到服務器,然后用http://服務器/abc.jpg的鏈接顯示。
wxfile://xxx
直接或經過處理在<image />組件顯示呢?你在data那里設個圖片路徑的變量,然后使用setData把臨時路徑更新到變量里,在在模板中的image里面使用
我這樣做了,不過這個臨時路徑自動變成如下http://
假設小程序已經發布,提供用戶使用。
用戶在使用時,想替換下自己個人中心的“背景圖片”(假設小程序提供這功能)。
->1:在相冊選中圖片(wx.chooseImage返回臨時圖片路徑)
->2:點擊“預覽”(<image />
組件顯示臨時的圖片路徑)
->3:他感覺滿意,點確定設置這張背景(wx.uploadFile上傳到服務器持久化保存,下次登錄也這樣)
重點看第2步:(用臨時圖片路徑顯示到<image/>
組件的過程)
實驗發現(見下圖):
返回的是:
wxfile://tem_xxxxxxxxxxxxx
真正在<image />的src的調用的卻是:
http://2109377157.debug.open.weixin.qq.com/pages/tes............jpg
1:setData({img_url:chooseImage得到的圖片臨時路徑 })
官方文檔已經說明,此臨時圖片路徑可以在<image/>組件顯示,但是<image/>只支持http://網絡圖片,不支持wxfile://的圖片,怎么辦呢?于是有了操作2
2:微信服務器把這個“臨時路徑”上傳到他自己的服務器(http://2109377157.debug.open.weixin.qq.com)
3:<image />
組件的src再調用“他自己服務器剛上傳的這個圖片的http路徑”
即:http://2109377157.debug.open.weixin.qq.com/pages/xx...........x.jpg
通過如下官方接口的注釋及實驗猜測:
<image />
只可顯示http://路徑的圖片
setData“臨時圖片路徑數據”到<image />的src,他也會自動上傳到微信服務器轉換成http://路徑的圖片,然后再顯示(這點官方文檔沒說!~)
我是這樣認為的,感覺各路大哥、大神就糾正!~