微信小程序如何获取相册照片

如何获取相册照片

微信小程序提供了相册能力,使得开发者可以快速获得用户的相册照片。相册照片除了给小程序带来更好的用户体验,也可以拓宽开发小程序的可能性,比如图片分享、拍照、图片编辑等功能。

1. 授权获取相册照片

在小程序中获取相册照片需要先获得用户的授权,具体如下:

// 调用API从本地缓存中获取数据

wx.getSetting({

success(res) {

if (!res.authSetting['scope.album']) {

wx.authorize({

scope: 'scope.album',

success() {

console.log('授权成功!')

},

fail() {

console.log('授权失败!')

}

})

}

}

})

注: 在APIwx.getSetting中获取用户的授权设置,如果用户之前未授权,则调用wx.authorize请求用户授权,其中scope.album表示要获取相册的授权。

2. 调用API获取相册照片

用户授权成功后,可以使用wx.chooseImage获取相册照片:

wx.chooseImage({

count: 1,

sizeType: ['original', 'compressed'],

sourceType: ['album'],

success(res) {

const filePath = res.tempFilePaths[0]

// do something with filePath

}

})

解释:

count:最多可以选择的图片数量,不填默认为9。

sizeType:所选的图片的尺寸,有'original'、'compressed'2种可选项。'original'表示原图,'compressed'表示压缩图,默认二者都有。

sourceType:选择图片的来源,有'album'、'camera'2种可选项。'album'表示从相册选择,'camera'表示使用相机拍照,默认二者都有。

res.tempFilePaths[0]:返回的照片文件路径。

3. 显示相册照片

一般开发中,我们需要将获取的相册照片展示出来,可以通过<image>标签显示照片:

<image src="{{filePath}}" />

注:其中filePath为获取到的相册照片的路径。

总结

通过以上步骤,我们可以在小程序中快速获取用户的相册照片并进行展示。但是需要注意的是,获取相册照片需要用户的授权,否则会导致无法获取到相册照片。

在绝大多数开发中,除了显示相册照片,还需要对相册照片进行裁剪、压缩等处理,提高用户体验,下面我们会详细介绍如何对相册照片进行裁剪和压缩,以及其他相关的注意事项。