微信小程序开发之从相册获取图片 使用相机拍照

微信小程序：从相册获取图片和使用相机拍照——本地图片上传指南

对于微信小程序开发者而言，实现用户头像设置功能是一个常见的需求。本文将为你详细介绍如何使用微信小程序实现这一功能，包括从相册获取图片、使用相机拍照以及本地图片上传等相关内容。让我们一起跟随狼蚁网站的SEO优化步伐，深入了解这一功能的实现过程。

一、功能展示

我们先来看一下功能的实现效果。用户点击“获取图片”按钮后，可以选择从相册获取图片或使用相机拍照，然后将所选图片显示在页面上。这就是我们的目标功能。

二、代码实现

接下来，我们来看一下具体的代码实现。

1. index.wxml

在index.wxml文件中，我们定义了一个按钮用于触发图片选择功能，以及一个image标签用于显示所选图片。

```html

获取图片

```

2. index.js

在index.js文件中，我们定义了页面逻辑。当用户点击按钮时，会调用chooseimage函数，触发图片选择功能。

```javascript

//index.js

var app = getApp()

Page({

data: {

tempFilePaths: ''

},

onLoad: function () {},

chooseimage: function () {

var _this = this;

wx.chooseImage({

count: 1, // 默认9

sizeType: ['original', 'pressed'], // 可以指定是原图还是压缩图，默认二者都有

sourceType: ['album', 'camera'], // 可以指定来源是相册还是相机，默认二者都有

success: function (res) {

// 返回选定照片的本地文件路径列表，tempFilePath可以作为img标签的src属性显示图片

_this.setData({tempFilePaths: res.tempFilePaths}) // 更新页面数据，显示所选图片

}

})

}

})

```

三、API说明及示例代码

在选择图片成功后，我们可以使用wx.uploadFile API将所选图片上传到服务器。以下是示例代码：

```javascript

wx.chooseImage({