HarmonyOS 需求一个图片选择上传的组件？

Question

APP需要上传一张（或多张）用户的图片。有两种方式：从手机相册选择、拍照。 然后把图片上传到服务器，上传成功，服务器会返回图片的相关信息，上传失败，APP提示失败信息。

Answer 1

拍照上传可参考下面demo，相册选择多文件上传可参考该连接：https://gitee.com/harmonyos\_samples/upload-and-down-load

Button("拍照并上传")
  .onClick( async () =>{
    const name = Date.now().toString()
    try {
      let pickerProfile: picker.PickerProfile = {
        cameraPosition: camera.CameraPosition.CAMERA_POSITION_BACK
      };
      let pickerResult: picker.PickerResult = await picker.pick(this.context,
        [picker.PickerMediaType.PHOTO], pickerProfile);
      if (!pickerResult) {
        console.log("the pick pickerResult is undefined");
      }
      //将文件上传至沙箱  （即传入的context）对应的缓存路径context.cacheDir。
      console.log("the pick pickerResult is:" + JSON.stringify(pickerResult));
      let sha = fs.openSync(`${this.context.cacheDir}/${name}.jpg`,fs.OpenMode.READ_WRITE | fs.OpenMode.CREATE)
      let photos = fs.openSync(pickerResult.resultUri,fs.OpenMode.READ_ONLY | fs.OpenMode.CREATE)
      fs.copyFileSync(photos.fd,sha.fd)
      let formData = new FormData()
      formData.append('file', `internal://cache/${name}.jpg`)
      // 发送请求
      axios.post<string, AxiosResponse<string>, FormData>('https://xxx', formData, {
        headers: { 'Content-Type': 'multipart/form-data' },
        context: getContext(this),
        onUploadProgress: (progressEvent: AxiosProgressEvent): void => {
          console.info(progressEvent && progressEvent.loaded && progressEvent.total ? Math.ceil(progressEvent.loaded / progressEvent.total * 100) + '%' : '0%');
        },
      }).then((res: AxiosResponse<string>) => {
        console.info("result" + JSON.stringify(res.data));
      }).catch((err: AxiosError) => {
        console.error("error:" + JSON.stringify(err));
      })
    } catch (error) {
      let err = error as BusinessError;
      console.error(`the pick call failed. error code: ${err.code}`);
    }
  })