如何使用 wx.chooseImage 从本地相册选择图片或使用相机拍照？

推荐答案

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

本题详细解读

wx.chooseImage 的作用

wx.chooseImage 是微信小程序提供的一个 API，用于从本地相册选择图片或使用相机拍照。开发者可以通过这个 API 获取用户选择的图片的临时文件路径，进而进行后续操作，比如上传图片、显示图片等。

参数解析

• count: 指定最多可以选择的图片数量，默认是 9 张。
• sizeType: 指定图片的尺寸类型，可以是 ['original']（原图）、['compressed']（压缩图）或两者都选 ['original', 'compressed']。
• sourceType: 指定图片来源，可以是 ['album']（从相册选择）、['camera']（使用相机拍照）或两者都选 ['album', 'camera']。

回调函数

• success: 当用户成功选择图片后，会触发该回调函数。回调函数的参数 res 包含一个 tempFilePaths 属性，它是一个数组，包含了用户选择的图片的临时文件路径。
• fail: 当用户取消选择或选择失败时，会触发该回调函数。可以通过 err 参数获取错误信息。

使用场景

• 上传图片: 用户选择图片后，可以通过 wx.uploadFile 将图片上传到服务器。
• 显示图片: 用户选择图片后，可以将 tempFilePaths 赋值给 <image> 组件的 src 属性，从而在小程序中显示图片。

注意事项

• 临时文件路径在小程序本次启动期间可以正常使用，若要持久保存，需要将图片上传至服务器。
• 在使用相机拍照时，部分机型可能会弹出权限申请，开发者需要确保小程序已经获取了相机权限。