# chatAI对话React前端

**Repository Path**: jiangsongsong/chat-web

## Basic Information

- **Project Name**: chatAI对话React前端
- **Description**: ai对话平台，大佬救命SOS
- **Primary Language**: Unknown
- **License**: Not specified
- **Default Branch**: dev
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2024-04-24
- **Last Updated**: 2024-05-08

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

### chatgpt-web-ghl


#### 一、介绍
    1、基于React + TypeScript 实现网页版的会话聊天功能，支持ChatGPT、ChatGML等会话模型

    2、引用之前开发好的SDK：
        chatgpt-sdk-ghl:https://gitee.com/genghongliang1014/chatgpt-sdk-ghl
        chatgml-sdk-ghl:https://gitee.com/genghongliang1014/chatglm-sdk-ghl

    3、功能实现参考 chatgpt官方提供的界面效果图

#### 二、前端功能实现
    1、登录页面->只给注册过的用户使用，基于公众号登录
    2、侧边栏、聊天框、聊天记录等->基于浏览器的localStorage存储
    3、选择模型-> chatgpt or chatgml等

#### 三、架构
    1、React、Next、TypeScript 的对应关系 以及create-next-app和 create-react-app的工程目录结构和渲染
![img.png](img.png)
    
    2、React中的路由
![img_1.png](img_1.png)
    
    3、点击路由所触发的执行流程
![img_2.png](img_2.png)


#### 四、界面效果图
    1、登录效果图（关注公众号：回复验证码 ）
![img_3.png](img_3.png)

    2、回复验证码
![img_4.png](img_4.png)

    3、限制免费次数
![img_5.png](img_5.png)

    4、敏感词过滤
![img_6.png](img_6.png)

    5、模拟服务超时
![img_8.png](img_8.png)

    6、聊天界面
![img_7.png](img_7.png)