damianr93/cogni-threat-front
GitHub: damianr93/cogni-threat-front
CogniThreat 前端是开源威胁情报平台的可视化界面，用于管理和展示威胁情报数据并集成本地 AI 分析能力。
Stars: 0 | Forks: 0
# Cogni-Threat - Frontend
使用 React、TypeScript 和 Vite 开发的前端，用于可视化和管理与威胁情报相关的信息。
## 通过 Docker 快速开始
对于社区设置，请从同级的后端仓库 (`../cogni-threat`) 运行全栈。后端的 compose 文件会构建此前端并通过 Nginx 提供服务。
```
cd ../cogni-threat
cp .env.template .env
docker compose up --build
```
默认情况下，前端在 `http://localhost:8080` 暴露。只有在需要构建好的前端调用默认 `/api` 代理路径之外的 API 时，才需设置 `VITE_API_URL`。
首次启动时，使用后端的 `ADMIN_EMAIL` / `ADMIN_PASSWORD` 值登录，并使用 **管理 → 数据源、凭证和 AI** 来配置 API 密钥以及 Ollama/RAG 设置。
当前开源的 AI 提供商是 Ollama。管理面板允许您配置 Ollama URL、聊天模型、嵌入模型和 RAG 参数。`EMBEDDING_DIM` 仅限后端使用，因为它必须与 pgvector schema 匹配；更改嵌入维度需要重新索引。
## 使用的技术
* React
* TypeScript
* Vite
* Redux Toolkit
* Material UI
* MUI X-Charts
* React Router
* Axios
* Tailwind CSS
* pnpm
# 要求
* 推荐全栈设置需使用 Docker 和 Docker Compose。
* 本地前端开发需使用 Node.js 22 或更高版本以及 pnpm。
该项目使用 Corepack 来管理 pnpm 的版本。
# 本地开发
克隆仓库：
```
git clone
cd cogni-threat-front
```
安装依赖：
```
corepack enable
pnpm install
```
# 配置
复制示例文件：
```
cp .env.template .env
```
配置必要的变量：
```
VITE_API_URL=http://localhost:3000
```
# 运行
## 开发
```
pnpm run dev
```
## 构建
```
pnpm run build
```
## 生产环境预览
```
pnpm run preview
```
# 项目结构
```
src/
├── app/
├── pages/
├── shared/
├── store/
├── theme/
├── types/
│
├── index.css
└── vite-env.d.ts
public/
```
# 重要文件
## src/app/*
应用程序的主配置。
## src/pages/*
主要页面和视图。
## src/shared/*
可重用的组件、工具和元素。
## src/store/*
Redux Toolkit 的全局配置。
## src/theme/*
视觉配置和全局样式。
## src/types/*
TypeScript 类型定义。
# 项目规范
## 依赖管理
始终使用：
```
pnpm
```
不要使用：
```
npm
```
或
```
yarn
```
以避免 lockfile 不一致。
## 环境变量
所有敏感配置必须通过环境变量声明。
不要提交：
```
.env
```
## 代码风格
* 严格的 TypeScript。
* 函数式组件。
* 用于可重用逻辑的 Hooks。
* 使用 Redux Toolkit 进行状态管理。
* 使用 Material UI 作为视觉组件。
* 使用 Axios 与 API 通信。
# Git 工作流
## 主开发分支
所有更改都应在以下分支上进行：
```
develop
```
常规流程：
```
git checkout develop
git pull origin develop
git add .
git commit -m "Descripción del cambio"
git push origin develop
```
## 部署
`develop` 分支用作主开发分支。
更改经过验证后，将通过为项目配置的 CI/CD pipeline 部署到相应的环境中。
请勿直接在生产服务器上进行更改。
## 最佳实践
* 开始工作前保持 `develop` 分支为最新状态。
* 尽可能执行描述性强且小规模的 commit。
* 执行 push 之前，验证应用程序是否能正确编译。
* 避免在提交中包含临时文件、凭证或 `.env` 文件。
标签：Mutation, React, Syscalls, TypeScript, Vite, 前端, 可视化, 威胁情报, 安全插件, 开发者工具, 自动化攻击, 请求拦截