HarmonyOS 使用UploadConfig上传图片？

Question

代码如下：

import { common } from '@kit.AbilityKit';
import request from '@ohos.request';
import { uri } from '@kit.ArkTS';
import  { Constance} from '../constant/Constance'
import { BusinessError } from '@kit.BasicServicesKit';
import fs from '@ohos.file.fs';



export default class UpLoadUtils{
  private backgroudTask: request.agent.Task | undefined = undefined
  private waiteList: Array<string> = []
  
  private config: request.UploadConfig = {
    header: {
      ContentType: "multipart/form-data",
      Accept: '*/*'
    },
    url: "",
    method: "POST",
    files: [],
    data: []
  }

  upLoadFile(pic: string, url: string,fileClass: string){
    let fileNames = pic.split("/").length
    let fileName = pic.split("/")[fileNames - 1]
    let context = getContext(this) as common.UIAbilityContext;
    let cacheDir = context.cacheDir;
    console.log("缓存地址", cacheDir)
    let file = fs.openSync(pic,fs.OpenMode.CREATE)
    fs.copyFileSync(file.fd,cacheDir +'/' + fileName)
    fs.closeSync(file)
    this.config.url = "https://xxx" + url
    console.info('上传地址有错吗？',this.config.url)
    console.info('图片名字', fileName)
    this.config.files = [{filename: fileName, name: fileName.split(".")[0],uri: "internal://cache/"+fileName,type:fileName.split(".")[1]}]
    this.config.data = [{name: "sessionId", value: Constance.sessionId},{name: "clientId", value: 'portalweb'},{name: 'fileClass', value: fileClass},{name:'isOpen',value: 'N'}]
    console.info('网络信息',JSON.stringify(this.config))
    try {
      request.uploadFile(getContext(this), this.config).then((uploadTask: request.UploadTask) => {
        uploadTask.on('headerReceive', (header: object) => {
          console.log("返回信息能拿到吗？", JSON.stringify(header))
        })
        uploadTask.on('complete', (taskStates: Array<request.TaskState>) => {
          for (let i = 0; i < taskStates.length; i++) {
            console.info(`上传完成${JSON.stringify(taskStates[i])}`)
          }
        })
      }).catch((error: BusinessError) => {
        console.info(`code is ${error.code},message is ${error.message}}`)
      })
    } catch (error) {
      let err: BusinessError = error as BusinessError;
      console.error(`Invoke uploadFile failed, code is ${err.code}, message is ${err.message}`);
    }
  }
}

是否可以拿到返回信息？

Answer 1

可使用http.request，参考示例如下：

import { BusinessError } from '@ohos.base';
import { rcp } from '@kit.RemoteCommunicationKit';
import fs from '@ohos.file.fs';
import { http } from '@kit.NetworkKit';
import { photoAccessHelper } from '@kit.MediaLibraryKit';

let uploadUrl: string = 'http://xxx';

function example01(): string {
  let uri = '';
  let PhotoSelectOptions = new photoAccessHelper.PhotoSelectOptions();
  PhotoSelectOptions.MIMEType = photoAccessHelper.PhotoViewMIMETypes.IMAGE_TYPE;
  PhotoSelectOptions.maxSelectNumber = 5;
  let photoPicker = new photoAccessHelper.PhotoViewPicker();
  photoPicker.select(PhotoSelectOptions).then((PhotoSelectResult: photoAccessHelper.PhotoSelectResult) => {
    console.info('PhotoViewPicker.select successfully, PhotoSelectResult uri: ' + JSON.stringify(PhotoSelectResult));
    uri = PhotoSelectResult.photoUris[0];
    console.log("uri:" + uri);
    try {
      let resultPhoto = fs.openSync(uri, fs.OpenMode.READ_ONLY);
      let resultName = resultPhoto.name;
      let fileTemp = fs.openSync(getContext().filesDir + resultPhoto.name, fs.OpenMode.READ_WRITE | fs.OpenMode.CREATE);
      let imageUri = fileTemp.path;
      fs.copyFileSync(resultPhoto.fd, fileTemp.fd);
      fs.closeSync(resultPhoto);
      fs.closeSync(fileTemp);
      const httpRequest = http.createHttp();
      httpRequest.request(uploadUrl, {
        method: http.RequestMethod.POST,
        header: { 'Content-Type': 'multipart/form-data', 'Connection': 'keep-alive' },
        expectDataType: http.HttpDataType.ARRAY_BUFFER,
        multiFormDataList: [{
          name: 'file',
          contentType: 'image/jpg',
          filePath: imageUri,
          remoteFileName: 'file.jpg'
        },],
      }, () => {
        console.log('example01:上传结束')
        httpRequest.destroy();
      })
    } catch (err) {
      console.error(`Failed to request the upload. err: ${JSON.stringify(err)}`);
    }
  }).catch((err: BusinessError) => {
    console.error(`PhotoViewPicker.select failed with err: ${err.code}, ${err.message}`);
  });

  return uri;
}

function testRcpMultiPartUpload() {
  example01();
}

function clickget() {
  const session = rcp.createSession();
  session.get("http://xxx").then((response) => {
    console.log("clickget" + JSON.stringify(response));
  }).catch((err: BusinessError) => {
    console.error("err:" + JSON.stringify(err));
  });
}

@Entry
@Component
struct Index {
  @State message: string = 'Hello World';

  build() {
    Row() {
      Column() {
        Text(this.message).fontSize(50).fontWeight(FontWeight.Bold).onClick(() => {
          testRcpMultiPartUpload();
        })
        Text('getText').fontSize(50).fontWeight(FontWeight.Bold).onClick(() => {
          clickget();
        })
      }.width('100%')
    }.height('100%')
  }
}