uniapp 写h5网页，上传图片

在使用UniApp构建H5页面时，上传图片通常涉及到前端的文件上传功能。 UniApp提供了一套兼容原生API的解决方案，让你能轻松地处理用户上传操作。以下是一个基本的步骤：

1. **获取用户选择的图片**：使用`uni.chooseImage()` API让用户从相册或摄像头选择图片。这会返回一个Promise，包含选中的图片数组。

uni.chooseImage({
  count: 1, // 可选，选取张数，默认9
  sourceType: ['album', 'camera'], // 可选，来源类型，只读 album:相册、camera:相机
  success(res) {
    let tempFiles = res.tempFilePaths; // 返回选定图片的本地临时路径
    // 对tempFiles做进一步处理
  }
})

2. **预览图片**：你可以使用`uni.previewImage()`来预览所选图片。

3. **编码图片数据**：对于上传，你需要将图片转换为Base64格式的数据或者二进制流，以便发送到服务器。

uni.getImageInfo({
  src: tempFiles[0], // 图片路径
  success(info) {
    let base64Data = info.result.data;
    // 使用base64Data进行上传
  }
})

4. **上传图片**：将Base64数据通过Ajax请求发送到服务器。UniApp提供了`uni.request`方法用于网络请求，记得设置Content-Type为`image/*`。

uni.request({
  url: 'your-server-url', // 你的服务器接口地址
  data: { file: base64Data }, // 或者file: binaryStream,
  method: 'POST',
  headers: {
    'Content-Type': 'image/jpeg'
  },
  success() {
    console.log('图片上传成功');
  }
})

记住，具体的实现可能需要根据你的后端API进行调整。在处理上传过程中，可能还会涉及进度条显示和错误处理等用户体验优化。