HarmonyOS 使用ArkWeb下载文件时，保存文件失败？

Question

使用ArkWeb下载文件时，下载代理提示已下载完成，并且有实际下载内容，但是保存文件时空。代码如下：

//首先注册一个下载代理
this.delegate.onBeforeDownload((webDownloadItem: web_webview.WebDownloadItem) => {
  console.log("EntryAbility: will start a download.");

  //然后唤起系统文件框
  const documentSaveOptions = new picker.DocumentSaveOptions(); // 创建文件管理器选项实例
  documentSaveOptions.newFileNames =
    ["摩羯星GPS轨迹导出_" + (new Date()).getTime() + ".txt"]; // 保存文件名（可选）
  documentSaveOptions.fileSuffixChoices = ['.txt']; // 保存文件类型（可选）

  let uris: Array<string> = [];
  let documentViewPicker = new picker.DocumentViewPicker(); // 创建文件选择器实例
  documentViewPicker.save(documentSaveOptions).then((documentSaveResult: Array<string>) => {
    uris = documentSaveResult;

    // 传入一个下载路径，并开始下载。
    // 如果传入一个不存在的路径，则会下载到默认/data/storage/el2/base/cache/web/目录。
    //webDownloadItem.start("/data/storage/el2/base/cache/web/" + webDownloadItem.getSuggestedFileName());
    //保存到文件框提示的下载位置
    webDownloadItem.start(uris.toString());
  }).catch((err: BusinessError) => {
    console.error(`EntryAbility: Invoke documentViewPicker.save failed, code is ${err.code}, message is ${err.message}`);
  })
})

Answer 1

请参考以下demo：

import web_webview from '@ohos.web.webview'
import business_error, { BusinessError } from '@ohos.base'
import { picker } from '@kit.CoreFileKit';
import fileUri from "@ohos.file.fileuri";

@Entry
@Component
struct WebComponent {
  controller: web_webview.WebviewController = new web_webview.WebviewController();
  delegate: web_webview.WebDownloadDelegate = new web_webview.WebDownloadDelegate();

  build() {
    Column() {
      Button('setDownloadDelegate')
        .onClick(() => {
          try {
            this.delegate.onBeforeDownload((webDownloadItem: web_webview.WebDownloadItem) => {
              console.log("EntryAbility: will start a download.");

              const documentSaveOptions = new picker.DocumentSaveOptions(); // 创建文件管理器选项实例
              // documentSaveOptions.newFileNames =
              // ["摩羯星GPS轨迹导出_" + (new Date()).getTime() + ".txt"]; // 保存文件名（可选）
              // documentSaveOptions.fileSuffixChoices = ['.txt']; // 保存文件类型（可选）
              documentSaveOptions.pickerMode=1
              let uris: Array<string> = [];
              let documentViewPicker = new picker.DocumentViewPicker(); // 创建文件选择器实例
              documentViewPicker.save(documentSaveOptions).then((documentSaveResult: Array<string>) => {
                uris = documentSaveResult;
                if (0 == uris.length) {
                  return;
                }
                console.info('EntryAbility: documentViewPicker.save to file succeed and uris are:' + uris);

                /*let file = fs.openSync(uris.toString(), fs.OpenMode.READ_WRITE);
                let writeLen: number = fs.writeSync(file.fd, 'hello, world');
                console.info('write data to file succeed and size is:' + writeLen);
                fs.closeSync(file);*/

                // 传入一个下载路径，并开始下载。
                // 如果传入一个不存在的路径，则会下载到默认/data/storage/el2/base/cache/web/目录。
                // webDownloadItem.start("/data/storage/el2/base/cache/web/" +'1721361956535.txt');
                const uriString = documentSaveResult[0];
                if (!uriString) {
                  return;
                }
                const uri = new fileUri.FileUri(uriString);
                webDownloadItem.start(uri.path+'/摩羯星GPS轨迹导出_'+(new Date()).getTime() + '.txt');
                console.info('EntryAbility: download to ' + uri.path);
              }).catch((err: BusinessError) => {
                console.error(`EntryAbility: Invoke documentViewPicker.save failed, code is ${err.code}, message is ${err.message}`);
              })
            })
            this.delegate.onDownloadUpdated((webDownloadItem: web_webview.WebDownloadItem) => {
              // 下载任务的唯一标识。
              console.log("EntryAbility: download update guid: " + webDownloadItem.getGuid());
              // 下载的进度。
              console.log("EntryAbility: download update PercentComplete: " +
              webDownloadItem.getPercentComplete());
              // 当前的下载速度。
              console.log("EntryAbility: download update speed: " + webDownloadItem.getCurrentSpeed())
            })
            this.delegate.onDownloadFailed((webDownloadItem: web_webview.WebDownloadItem) => {
              console.log("EntryAbility: download failed guid: " + webDownloadItem.getGuid());
              console.log("EntryAbility: download failed LastErrorCode: " +
              webDownloadItem.getLastErrorCode());
            })
            this.delegate.onDownloadFinish((webDownloadItem: web_webview.WebDownloadItem) => {
              console.log("EntryAbility: download finish guid: " + webDownloadItem.getGuid());
            })
            this.controller.setDownloadDelegate(this.delegate);
          } catch (error) {
            let e: business_error.BusinessError = error as business_error.BusinessError;
            console.error(`ErrorCode: ${e.code}, Message: "EntryAbility download error: " + ${e.message}`);
          }
        })
      Button('startDownload')
        .onClick(() => {
          try {
            // 这里指定下载地址为xxxxx，Web组件会发起一个下载任务将该页面下载下来。
            // 开发者需要替换为自己想要下载的内容的地址。
            this.controller.startDownload('https://www.huawei.com');
          } catch (error) {
            let e:business_error.BusinessError = error as business_error.BusinessError;
            console.error(`ErrorCode: ${e.code}, EntryAbility: Message: ${e.message}`);
          }
        })
      Web({ src: 'www.huawei.com', controller: this.controller }).height('100%').width('100%')
    }
  }
}