AI导哈

AI电商平台

SmartShop AI是一个集成了AI助手的现代电商平台，提供实时数据流、交互式AI图表、语义搜索和模块化AI工具等功能。

  • by nalindard
  • TypeScript
  • 本地部署
  • 1 星标
  • 更新于
在 GitHub 查看 nalindard/ai-online-store

使用说明

SmartShop AI-配备AI助手的电子商务平台


🚀 Real-time Data Streaming & Interactive AI Charts

Experience the next generation of e-commerce admin interfaces. Ask questions in plain English and watch as complex data transforms into live, interactive charts right before your eyes.

注： 该项目是一个概念验证（POC），展示了先进的人工智能集成模式。它可作为MCP服务器、RAG和流式UI组件的参考实现。虽然功能齐全，但它使用简化的基础设施（例如SQLite），并不打算按原样进行生产部署。

一个展示尖端人工智能技术的现代电子商务平台：

  • 📊 交互式图表流 -观看数据集实时渲染为可视化
  • ⚡ 实时数据 -通过SSE（服务器发送事件）进行实时库存和销售跟踪
  • 🤖 LLM集成 （Gemini/OpenAI）具有流式响应
  • 🔧 工具调用 用于实时数据访问
  • 🔍 RAG（检索增强生成） 用于语义产品搜索
  • 🔌 MCP服务器 （模型上下文协议）用于模块化人工智能工具

建筑

┌─────────────────────────────────────────────────────────────────┐
│                         SmartShop AI                            │
├─────────────────────────────────────────────────────────────────┤
│  ┌──────────────┐    ┌──────────────┐    ┌──────────────┐       │
│  │   Frontend   │───▶│   API        │───▶│   Database   │       │
│  │   (React)    │    │   (Express)  │    │   (SQLite)   │       │
│  └──────────────┘    └──────┬───────┘    └──────────────┘       │
│                             │                                   │
│                    ┌────────┴────────┐                          │
│                    │                 │                          │
│              ┌─────▼─────┐    ┌──────▼──────┐                   │
│              │   LLM     │    │   RAG       │                   │
│              │ (Gemini)  │    │ (Embeddings)│                   │
│              └───────────┘    └─────────────┘                   │
│                                                                 │
│  ┌──────────────────────────────────────────────────────────┐   │
│  │                    MCP Servers                           │   │
│  │  ┌───────────┐  ┌───────────┐  ┌───────────────────┐     │   │
│  │  │ Products  │  │  Orders   │  │    Analytics      │     │   │
│  │  └───────────┘  └───────────┘  └───────────────────┘     │   │
│  └──────────────────────────────────────────────────────────┘   │
└─────────────────────────────────────────────────────────────────┘

┌─────────────────┐     ┌──────────────────┐
│  React Frontend │◄───►│   Vite Proxy     │
│   (port 5173)   │     │   /api → :3001   │
└─────────────────┘     └────────┬─────────┘
                                 │
                        ┌────────▼─────────┐
                        │    Express API   │
                        │   (port 3001)    │
                        │   - Auth/Shop    │
                        │   - Cart/Orders  │
                        │   - Chat (AI)    │
                        └────────┬─────────┘
                                 │
              ┌──────────────────┼──────────────────┐
              │                  │                  │
    ┌─────────▼──────┐ ┌────────▼───────┐ ┌───────▼────────┐
    │ MCP Products   │ │  MCP Orders    │ │  MCP Analytics │
    │  (port 3010)   │ │  (port 3011)   │ │   (port 3012)  │
    │  HTTP + SSE    │ │  HTTP + SSE    │ │   HTTP + SSE   │
    └────────────────┘ └────────────────┘ └────────────────┘
              │                  │                  │
              └──────────────────┼──────────────────┘
                                 │
                        ┌────────▼─────────┐
                        │   SQLite DBs     │
                        │  smartshop.db    │
                        │  vectors.db      │
                        └──────────────────┘

技术栈

层 技术
运行时 丁腈橡胶1.3+
单体仓库 Turborepo。
前端 React 18+Vite 6+顺风CSS
后端 Express.js
数据库 SQLite（面包：SQLite）
LLM Gemini 2.5 Flash/OpenAI GPT-4
嵌入 双子座嵌入-001（768维）
主控程序 @modelcontextprotocol/sdk
图表 Recharts

快速开始

先决条件

安装

# Install dependencies
bun install

# Set up environment
cp apps/api/.env.example apps/api/.env
# Add your GEMINI_API_KEY to .env

环境变量

创建 apps/api/.env 通过复制示例：

cp apps/api/.env.example apps/api/.env

然后编辑 .env 使用API密钥：

GEMINI_API_KEY=your-gemini-api-key
# OR
OPENAI_API_KEY=your-openai-api-key

JWT_SECRET=your-jwt-secret
PORT=3001

跑步

bun run dev

# Frontend: http://localhost:5173
# API: http://localhost:3001

测试账户

角色 电子邮件 密码
管理员 admin@smartshop.com 管理员123
客户 john@example.com 客户123

特性

AI聊天助手

  • 通过SSE流式传输响应
  • 基于角色的工具（客户vs管理员）
  • 对话历史

RAG语义搜索

# Initialize (admin only)
curl -X POST http://localhost:3001/admin/rag/init -H "Authorization: Bearer <token>"

# Search
curl "http://localhost:3001/shop/semantic-search?q=something+for+gaming"

流媒体图表（管理员）

  • “按类别显示收入”→ 饼图
  • “过去30天的销售趋势”→ 折线图
  • “五大畅销产品”→ 柱状图

MCP服务器

服务器 工具
产品 搜索_产品，获取_产品详情，获取_查看
订单 get_Orders、get_order_details、get_suspending
分析 get_dashboard、get_top_products、get_revenue

项目结构

ai-online-store/
├── apps/
│   ├── api/                 # Express API
│   │   └── src/
│   │       ├── services/
│   │       │   ├── chat/    # Chat + tools
│   │       │   ├── llm/     # Gemini/OpenAI
│   │       │   └── rag/     # Embeddings + Vector store
│   │       └── routes/      # API endpoints
│   ├── mcp-analytics/       # Analytics MCP Server
│   ├── mcp-orders/          # Orders MCP Server
│   ├── mcp-products/        # Products MCP Server
│   └── web/                 # React frontend
└── packages/shared/         # Shared types

实施状态

  • [x] 基础（monorestore、数据库、API）
  • [x] 核心商店功能（产品、购物车、订单）
  • [x] 人工智能聊天基础设施（LLM、工具、流媒体）
  • [x] MCP服务器集成
  • [x] RAG系统（嵌入、语义搜索）
  • [x] 流媒体图表和可视化

脚本

bun run dev      # Start all services
bun run build    # Build for production
bun run clean    # Clean build artifacts

许可证

麻省理工学院

相关 MCP