Flutter-ChatGPT

基于Flutter Web实现ChatGPT多轮聊天、翻译、Prompt文本生成、企业知识库、本地文档问答、functions\_call等性能,页面流式输入采纳StreamBuilder Widget实现,各业务模块Repository均提供直连OpenAI接口与python后端API接口流式输入性能实例

Github仓库地址

backend

采纳FastApi实现后端LangChain调用OpenAI接口

backend-data
  • 提供初始化向量文档,构建向量索引代码位于vector\_index.py
backend-service
  • function_call.py
    提供openai function call相干实例性能
  • model_query.py
    提供python办法调用参数封装模型,波及文档问答与多轮对话
  • vector_index.py
    提供本地知识库/上传文档向量化相干实例性能
backend-env

提供设置OpenAI参数设置[OPENAI\_API\_KEY]

# openaiopenai.log = "debug"openai.api_key = os.environ["OPENAI_API_KEY"]
backend-main.py

提供FastApi接口性能实例,包含response stream流解决

backend-requirments.txt

依赖组件配置,可通过terminal执行

pip install -r requirments.txt

frontend

采纳Flutter实现Web-UI(Material3)性能,具体性能可查看screenshot,已减少页面字符国际化配置

frontend-db

web浏览器IndexedDB数据库操作与模型实例

frontend-pages

业务功能模块,蕴含以下内容:

  1. 智能对话
  2. 智能翻译
  3. 智能写作
  4. 智能文档
  5. 智能工作
  • 各模块遵循repository-model-provider-view分包形式
  • 各view模块按性能复杂度拆分widgets与states
    具体拆分粒度按理论业务要求解决,尽可能执行部分刷新
  • 通过[go\_router][StatefulShellBranch]实现各页面路由状态治理
  • 通过Riverpod治理Widget UI-States(https://riverpod.dev/)
  • 页面逐字打印采纳SteamBuild Widget实现,具体代码如下message\_bot.dart:
    ///    /// 流式申请[request task stream message]    ///    Stream<String>? stream(WidgetRef ref, bool mounted) {      return          //ref.read(taskStateProvider.notifier).sendMessageStream('', '', () {          ref.read(taskStateProvider.notifier).sendMessageStreamApi('', '', () {        if (!mounted) return;        ref.read(allowInputTaskProvider.notifier).update((state) => false);      }, () {        if (!mounted) return;        ref.read(allowInputTaskProvider.notifier).update((state) => true);      });    }    ///    /// StreamBuilder    ///    class MessageBotStream extends ConsumerWidget {      const MessageBotStream(this.stream, this.controller, {super.key});      final Stream<String>? stream;      //滚动管制      final ScrollController controller;      @override      Widget build(BuildContext context, WidgetRef ref) {        return StreamBuilder(          stream: stream,          key: Key('${Random().nextDouble()}'),          builder: (BuildContext context, AsyncSnapshot<String> snapshot) {            if (snapshot.hasError) {              return Text("${t.app.error}: ${snapshot.error}");            }            if (snapshot.hasData) {              String content = snapshot.data ?? "";              scrollEnd(controller, 200);              if (content.isNotEmpty) return Text(content);            }            return const MessageLoading();          },        );      }    }
frontend-assets

提供业务模块应用图标与i18n国际化语言配置,slang国际化内容生成gen

演示成果截图

具体返回查看screenshot,或者本地运行前后端我的项目(需自行提供OpenAI Key)

援用pub flutter库(https://pub.dev/)

Flutter SDK version: 3.13.2 (stable)

Dart SDK version: 3.1.0 (stable)

animated_text_kit: ^4.2.2

flutter_spinkit: ^5.2.0

go_router: ^10.1.2

hooks_riverpod: ^2.3.10

logger: ^2.0.1

shared_preferences: ^2.2.1

sembast_web: ^2.1.3

http: ^1.1.0

file_picker: ^5.5.0

slang: ^3.23.0

slang_flutter: ^3.23.0