Flutter中如何通过文件路径打开并查看Docx文件？

方法1：调用系统默认应用打开（推荐） #

直接调用设备自带的办公软件（如WPS、Microsoft Word）打开文件，完全避开第三方包的引擎加载问题，兼容性拉满。

实现步骤： #

1. 添加依赖：

   dependencies:
     open_file: ^3.3.2
   

2. 调用代码：

   import 'package:open_file/open_file.dart';
   
   void openDocxFile(String filePath) async {
     // 传入本地文件路径，直接调用系统应用打开
     final result = await OpenFile.open(filePath);
     // 可根据result.code判断是否成功打开，失败时提示用户安装办公软件
     if (result.code != 0) {
       // 处理打开失败逻辑
     }
   }
   

方法2：纯Dart解析文本内容（轻量场景） #

如果只需要查看Docx里的纯文本，不需要保留格式，可以用docx包解析文件内容，用原生Flutter组件展示。

实现步骤： #

1. 添加依赖：

   dependencies:
     docx: ^0.6.2
   

2. 解析并展示代码：

   import 'package:docx/docx.dart';
   import 'dart:io';
   import 'package:flutter/material.dart';
   
   Future<String> extractDocxText(String filePath) async {
     final file = File(filePath);
     final bytes = await file.readAsBytes();
     final doc = DocxDocument.fromBytes(bytes);
     return doc.text;
   }
   
   // 在Widget中用FutureBuilder展示文本
   Widget buildDocxText(String filePath) {
     return FutureBuilder<String>(
       future: extractDocxText(filePath),
       builder: (context, snapshot) {
         if (snapshot.hasData) {
           return SingleChildScrollView(child: Text(snapshot.data!));
         } else if (snapshot.hasError) {
           return Text('解析失败: ${snapshot.error}');
         }
         return const CircularProgressIndicator();
       },
     );
   }
   

方法3：WebView加载格式完整的预览（需后端支持） #

如果需要完整保留Docx的排版、图片、表格等格式，可将本地文件上传到后端，转换为HTML/PDF或在线预览链接，再用webview_flutter加载。

核心代码示例： #

import 'package:webview_flutter/webview_flutter.dart';
import 'dart:convert';
import 'dart:io';

Widget buildDocxPreviewWebView(String filePath) async {
  final file = File(filePath);
  final bytes = await file.readAsBytes();
  final base64File = base64Encode(bytes);
  // 对接后端接口获取预览链接，以下为模拟逻辑
  final previewUrl = await uploadAndGetPreviewUrl(base64File);

  return WebViewWidget(
    controller: WebViewController()..loadRequest(Uri.parse(previewUrl)),
  );
}

// 模拟文件上传与预览链接获取逻辑，需替换为真实接口
Future<String> uploadAndGetPreviewUrl(String base64File) async {
  // 实现上传逻辑
  return 'https://your-backend.com/preview/docx';
}

权限配置注意事项 #

• 安卓：在android/app/src/main/AndroidManifest.xml中添加文件读取权限：

  <uses-permission android:name="android.permission.READ_EXTERNAL_STORAGE"/>
  

• iOS：在ios/Runner/Info.plist中添加权限描述：

  <key>NSDocumentFolderUsageDescription</key>
  <string>需要访问文档文件夹以打开Docx文件</string>
  

内容的提问来源于stack exchange，提问作者fayzo bngsh