HarmonyOS 鸿蒙Next中FilePreview使用

HarmoneyOS提供了FilePreview框架，这是一个用于文件预览的统一接口服务。它支持多种文件格式的预览，包括但不限于：

• 文档类：pdf、doc、docx、ppt、pptx、xls、xlsx等。
• 图片类：jpg、png、gif等。
• 音频类：m4a、aac、mp3、ogg、wav等。
• 视频类：mp4、mkv、ts等。
• 其他常见格式。

FilePreview服务的主要优势在于：

1. 统一的API接口。
2. 支持多种文件来源。
3. 内置多种文件格式解析能力。

解决方案

1. 本地文件指存储在应用沙箱目录或公共目录中的文件，该类文件的预览可以参考官方文档：本地文件预览。

previewLocalFile() {
  try {
    const filePath = `${this.context.filesDir}/sample.pdf`;
    // 检查文件是否存在
    const isExist = fs.accessSync(filePath);
    if (!isExist) {
      console.error('本地文件不存在，请确保文件已放置到应用目录');
      return;
    }
    // 构建PreviewInfo
    let uri = fileUri.getUriFromPath(filePath);
    let fileInfo: filePreview.PreviewInfo = {
      title: 'sample.pdf',
      uri: uri,
      mimeType: 'application/pdf',
    };
    // 打开文件预览
    filePreview.openPreview(this.context, fileInfo).then(() => {
      console.info('Succeeded in opening preview');
    }).catch((err: BusinessError) => {
      console.error(`Failed to open preview, err.code = ${err.code}, err.message = ${err.message}`);
    });
  } catch (error) {
    console.error(`预览rawfile文件失败: ${JSON.stringify(error)}`);
  }
}

1. rawfile文件预览，当前API不支持直接预览rawFile文件，预览时需要先将rawfile导入至沙箱路径。

previewRawFile() {
  try {
    // 预览rawfile文件,需要将文件复制到沙箱目录
    let filePath = `${this.context.filesDir}/sample.pdf`;
    const resourceMgr = this.context.resourceManager;
    resourceMgr.getRawFileContent('sample.pdf', (err, value) => {
      let myBuffer: ArrayBufferLike = value.buffer;
      // 创建sample.pdf沙箱路径，并写入数据
      let file = fs.openSync(filePath, fs.OpenMode.READ_WRITE | fs.OpenMode.CREATE);
      fs.writeSync(file.fd, myBuffer);
      fs.close(file);
    });
    let uri = fileUri.getUriFromPath(filePath);
    let fileInfo: filePreview.PreviewInfo = {
      title: 'sample.pdf',
      uri: uri,
      mimeType: 'application/pdf',
    };
    // 打开文件预览
    filePreview.openPreview(this.context, fileInfo).then(() => {
      console.info('Succeeded in opening preview');
    }).catch((err: BusinessError) => {
      console.error(`Failed to open preview, err.code = ${err.code}, err.message = ${err.message}`);
    });
  } catch (error) {
    console.error(`预览rawfile文件失败: ${JSON.stringify(error)}`);
  }
}

1. 网络文件预览，与rawfile文件相同，文件预览服务FilePreview暂不支持在线预览，对于网络文件需要下载到本地之后进行本地文件预览。

previewNetworkFile() {
  // url需替换为实际可用的pdf url
  const url = 'https://****.com/test.pdf';
  let filePath = `${this.context.filesDir}/sample.pdf`;
  try {
    // 网络文件下载到本地
    let res = fs.accessSync(filePath);
    if (res) {
      // 本地文件存在，则直接调用预览方法
      console.info('file exists and ViewFile');
      let uri = fileUri.getUriFromPath(filePath);
      let fileInfo: filePreview.PreviewInfo = {
        title: 'sample.pdf',
        uri: uri,
        mimeType: 'application/pdf',
      };
      // 打开文件预览
      filePreview.openPreview(this.context, fileInfo).then(() => {
        console.info('Succeeded in opening preview');
      }).catch((err: BusinessError) => {
        console.error(`Failed to open preview, err.code = ${err.code}, err.message = ${err.message}`);
      });
    } else {
      // 文件下载到本地
      request.downloadFile(this.context, {
        url: url,
        filePath: filePath
      }).then((downloadTask: request.DownloadTask) => {
        // 下载完成回调
        downloadTask.on('complete', () => {
          console.info('download complete');
          let uri = fileUri.getUriFromPath(filePath);
          let fileInfo: filePreview.PreviewInfo = {
            title: 'sample.pdf',
            uri: uri,
            mimeType: 'application/pdf',
          };
          // 打开文件预览
          filePreview.openPreview(this.context, fileInfo).then(() => {
            console.info('Succeeded in opening preview');
          }).catch((err: BusinessError) => {
            console.error(`Failed to open preview, err.code = ${err.code}, err.message = ${err.message}`);
          });
        });
      }).catch((err: BusinessError) => {
        console.error(`Invoke downloadTask failed, code is ${err.code}, message is ${err.message}`);
      });
    }
  } catch (error) {
    let err: BusinessError = error as BusinessError;
    console.error(`Invoke downloadFile failed, code is ${err.code}, message is ${err.message}`);
  }
}

总结

文件预览服务为文件预览提供了统一的解决方案：

统一接口：无论文件来源如何，都使用filepreview.openPreview()接口。

格式丰富：支持常见办公文档、图片、文本等格式。

权限管理：需要确保应用有相应文件的访问权限。

实际开发中应根据具体场景选择合适的预览方式，并处理好错误情况和用户权限问题。对于敏感文件，还应该增加额外的安全验证机制。