【NEXT】网络编程——上传文件（不限于jpg/png/pdf/txt/doc等），或请求参数值是file类型时，调用在线服务接口

最近在使用华为AI平台ModelArts训练自己的图像识别模型，并部署了在线服务接口。供给客户端（如：鸿蒙APP/元服务）调用。

import核心能力：

import { http } from '@kit.NetworkKit';
import { fileIo } from '@kit.CoreFileKit';

一、先用测试工具调用在线服务接口，是否成功

 

接口接收到传入的图片文件，识别图片内容后成功返回结果。

注意：接口要求输入的参数名是images，值类型是文件file。

二、从手机相册选取一张图片，并复制到沙箱缓存中

/*** 将文件拷贝到缓存中* @param from 原文件地址（拍照/相册）* @param to 目标文件地址（缓存）*/copyFile(from: string, to: string): void {let fFile = fileIo.openSync(from);let tFile = fileIo.openSync(to, fileIo.OpenMode.READ_WRITE | fileIo.OpenMode.CREATE); // 替换或创建文件fileIo.copyFileSync(fFile.fd, tFile.fd);fileIo.closeSync(fFile);fileIo.closeSync(tFile);}

三、读取已复制到缓存中的文件内容

/*** 读取文件内容* @param cacheImgUri：沙箱缓存文件地址* @returns*/readFileContent(cacheImgUri: string): ArrayBuffer {let fFile = fileIo.openSync(cacheImgUri, fileIo.OpenMode.READ_ONLY);let fStat = fileIo.lstatSync(cacheImgUri);let arrayBufFile: ArrayBuffer = new ArrayBuffer(fStat.size); // 文件大小fileIo.readSync(fFile.fd, arrayBufFile);fileIo.fsyncSync(fFile.fd);fileIo.closeSync(fFile);return arrayBufFile;}

四、构建请求体body的内容

/*** 构建请求体body* @param boundary 分隔符* @param fileName 文件名* @param fileContent 文件内容* @returns */buildBodyContent(boundary: string, fileName: string, fileContent: Uint8Array): ArrayBuffer {let txtEncoder = new util.TextEncoder();// 构建请求体前面内容let bodyPre = `--${boundary}\r\n`bodyPre = bodyPre + `Content-Disposition: form-data; name="images"; filename="${fileName}"\r\n`;bodyPre = bodyPre + 'Content-Type: application/octet-stream\r\n';bodyPre = bodyPre + '\r\n';let arrayPre = txtEncoder.encodeInto(bodyPre);// 构建请求体后面内容let bodyAft = '\r\n'bodyAft = bodyAft + `--${boundary}`bodyAft = bodyAft + '--\r\n'let arrayAft = txtEncoder.encodeInto(bodyAft);let body = buffer.concat([arrayPre, fileContent, arrayAft]); // 拼接请求体return body.buffer;}

五、按钮click事件调用aiAnalyseImg方法，发送请求在线服务接口

/*** 调用病虫害模型AI能力分析图片* @param imgUri 原图片地址（拍照/相册）* @returns */async aiAnalyseImg(imgUri: string): Promise<void> {// 华为云ModelArts平台病虫害模型console.debug('正在分析的图片地址：' + imgUri); // 从相册选取的图片地址// 文件名let fileName = imgUri.split('/').pop() as string;let cacheFilePath = `${getContext().cacheDir}/${fileName}`;this.copyFile(imgUri, cacheFilePath);// 从沙箱缓存中读取文件内容let fileContent: Uint8Array = new Uint8Array(this.readFileContent(cacheFilePath));// 构建请求体bodylet boundary: string ='--------' + (await systemDateTime.getCurrentTime(true)).toString();let bodyContent = this.buildBodyContent(boundary, fileName, fileContent);hilog.debug(0x0000, 'aiAnalyseImg', 'hilog输出bodyContent：' + bodyContent);hilog.debug(0x0000, 'aiAnalyseImg', 'hilog输出bodyContent大小：' + bodyContent.byteLength);// 请求地址：modelArts平台在线服务API接口let url: string ='https://b07b6d6054****96d5e4420****e.apig.cn-north-4.huaweicloudapis.com/v1/infers/c91****8-c678-4e73-****-37c****3a';let request = http.createHttp();let reqOpts: http.HttpRequestOptions = { // 设置请求参数method: http.RequestMethod.POST,header: {'X-Apig-AppCode': '40d29da14dbd87abe3484f6fa0e1b07767d5226540459dbf8620a8f7', // 模型平台AppCode'Content-Type': `multipart/form-data;boundary=${boundary}`,'Content-Length': bodyContent.byteLength.toString(),},extraData: bodyContent,};// 发起请求request.request(url, reqOpts).then((resp) => { // 请求成功，解析返回结果// TODO: 解析返回结果hilog.debug(0x0000, 'aiAnalyseImg', 'hilog输出结果：' + JSON.stringify(resp.result));}).catch((err: BusinessError) => {hilog.error(0x0000, 'aiAnalyseImg', 'catch输出错误：' + err.message);})}

注意：

1.构建请求体body中的Content-Type: application/octet-stream  与  header中设置的Content-Type: multipart/form-data

2.header参数中记得设置Content-Length: bodyContent.byteLength.toString()