如何在 Flutter Webview 中显示或下载 pdf 文件？答案

【问题标题】：How can I show or download pdf files inside a Flutter_webview?如何在 Flutter Webview 中显示或下载 pdf 文件？
【发布时间】：2019-10-17 11:44:28
【问题描述】：

我想在我的 web 视图中打开或下载 PDF 文件。我尝试在 webview 社区版本中启用FilesURl，但它不起作用。

最好的问候法尔克

【问题讨论】：

你可以用full_pdf_viewer插件显示
@MuratAslan 我试过了，但我不知道如何在 pdf_viewer_plugin 中实现文件 URL。而且我不希望查看器在打开一个文件时指定，我希望它在我的 webview 中打开各种 PDF URL。抱歉，我对 Flutter 比较陌生

标签： android ios flutter mobile dart

【解决方案1】：

Future<File> createFileOfPdfUrl({String urlP = ''}) async {
                            final url = urlP;
                            String filename = '${DateTime.now().microsecondsSinceEpoch}';
                            var request = await HttpClient()?.getUrl(Uri.parse(url));
                            var response = await request.close();
                            var bytes = await consolidateHttpClientResponseBytes(response);
                            String dir = (await getApplicationDocumentsDirectory()).path;

                            File file = new File('$dir/$filename');
                            await file.writeAsBytes(bytes);
                            return file;
                          }

。 .

createFileOfPdfUrl(urlP: '${jsonRes['m']}').then((res) {
                                    Navigator.push(context, MaterialPageRoute(builder: (context) => PDFScreen(res.path)));
                                  });

。 . .

class PDFScreen extends StatelessWidget {
  String pathPDF = "";

  PDFScreen(this.pathPDF);

  @override
  Widget build(BuildContext context) {

    return PDFViewerScaffold(
        appBar: AppBar(
          leading: IconButton(
            onPressed: () {
              Navigator.pop(context);
            },
            icon: Icon(Icons.arrow_back_ios),
          ),
          centerTitle: true,
          title: Column(
            mainAxisAlignment: MainAxisAlignment.center,
            crossAxisAlignment: CrossAxisAlignment.center,
            children: <Widget>[
              Text(
                "PDF",
                style: TextStyle(
                  fontSize: 16,
                  color: Theme.of(context).accentColor,
                ),
              ),
              Text("Önizleme", style: TextStyle(color: Theme.of(context).accentTextTheme.subtitle.color, fontSize: 14)),
            ],
          ),
          actions: <Widget>[
            IconButton(
              icon: Icon(Icons.share),
              onPressed: () {
                Share.share('$pathPDF');
              },
            ),
          ],
        ),
        path: pathPDF);
  }
}

【讨论】：