字节笔记本字节笔记本

Flutter 多文件格式预览

2022-06-17

Flutter应用通过集成KKfileview服务,支持多种文件格式的预览,包括文本、压缩包、图片、多媒体文件等,并提供便捷的部署选项和二次开发接口,同时解决了Android 9.0及以上版本对明文流量限制的问题。

支持文件格式

支持txt,java,php,py,md,js,css等所有纯文本
支持zip,rar,jar,tar,gzip等压缩包
支持jpg,jpeg,png,gif等图片预览(翻转,缩放,镜像)
支持mp3,mp4,flv等多媒体文件预览
使用spring boot开发,预览服务搭建部署非常简便
rest接口提供服务,跨平台特性(java,php,python,go,php,....)都支持,应用接入简单方便
支持普通http/https文件下载url、http/https文件下载流url、ftp下载url等多种预览源
提供zip,tar.gz发行包,提供一键启动脚本和丰富的配置项,方便部署使用
提供Docker镜像发行包,方便在容器环境部署
抽象预览服务接口,方便二次开发,非常方便添加其他类型文件预览支持
最最重要Apache协议开源,代码pull下来想干嘛就干嘛

部署KKfileview

docker run -it -p 8012:8012 keking/kkfileview

Flutter 预览多格式文件

import 'dart:convert';
import 'package:flutter/material.dart';
import 'package:webview_flutter/webview_flutter.dart';

class PreviewPage extends StatelessWidget {
  const PreviewPagePage({Key? key}) : super(key: key);

  String urlBase64Encoded(String url) {
    final encoded = base64Encode(url.codeUnits);
    final previewUrl = Uri.encodeComponent(encoded);
    return "https://kk.test.com/onlinePreview?url=" + previewUrl;
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('预览'),
      ),
      body: WebView(
        initialUrl: urlBase64Encoded('https://kk.test.com/demo/test1.docx'),
        javascriptMode: JavascriptMode.unrestricted,
      ),
    );
  }
}

解决net::ERR_CLEARTEXT_NOT_PERMITTED

从Android 9.0(API级别28)开始,默认情况下限制了明文流量的网络请求,对未加密流量不再信任,直接放弃请求,因此http的url均无法在webview中加载,https 不受影响。

  • 申请网格权限
<uses-permission android:name="android.permission.INTERNET" />
  • 打开android:usesCleartextTraffic
<manifest ...>
    <application
        ...
        android:usesCleartextTraffic="true"
        ...>
        ...
    </application>
</manifest>

终极解决方法:

直接用https