小程序从本地相册选择图片或使用相机拍照wx.chooseImage上传后预览并可以识别图中二维码

官方文档：//参考

wx.chooseImage(OBJECT)

从本地相册选择图片或使用相机拍照。

OBJECT参数说明：

参数	类型	必填	说明
count	Number	否	最多可以选择的图片张数，默认9
sizeType	StringArray	否	original 原图，compressed 压缩图，默认二者都有
sourceType	StringArray	否	album 从相册选图，camera 使用相机，默认二者都有
success	Function	是	成功则返回图片的本地文件路径列表 tempFilePaths
fail	Function	否	接口调用失败的回调函数
complete	Function	否	接口调用结束的回调函数（调用成功、失败都会执行）

注：文件的临时路径，在小程序本次启动期间可以正常使用，如需持久保存，需在主动调用 wx.saveFile，在小程序下次启动时才能访问得到。

success返回参数说明：

参数	类型	说明	最低版本
tempFilePaths	StringArray	图片的本地文件路径列表
tempFiles	ObjectArray	图片的本地文件列表，每一项是一个 File 对象	1.2.0

File 对象结构如下:

字段	类型	说明
path	String	本地文件路径
size	Number	本地文件大小，单位：B

示例代码：

wx.chooseImage({
  count: 1, // 默认9
  sizeType: ['original', 'compressed'], // 可以指定是原图还是压缩图，默认二者都有
  sourceType: ['album', 'camera'], // 可以指定来源是相册还是相机，默认二者都有
  success: function (res) {
    // 返回选定照片的本地文件路径列表，tempFilePath可以作为img标签的src属性显示图片
    var tempFilePaths = res.tempFilePaths
  }
})

wx.previewImage(OBJECT)

预览图片。

OBJECT参数说明：

参数	类型	必填	说明
current	String	否	当前显示图片的链接，不填则默认为 urls 的第一张
urls	StringArray	是	需要预览的图片链接列表
success	Function	否	接口调用成功的回调函数
fail	Function	否	接口调用失败的回调函数
complete	Function	否	接口调用结束的回调函数（调用成功、失败都会执行）

示例代码：

wx.previewImage({
  current: '', // 当前显示图片的http链接
  urls: [] // 需要预览的图片http链接列表
})

以上是官方示例文档；

下面是我自己在开发小程序时遇到的索性就写一下

前台代码：

<button bindtap='chooseImg'>选择图片</button>//调用图片选择和相机
<view><image src='{{img_l}}' bindtap='preview_img'></image></view>//图片上传后预览、保存、识别

js代码：

page({
 data: {
    img_list:''
  },
chooseImg:function(){//调用
    var _this = this;
    wx.chooseImage({
      count: 1, // 默认9
      sizeType: ['original', 'compressed'], // 可以指定是原图还是压缩图，默认二者都有
      sourceType: ['album', 'camera'], // 可以指定来源是相册还是相机，默认二者都有
      success: function (res) {
        console.log(res)
        // 返回选定照片的本地文件路径列表，tempFilePath可以作为img标签的src属性显示图片
        var tempFilePaths = res.tempFilePaths
        _this.setData({
          img_l: res.tempFilePaths
        })
      }
    })
  },
  preview_img:function(){//预览tupia
    wx.previewImage({
      current: this.data.img_l, // 当前显示图片的http链接
      urls: this.data.img_l // 需要预览的图片http链接列表
    })
  }
})

效果:

点击选择图片：

可以选择本地图片或直接调用相机：

点击图片预览、长按显示选项：