215 lines
8.2 KiB
Python
215 lines
8.2 KiB
Python
|
"""
|
|||
|
|
艾叶 IM Bridge — 个人网页通道
|
|||
|
|
对接方式：
|
|||
|
|
1. REST API — POST /api/web/chat
|
|||
|
|
2. WebSocket — ws://host:port/ws/web/chat
|
|||
|
|
|
|||
|
|
提供即开即用的网页聊天入口，也可作为第三方系统接入的通用 API。
|
|||
|
|
|
|||
|
|
配置项：
|
|||
|
|
allowed_origins: ["*"] # CORS 白名单
|
|||
|
|
"""
|
|||
|
|
from __future__ import annotations
|
|||
|
|
|
|||
|
|
import json
|
|||
|
|
import logging
|
|||
|
|
import uuid
|
|||
|
|
from typing import Any, Dict, Set
|
|||
|
|
|
|||
|
|
from fastapi import Request, WebSocket, WebSocketDisconnect
|
|||
|
|
from fastapi.responses import HTMLResponse
|
|||
|
|
|
|||
|
|
from core.channel_base import ChannelBase, InboundMessage, MessageType, OutboundMessage
|
|||
|
|
|
|||
|
|
logger = logging.getLogger("aiye.channel.web")
|
|||
|
|
|
|||
|
|
|
|||
|
|
class WebChannel(ChannelBase):
|
|||
|
|
"""个人网页通道（REST + WebSocket）"""
|
|||
|
|
|
|||
|
|
_ws_connections: Dict[str, WebSocket] = {}
|
|||
|
|
|
|||
|
|
@property
|
|||
|
|
def platform(self) -> str:
|
|||
|
|
return "web"
|
|||
|
|
|
|||
|
|
async def start(self) -> None:
|
|||
|
|
logger.info("网页通道已就绪，API: /api/web/chat | WS: /ws/web/chat")
|
|||
|
|
|
|||
|
|
async def stop(self) -> None:
|
|||
|
|
for ws in self._ws_connections.values():
|
|||
|
|
try:
|
|||
|
|
await ws.close()
|
|||
|
|
except Exception:
|
|||
|
|
pass
|
|||
|
|
self._ws_connections.clear()
|
|||
|
|
logger.info("网页通道已停止")
|
|||
|
|
|
|||
|
|
async def send(self, msg: OutboundMessage) -> bool:
|
|||
|
|
ws = self._ws_connections.get(msg.chat_id)
|
|||
|
|
if ws:
|
|||
|
|
try:
|
|||
|
|
await ws.send_json({"type": "reply", "content": msg.content})
|
|||
|
|
return True
|
|||
|
|
except Exception as e:
|
|||
|
|
logger.warning("WebSocket 发送失败: %s", e)
|
|||
|
|
return True
|
|||
|
|
|
|||
|
|
def register_routes(self, app: Any) -> None:
|
|||
|
|
channel = self
|
|||
|
|
|
|||
|
|
@app.post("/api/web/chat")
|
|||
|
|
async def web_chat_api(request: Request):
|
|||
|
|
"""REST 聊天接口：{"message": "你好", "session_id": "可选"}"""
|
|||
|
|
try:
|
|||
|
|
data = await request.json()
|
|||
|
|
except Exception:
|
|||
|
|
return {"code": 400, "msg": "invalid json"}
|
|||
|
|
|
|||
|
|
message = data.get("message", "").strip()
|
|||
|
|
session_id = data.get("session_id", "") or str(uuid.uuid4())[:8]
|
|||
|
|
if not message:
|
|||
|
|
return {"code": 400, "msg": "empty message"}
|
|||
|
|
|
|||
|
|
inbound = InboundMessage(
|
|||
|
|
channel_id=channel.channel_id,
|
|||
|
|
platform=channel.platform,
|
|||
|
|
sender_id=session_id,
|
|||
|
|
sender_name=data.get("name", "网页用户"),
|
|||
|
|
chat_id=session_id,
|
|||
|
|
content=message,
|
|||
|
|
)
|
|||
|
|
|
|||
|
|
reply = await channel.dispatch(inbound)
|
|||
|
|
return {
|
|||
|
|
"code": 0,
|
|||
|
|
"reply": reply.content if reply else "",
|
|||
|
|
"session_id": session_id,
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
@app.websocket("/ws/web/chat")
|
|||
|
|
async def web_chat_ws(websocket: WebSocket):
|
|||
|
|
"""WebSocket 聊天接口"""
|
|||
|
|
await websocket.accept()
|
|||
|
|
ws_id = str(uuid.uuid4())[:8]
|
|||
|
|
channel._ws_connections[ws_id] = websocket
|
|||
|
|
await websocket.send_json({"type": "connected", "session_id": ws_id})
|
|||
|
|
logger.info("WebSocket 连接: %s", ws_id)
|
|||
|
|
|
|||
|
|
try:
|
|||
|
|
while True:
|
|||
|
|
raw = await websocket.receive_text()
|
|||
|
|
try:
|
|||
|
|
data = json.loads(raw)
|
|||
|
|
message = data.get("message", "").strip()
|
|||
|
|
except Exception:
|
|||
|
|
message = raw.strip()
|
|||
|
|
|
|||
|
|
if not message:
|
|||
|
|
continue
|
|||
|
|
|
|||
|
|
inbound = InboundMessage(
|
|||
|
|
channel_id=channel.channel_id,
|
|||
|
|
platform=channel.platform,
|
|||
|
|
sender_id=ws_id,
|
|||
|
|
sender_name="网页用户",
|
|||
|
|
chat_id=ws_id,
|
|||
|
|
content=message,
|
|||
|
|
)
|
|||
|
|
|
|||
|
|
reply = await channel.dispatch(inbound)
|
|||
|
|
if reply:
|
|||
|
|
await websocket.send_json({
|
|||
|
|
"type": "reply",
|
|||
|
|
"content": reply.content,
|
|||
|
|
})
|
|||
|
|
except WebSocketDisconnect:
|
|||
|
|
logger.info("WebSocket 断开: %s", ws_id)
|
|||
|
|
except Exception as e:
|
|||
|
|
logger.warning("WebSocket 异常: %s", e)
|
|||
|
|
finally:
|
|||
|
|
channel._ws_connections.pop(ws_id, None)
|
|||
|
|
|
|||
|
|
@app.get("/chat", response_class=HTMLResponse)
|
|||
|
|
async def web_chat_page():
|
|||
|
|
"""内嵌网页聊天界面"""
|
|||
|
|
html_path = channel._config.get("html_path", "")
|
|||
|
|
if html_path:
|
|||
|
|
try:
|
|||
|
|
from pathlib import Path
|
|||
|
|
|
|||
|
|
return Path(html_path).read_text(encoding="utf-8")
|
|||
|
|
except Exception:
|
|||
|
|
pass
|
|||
|
|
return _DEFAULT_CHAT_HTML
|
|||
|
|
|
|||
|
|
|
|||
|
|
_DEFAULT_CHAT_HTML = """<!DOCTYPE html>
|
|||
|
|
<html lang="zh-CN">
|
|||
|
|
<head>
|
|||
|
|
<meta charset="utf-8">
|
|||
|
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|||
|
|
<title>艾叶 · 卡若AI 聊天</title>
|
|||
|
|
<style>
|
|||
|
|
*{margin:0;padding:0;box-sizing:border-box}
|
|||
|
|
body{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;background:#f0f2f5;height:100vh;display:flex;flex-direction:column}
|
|||
|
|
.header{background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);color:#fff;padding:16px 20px;font-size:18px;font-weight:600;text-align:center}
|
|||
|
|
.chat-box{flex:1;overflow-y:auto;padding:16px 20px;display:flex;flex-direction:column;gap:12px}
|
|||
|
|
.msg{max-width:80%;padding:10px 14px;border-radius:16px;font-size:15px;line-height:1.5;word-break:break-word;animation:fadeIn .3s}
|
|||
|
|
.msg.user{align-self:flex-end;background:#667eea;color:#fff;border-bottom-right-radius:4px}
|
|||
|
|
.msg.ai{align-self:flex-start;background:#fff;color:#333;border-bottom-left-radius:4px;box-shadow:0 1px 3px rgba(0,0,0,.1)}
|
|||
|
|
.msg.ai pre{background:#f5f5f5;padding:8px;border-radius:6px;overflow-x:auto;font-size:13px;margin:6px 0}
|
|||
|
|
.input-area{display:flex;gap:8px;padding:12px 20px;background:#fff;border-top:1px solid #e0e0e0}
|
|||
|
|
.input-area input{flex:1;border:1px solid #ddd;border-radius:20px;padding:10px 16px;font-size:15px;outline:none}
|
|||
|
|
.input-area input:focus{border-color:#667eea}
|
|||
|
|
.input-area button{background:#667eea;color:#fff;border:none;border-radius:20px;padding:10px 20px;font-size:15px;cursor:pointer}
|
|||
|
|
.input-area button:hover{background:#5a6fd6}
|
|||
|
|
.typing{align-self:flex-start;color:#999;font-size:13px;padding:4px 14px}
|
|||
|
|
@keyframes fadeIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}
|
|||
|
|
</style>
|
|||
|
|
</head>
|
|||
|
|
<body>
|
|||
|
|
<div class="header">艾叶 · 卡若AI</div>
|
|||
|
|
<div class="chat-box" id="chatBox">
|
|||
|
|
<div class="msg ai">你好！我是卡若AI，通过艾叶 IM 为你服务。有什么可以帮你的？</div>
|
|||
|
|
</div>
|
|||
|
|
<div class="input-area">
|
|||
|
|
<input id="msgInput" placeholder="输入消息..." autocomplete="off">
|
|||
|
|
<button onclick="sendMsg()">发送</button>
|
|||
|
|
</div>
|
|||
|
|
<script>
|
|||
|
|
const chatBox=document.getElementById('chatBox'),input=document.getElementById('msgInput');
|
|||
|
|
let ws,sessionId='';
|
|||
|
|
function connect(){
|
|||
|
|
const proto=location.protocol==='https:'?'wss:':'ws:';
|
|||
|
|
ws=new WebSocket(`${proto}//${location.host}/ws/web/chat`);
|
|||
|
|
ws.onopen=()=>console.log('connected');
|
|||
|
|
ws.onmessage=e=>{
|
|||
|
|
const d=JSON.parse(e.data);
|
|||
|
|
if(d.type==='connected'){sessionId=d.session_id;return}
|
|||
|
|
if(d.type==='reply'){removeTyping();addMsg(d.content,'ai')}
|
|||
|
|
};
|
|||
|
|
ws.onclose=()=>setTimeout(connect,3000);
|
|||
|
|
}
|
|||
|
|
function addMsg(text,who){
|
|||
|
|
const d=document.createElement('div');d.className='msg '+who;
|
|||
|
|
d.innerHTML=who==='ai'?text.replace(/\\n/g,'<br>'):escHtml(text);
|
|||
|
|
chatBox.appendChild(d);chatBox.scrollTop=chatBox.scrollHeight;
|
|||
|
|
}
|
|||
|
|
function showTyping(){
|
|||
|
|
if(document.getElementById('typing'))return;
|
|||
|
|
const d=document.createElement('div');d.id='typing';d.className='typing';d.textContent='卡若AI 正在思考...';
|
|||
|
|
chatBox.appendChild(d);chatBox.scrollTop=chatBox.scrollHeight;
|
|||
|
|
}
|
|||
|
|
function removeTyping(){const t=document.getElementById('typing');if(t)t.remove()}
|
|||
|
|
function escHtml(s){return s.replace(/&/g,'&').replace(/</g,'<').replace(/>/g,'>')}
|
|||
|
|
function sendMsg(){
|
|||
|
|
const m=input.value.trim();if(!m||!ws||ws.readyState!==1)return;
|
|||
|
|
addMsg(m,'user');ws.send(JSON.stringify({message:m}));input.value='';showTyping();
|
|||
|
|
}
|
|||
|
|
input.addEventListener('keydown',e=>{if(e.key==='Enter')sendMsg()});
|
|||
|
|
connect();
|
|||
|
|
</script>
|
|||
|
|
</body>
|
|||
|
|
</html>"""
|