上一篇 下一篇 分享链接 返回 返回顶部

从浏览器到智能工作台:企业级 AI 浏览器落地方案与部署命令全记录

发布人:慈云数据-客服中心 发布时间:13小时前 阅读量:2

AI浏览器 企业级实战方案|附完整命令

一、为什么企业需要“AI浏览器”?

过去几年,企业数字化建设大多围绕 OA、ERP、CRM、知识库、BI、低代码平台、RPA、数据中台 等系统展开。员工每天需要在大量网页、后台、文档、表格、邮件和系统之间切换,信息检索、数据录入、流程审批、报表生成、客户跟进等工作耗费了大量时间。

传统浏览器只是一个访问入口,而 AI浏览器 的目标是把浏览器升级为企业员工的智能工作台:

  • 自动理解网页内容;
  • 自动总结长文档、合同、网页、邮件;
  • 自动填写表单;
  • 自动执行网页操作;
  • 自动从企业知识库中检索答案;
  • 自动生成日报、周报、销售跟进记录;
  • 自动辅助客服、运营、财务、人事、法务等岗位完成重复性工作;
  • 在企业权限、审计、安全策略下调用大模型能力。

简单来说,AI浏览器不是“换一个浏览器皮肤”,而是将 浏览器 + 大模型 + 企业知识库 + 自动化执行 + 权限审计 融合为一个企业级智能入口。

本文将给出一套可落地的企业级 AI 浏览器实战方案,并附带完整部署命令,适合技术负责人、AI应用架构师、企业信息化团队、研发团队参考。


二、企业级AI浏览器的核心能力

企业级 AI 浏览器与普通 AI 插件最大的区别在于:它必须满足企业级安全、权限、审计、可控、可扩展要求。

一个完整的企业级 AI 浏览器通常包含以下能力。

1. 网页理解能力

AI 浏览器需要能够读取当前网页的结构化内容,包括:

  • 页面标题;
  • 正文内容;
  • 表格数据;
  • 表单字段;
  • 按钮和链接;
  • 页面 DOM 结构;
  • 当前用户操作上下文。

例如员工打开一份客户合同,AI 浏览器可以直接生成合同摘要、风险条款、付款节点、违约责任分析。

2. 企业知识问答能力

AI 浏览器应接入企业内部知识库,例如:

  • 公司制度;
  • 产品文档;
  • 销售话术;
  • 研发接口文档;
  • 运维手册;
  • 法务模板;
  • 客服 FAQ;
  • 历史项目资料。

员工在浏览任意业务系统页面时,可以直接询问:

“这个客户属于哪个行业?历史合作金额是多少?推荐下一步跟进动作是什么?”

AI 浏览器会结合当前页面信息与企业知识库进行回答。

3. 自动化执行能力

AI 浏览器不仅要“回答问题”,还要能“执行任务”。

典型场景包括:

  • 自动填写 CRM 客户信息;
  • 自动生成并提交工单;
  • 自动在后台系统中创建订单;
  • 自动从页面中提取数据并导出;
  • 自动进行多系统数据比对;
  • 自动完成重复性网页操作。

这部分能力可以通过浏览器扩展、Playwright、Puppeteer、RPA 或企业自研自动化引擎实现。

4. 权限控制能力

企业场景不能让 AI 任意读取所有数据。因此必须具备:

  • 用户身份认证;
  • 部门权限隔离;
  • 数据访问控制;
  • 模型调用权限控制;
  • 敏感字段脱敏;
  • 操作授权确认;
  • 高风险动作拦截。

例如普通销售不能通过 AI 查询财务利润数据,人事专员不能读取研发代码仓库内容。

5. 审计与合规能力

企业需要知道:

  • 谁在什么时间使用了 AI;
  • 提问了什么问题;
  • 调用了哪些知识库;
  • 生成了什么内容;
  • 是否触发敏感信息;
  • 是否执行了网页操作;
  • 操作结果是否成功。

因此 AI 浏览器必须保留完整审计日志,以满足安全、风控、合规和内部管理要求。


三、总体架构设计

企业级 AI 浏览器推荐采用以下架构:

┌──────────────────────────┐
│        AI浏览器插件        │
│ Chrome/Edge Extension    │
└─────────────┬────────────┘
              │
              ▼
┌──────────────────────────┐
│       AI网关服务层         │
│ Auth / API / Audit / RBAC │
└─────────────┬────────────┘
              │
 ┌────────────┼────────────┐
 ▼            ▼            ▼
┌───────┐  ┌────────┐  ┌──────────┐
│LLM服务│  │知识库服务│  │自动化执行服务│
│OpenAI │  │RAG检索 │  │Playwright │
│Qwen   │  │向量数据库│  │RPA Engine │
│DeepSeek│ │文档解析 │  │Workflow   │
└───────┘  └────────┘  └──────────┘
              │
              ▼
┌──────────────────────────┐
│      企业业务系统          │
│ OA/CRM/ERP/BI/工单/邮箱    │
└──────────────────────────┘

各模块说明

模块 作用
AI浏览器插件 采集当前网页上下文,提供侧边栏对话、总结、执行入口
AI网关 统一鉴权、权限控制、模型路由、审计日志、限流
LLM服务 对接大模型,可使用公有云模型或本地私有化模型
知识库服务 文档解析、向量化、检索增强生成
自动化服务 执行网页点击、填写、抓取、流程编排
审计服务 记录用户请求、模型输出、执行动作
管理后台 配置模型、知识库、权限、策略、日志查看

四、技术选型建议

1. 浏览器插件

推荐技术栈:

  • Manifest V3;
  • TypeScript;
  • React;
  • Vite;
  • Chrome Extension API;
  • Side Panel API;
  • Content Script;
  • Background Service Worker。

插件主要负责:

  • 获取网页文本;
  • 获取选中文本;
  • 提供右键菜单;
  • 展示 AI 对话侧边栏;
  • 调用后端 AI 网关;
  • 在用户确认后执行网页操作。

2. 后端服务

推荐技术栈:

  • Node.js / NestJS;
  • Python / FastAPI;
  • Java / Spring Boot。

如果团队偏 AI 工程,推荐 FastAPI;如果偏企业后端系统,推荐 Spring Boot;如果偏前端全栈,推荐 NestJS。

本文示例采用:

  • 前端插件:Vite + React + TypeScript;
  • 后端网关:FastAPI;
  • 向量数据库:Qdrant;
  • 关系数据库:PostgreSQL;
  • 缓存:Redis;
  • 自动化执行:Playwright;
  • 部署方式:Docker Compose。

3. 大模型选择

可根据企业情况选择:

类型 代表模型 适用场景
公有云模型 GPT、Claude、Gemini、通义千问、DeepSeek API 快速上线、效果优先
私有化模型 Qwen、DeepSeek、Llama、Yi 数据敏感、内网部署
混合模式 敏感数据走本地,普通任务走公有云 成本与安全平衡

企业初期建议使用混合模式:

  • 普通总结、润色、翻译使用公有云;
  • 涉及客户、合同、财务、人事的数据走本地模型;
  • 通过 AI 网关统一脱敏和路由。

五、部署环境准备

以下命令以 Ubuntu 22.04 为例。

1. 更新系统

sudo apt update && sudo apt upgrade -y

2. 安装基础工具

sudo apt install -y \
  curl \
  wget \
  git \
  vim \
  unzip \
  ca-certificates \
  gnupg \
  lsb-release \
  build-essential

3. 安装 Docker

curl -fsSL https://get.docker.com | sudo bash

启动 Docker:

sudo systemctl enable docker
sudo systemctl start docker

将当前用户加入 docker 用户组:

sudo usermod -aG docker $USER

重新登录后验证:

docker version

4. 安装 Docker Compose

sudo apt install -y docker-compose-plugin

验证:

docker compose version

5. 安装 Node.js

curl -fsSL https://deb.nodesource.com/setup_20.x | sudo -E bash -
sudo apt install -y nodejs

验证:

node -v
npm -v

6. 安装 Python

sudo apt install -y python3 python3-pip python3-venv

验证:

python3 --version
pip3 --version

六、项目目录设计

创建项目目录:

mkdir -p ~/ai-browser-enterprise
cd ~/ai-browser-enterprise

推荐目录结构:

ai-browser-enterprise/
├── backend/
│   ├── app/
│   │   ├── main.py
│   │   ├── config.py
│   │   ├── auth.py
│   │   ├── llm.py
│   │   ├── rag.py
│   │   ├── audit.py
│   │   └── automation.py
│   ├── requirements.txt
│   └── Dockerfile
├── extension/
│   ├── src/
│   │   ├── background.ts
│   │   ├── content.ts
│   │   ├── sidepanel/
│   │   └── utils/
│   ├── manifest.json
│   ├── package.json
│   └── vite.config.ts
├── docker-compose.yml
└── README.md

创建目录命令:

mkdir -p backend/app
mkdir -p extension/src/sidepanel
mkdir -p extension/src/utils
touch docker-compose.yml README.md

七、后端AI网关实现

进入后端目录:

cd ~/ai-browser-enterprise/backend

创建依赖文件:

cat > requirements.txt << 'EOF'
fastapi==0.115.0
uvicorn[standard]==0.30.6
pydantic==2.8.2
python-dotenv==1.0.1
httpx==0.27.2
redis==5.0.8
psycopg2-binary==2.9.9
qdrant-client==1.11.1
playwright==1.46.0
python-jose==3.3.0
passlib[bcrypt]==1.7.4
EOF

创建配置文件:

cat > app/config.py << 'EOF'
import os

class Settings:
    APP_NAME = "Enterprise AI Browser Gateway"
    API_KEY = os.getenv("API_KEY", "change-me")
    LLM_PROVIDER = os.getenv("LLM_PROVIDER", "openai-compatible")
    LLM_BASE_URL = os.getenv("LLM_BASE_URL", "https://api.openai.com/v1")
    LLM_API_KEY = os.getenv("LLM_API_KEY", "")
    LLM_MODEL = os.getenv("LLM_MODEL", "gpt-4o-mini")
    REDIS_URL = os.getenv("REDIS_URL", "redis://redis:6379/0")
    QDRANT_URL = os.getenv("QDRANT_URL", "http://qdrant:6333")
    DATABASE_URL = os.getenv("DATABASE_URL", "postgresql://ai:ai_pass@postgres:5432/ai_browser")

settings = Settings()
EOF

创建大模型调用模块:

cat > app/llm.py << 'EOF'
import httpx
from .config import settings

async def chat_completion(messages):
    url = f"{settings.LLM_BASE_URL}/chat/completions"
    headers = {
        "Authorization": f"Bearer {settings.LLM_API_KEY}",
        "Content-Type": "application/json"
    }
    payload = {
        "model": settings.LLM_MODEL,
        "messages": messages,
        "temperature": 0.2
    }

    async with httpx.AsyncClient(timeout=60) as client:
        response = await client.post(url, headers=headers, json=payload)
        response.raise_for_status()
        data = response.json()
        return data["choices"][0]["message"]["content"]
EOF

创建审计模块:

cat > app/audit.py << 'EOF'
from datetime import datetime

async def write_audit_log(user_id: str, action: str, detail: dict):
    log = {
        "time": datetime.utcnow().isoformat(),
        "user_id": user_id,
        "action": action,
        "detail": detail
    }
    print("[AUDIT]", log)
    return log
EOF

创建知识库检索模块:

cat > app/rag.py << 'EOF'
async def retrieve_context(query: str):
    # 实战中这里应接入向量数据库,例如 Qdrant、Milvus、pgvector
    # 返回与用户问题相关的企业知识片段
    return [
        "企业知识库示例:客户资料不得通过外部未授权渠道传播。",
        "企业知识库示例:合同审批金额超过50万元需要法务和财务共同审批。",
        "企业知识库示例:销售跟进记录应包含客户需求、预算、决策人、下一步计划。"
    ]
EOF

创建自动化模块:

cat > app/automation.py << 'EOF'
async def generate_action_plan(task: str, page_context: str):
    # 这里只生成计划,不直接执行,企业环境必须经过用户确认
    return {
        "task": task,
        "risk_level": "medium",
        "need_user_confirm": True,
        "steps": [
            "读取当前页面关键信息",
            "定位需要填写的表单字段",
            "生成建议填写内容",
            "等待用户确认",
            "执行填写或提交操作"
        ]
    }
EOF

创建主服务:

cat > app/main.py << 'EOF'
from fastapi import FastAPI, Header, HTTPException
from pydantic import BaseModel
from typing import Optional
from .config import settings
from .llm import chat_completion
from .rag import retrieve_context
from .audit import write_audit_log
from .automation import generate_action_plan

app = FastAPI(title=settings.APP_NAME)

class ChatRequest(BaseModel):
    user_id: str
    question: str
    page_url: Optional[str] = None
    page_title: Optional[str] = None
    page_text: Optional[str] = None

class ActionRequest(BaseModel):
    user_id: str
    task: str
    page_url: Optional[str] = None
    page_text: Optional[str] = None

def check_api_key(x_api_key: str):
    if x_api_key != settings.API_KEY:
        raise HTTPException(status_code=401, detail="Invalid API Key")

@app.get("/health")
async def health():
    return {"status": "ok", "app": settings.APP_NAME}

@app.post("/api/chat")
async def chat(req: ChatRequest, x_api_key: str = Header(...)):
    check_api_key(x_api_key)

    contexts = await retrieve_context(req.question)

    system_prompt = """
你是企业级AI浏览器助手。
你需要结合当前网页内容和企业知识库回答问题。
要求:
1. 不编造事实;
2. 涉及敏感数据时提醒用户遵守公司制度;
3. 对高风险操作给出风险提示;
4. 输出结构清晰、简洁可执行。
"""

    user_prompt = f"""
当前页面URL:{req.page_url}
当前页面标题:{req.page_title}

当前页面内容:
{req.page_text}

企业知识库相关内容:
{chr(10).join(contexts)}

用户问题:
{req.question}
"""

    answer = await chat_completion([
        {"role": "system", "content": system_prompt},
        {"role": "user", "content": user_prompt}
    ])

    await write_audit_log(req.user_id, "chat", {
        "question": req.question,
        "page_url": req.page_url,
        "answer_preview": answer[:200]
    })

    return {"answer": answer}

@app.post("/api/action-plan")
async def action_plan(req: ActionRequest, x_api_key: str = Header(...)):
    check_api_key(x_api_key)

    plan = await generate_action_plan(req.task, req.page_text or "")

    await write_audit_log(req.user_id, "action_plan", {
        "task": req.task,
        "page_url": req.page_url,
        "plan": plan
    })

    return plan
EOF

创建 Dockerfile:

cat > Dockerfile << 'EOF'
FROM python:3.11-slim

WORKDIR /app

COPY requirements.txt .

RUN pip install --no-cache-dir -r requirements.txt

COPY app ./app

EXPOSE 8000

CMD ["uvicorn", "app.main:app", "--host", "0.0.0.0", "--port", "8000"]
EOF

八、Docker Compose 编排

回到项目根目录:

cd ~/ai-browser-enterprise

创建 docker-compose.yml

cat > docker-compose.yml << 'EOF'
services:
  backend:
    build:
      context: ./backend
    container_name: ai-browser-backend
    ports:
      - "8000:8000"
    environment:
      API_KEY: "enterprise-demo-key"
      LLM_BASE_URL: "https://api.openai.com/v1"
      LLM_API_KEY: "替换为你的模型API Key"
      LLM_MODEL: "gpt-4o-mini"
      REDIS_URL: "redis://redis:6379/0"
      QDRANT_URL: "http://qdrant:6333"
      DATABASE_URL: "postgresql://ai:ai_pass@postgres:5432/ai_browser"
    depends_on:
      - redis
      - qdrant
      - postgres

  redis:
    image: redis:7
    container_name: ai-browser-redis
    ports:
      - "6379:6379"

  qdrant:
    image: qdrant/qdrant:v1.11.0
    container_name: ai-browser-qdrant
    ports:
      - "6333:6333"
    volumes:
      - qdrant_data:/qdrant/storage

  postgres:
    image: postgres:16
    container_name: ai-browser-postgres
    ports:
      - "5432:5432"
    environment:
      POSTGRES_USER: ai
      POSTGRES_PASSWORD: ai_pass
      POSTGRES_DB: ai_browser
    volumes:
      - postgres_data:/var/lib/postgresql/data

volumes:
  qdrant_data:
  postgres_data:
EOF

启动服务:

docker compose up -d --build

查看容器状态:

docker compose ps

查看日志:

docker compose logs -f backend

测试健康检查:

curl http://localhost:8000/health

如果返回如下内容,说明后端启动成功:

{
  "status": "ok",
  "app": "Enterprise AI Browser Gateway"
}

测试 AI 对话接口:

curl -X POST http://localhost:8000/api/chat \
  -H "Content-Type: application/json" \
  -H "x-api-key: enterprise-demo-key" \
  -d '{
    "user_id": "u001",
    "question": "请总结当前页面内容,并指出可能的风险点",
    "page_url": "https://crm.example.com/customer/1001",
    "page_title": "客户详情页",
    "page_text": "客户名称:某某科技有限公司。合同金额:80万元。当前状态:待审批。备注:需要尽快走合同审批流程。"
  }'

九、浏览器插件实现

进入插件目录:

cd ~/ai-browser-enterprise/extension

初始化前端项目:

npm create vite@latest . -- --template react-ts

安装依赖:

npm install

创建 Manifest 文件:

cat > manifest.json << 'EOF'
{
  "manifest_version": 3,
  "name": "Enterprise AI Browser",
  "version": "1.0.0",
  "description": "企业级AI浏览器助手",
  "permissions": [
    "activeTab",
    "scripting",
    "sidePanel",
    "contextMenus",
    "storage"
  ],
  "host_permissions": [
    ""
  ],
  "background": {
    "service_worker": "src/background.ts",
    "type": "module"
  },
  "content_scripts": [
    {
      "matches": [""],
      "js": ["src/content.ts"]
    }
  ],
  "side_panel": {
    "default_path": "index.html"
  },
  "action": {
    "default_title": "Enterprise AI Browser"
  }
}
EOF

创建内容脚本:

cat > src/content.ts << 'EOF'
chrome.runtime.onMessage.addListener((message, sender, sendResponse) => {
  if (message.type === "GET_PAGE_CONTEXT") {
    const pageText = document.body.innerText.slice(0, 12000);
    sendResponse({
      url: location.href,
      title: document.title,
      text: pageText
    });
  }
});
EOF

创建后台脚本:

cat > src/background.ts << 'EOF'
chrome.runtime.onInstalled.addListener(() => {
  chrome.contextMenus.create({
    id: "ai-summarize",
    title: "使用企业AI总结当前页面",
    contexts: ["page", "selection"]
  });
});

chrome.action.onClicked.addListener(async (tab) => {
  if (tab.id) {
    await chrome.sidePanel.open({ tabId: tab.id });
  }
});

chrome.contextMenus.onClicked.addListener(async (info, tab) => {
  if (info.menuItemId === "ai-summarize" && tab?.id) {
    await chrome.sidePanel.open({ tabId: tab.id });
  }
});
EOF

修改 src/App.tsx

cat > src/App.tsx << 'EOF'
import { useState } from "react";
import "./App.css";

const API_BASE = "http://localhost:8000";
const API_KEY = "enterprise-demo-key";

function App() {
  const [question, setQuestion] = useState("请总结当前页面,并列出关键风险点");
  const [answer, setAnswer] = useState("");
  const [loading, setLoading] = useState(false);

  async function getCurrentTab() {
    const tabs = await chrome.tabs.query({ active: true, currentWindow: true });
    return tabs[0];
  }

  async function getPageContext(tabId: number) {
    return await chrome.tabs.sendMessage(tabId, { type: "GET_PAGE_CONTEXT" });
  }

  async function askAI() {
    setLoading(true);
    setAnswer("");

    try {
      const tab = await getCurrentTab();
      if (!tab.id) {
        throw new Error("无法获取当前标签页");
      }

      const ctx = await getPageContext(tab.id);

      const response = await fetch(`${API_BASE}/api/chat`, {
        method: "POST",
        headers: {
          "Content-Type": "application/json",
          "x-api-key": API_KEY
        },
        body: JSON.stringify({
          user_id: "demo-user",
          question,
          page_url: ctx.url,
          page_title: ctx.title,
          page_text: ctx.text
        })
      });

      const data = await response.json();
      setAnswer(data.answer || JSON.stringify(data));
    } catch (err: any) {
      setAnswer(`请求失败:${err.message}`);
    } finally {
      setLoading(false);
    }
  }

  return (
    

企业AI浏览器助手