要实现一个拍照过程中,断网重连还可以看到之前拍的照片 我这里做了一个简单demo 页面
<view class="container">
<view class='img_body'>
<view class='img_list'>
<view class='img_li' wx:for="{{imglist}}" wx:key="{{index}}">
<image src="{{item}}"></image>
</view>
<view class='addimg' bindtap='img_w_show'>
<image src='../../img/add.png'></image>
</view>
</view>
</view>
<button bindtap="toStorage">存储</button>
<button bindtap="tolook">查看
<view class='img_li' wx:for="{{newList}}" wx:key="{{index}}">
<image src="{{item}}"></image>
</view>
</button>
<view>{{}} </view>
</view> js
var list=[];
var list2=[];
Page({
data: {
imglist:[],
newList:[],
},
img_w_show() {
var _this = this;
wx.chooseImage({
count: 9, // 默认9
sizeType: ['original', 'compressed'], // 可以指定是原图还是压缩图,默认二者都有
sourceType: ['album', 'camera'], // 可以指定来源是相册还是相机,默认二者都有
success: function (res) {
// 返回选定照片的本地文件路径列表,tempFilePath可以作为img标签的src属性显示图片
var tempFilePaths = res.tempFilePaths;
list = _this.data.imglist.concat(tempFilePaths);
console.log("111111"+tempFilePaths)
console.log(list[0]);
_this.setData({
imglist: _this.data.imglist.concat(tempFilePaths)
})
}
})
},
toStorage() {
// 获取用户数据存到本地
const appInstance = getApp()
console.log(list[0]);//打印用户信息
list2=list;
list=[];
try {
wx.setStorageSync('imglist', list2[0]);
wx.getStorage({
key: 'imglist',
success: function(res) {
console.log(res.data);
},
})
//弹框提示
wx.showToast({
title: '存储本地缓存数据成功',
icon: 'none',
duration: 2000
});
} catch (e) {
//弹框提示
wx.showToast({
title: '存储本地缓存数据失败,请检查相关配置,是否联网等',
icon: 'none',
duration: 2000
});
}
},
tolook(){
var _this = this;
_this.setData({
newList: list2
}),
list2=[];
}
})
操作如下图
这里的主要思想就是调用微信图片接口wx.chooseImage返回的url,
点击存储。就放在wx.setStorageSync里面,然后进行页面渲染, 但是我console出的url是个http://tmp/wxfb0ad0f51a836ae1.o6zAJs7t7QmyBKCtv7q9mCnkl77Y.jJ5Lj639Ka7gf04604f9827156ce9b8509eaec36ac00.png这种形式的不应该是网络http协议吗,也不是base64编码 为什么断网情况我的图片还能查看出来
微信小程序是沙盒模式,你只能读取到微信给你提供的指定路径下的文件。
wx.chooseImage接口返回的图片地址是这个沙盒中的tmp文件夹下的图片,是临时图片。将在内存不足时被随机释放。
如果你保存了wx.chooseImage接口返回的图片地址,只能保证在小程序本次打开并且未被销毁,并且内存充足的时候能够访问。
如果需要反复读取,建议自己通过FileManager手动存储在沙盒下。但仍不能保证下次一定还能访问。
是本地的地址
但不能通过浏览器访问
在这里应该是从缓存中取值赋值
这是本地的临时地址