【HarmonyOS】API9网络buffer图片加载

 【引言】

HarmonyOS中加载网络图片常用的方法是直接给Image组件添加图片的网络地址，申请网络权限ohos.permission.INTERNET后就可以通过url加载对应的图片了，如HarmonyOS官网中的写法：

Image('https://www.example.com/example.JPG')

【问题概述】

但是日常开发中有些图片是存储云服务器中的，下载这些图片需要通过鉴权接口请求，获得的也不是图片的url地址而是二进制的图片buffer数据，类似于AGC中云存储的REST API接口：下载文件-REST API-Server-云存储 | 华为开发者联盟 (huawei.com)，下面是官网Java示例代码：

public static void download(String storageUrl, DownloadObjectParam param) throws Exception {URIBuilder uriBuilder = new URIBuilder(storageUrl + param.getBucketName() + "/" + param.getObjectName());HttpGet get = new HttpGet(uriBuilder.build());get.setHeader("productId", param.getProjectId());get.setHeader("client_id", param.getClientId());get.setHeader("Authorization", "Bearer " + param.getToken());CloseableHttpClient httpClient = HttpClients.createDefault();CloseableHttpResponse httpResponse = httpClient.execute(get);int statusCode = httpResponse.getStatusLine().getStatusCode();if (statusCode == HttpStatus.SC_OK) {try (InputStream inputStream = httpResponse.getEntity().getContent();FileOutputStream outputStream = new FileOutputStream(getFileName(param.getObjectName()))) {// 将响应的实体流写入到本地文件，业务实际应用时，需要将FileOutputStream的入参改成业务指定的目录下byte[] buffer = new byte[1024];int len;while ((len = inputStream.read(buffer)) > 0) {outputStream.write(buffer, 0, len);}outputStream.flush();}}httpResponse.close();
}

上述代码中我们获取图片数据首先需要进行授权验证，验证通过接口会获取文件数据，然后就可以使用流的操作形式将数据保存再本地文件中展示，那么在HarmonyOS中我们该如何操作呢

【具体实现】

一、通过httpRequest构建GET请求，添加鉴权的header头文件，创建request请求

二、将获取data中的result数据创建pixelMap，解码编码PixelMap完成图片buffer的加载。

三、Image组件使用pixel数据完成加载

具体代码如下：

  private async httpRequest() {let httpRequest = http.createHttp()let url="storageUrl";let option={method:http.RequestMethod.GET,header:{"Authorization":"Bearer XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX","productId":"","client_id":""},}let _res= httpRequest.request(url ,option);  // 请填写一个具体的网络图片地址await _res.then((data) => {let code = data.responseCodeif(ResponseCode.ResponseCode.OK == code) {let imageSource = image.createImageSource(data.result)let options = {alphaType: 0,                    // 透明度editable: false,                 // 是否可编辑pixelFormat: 3,                  // 像素格式scaleMode: 1,                    // 缩略值size: {height: 100, width: 100}} // 创建图片大小imageSource.createPixelMap(options).then((pixelMap) => {this.image = pixelMap})} else {console.log("response code: " + code)}}).catch((err) => {console.log("error code: " + error.code + ", msg: " + error.message)});}}