refactor(部署): 重构部署架构，使用本地代理服务器替代环境变量配置

- 删除 Dockerfile.dev 和 entrypoint.sh，简化开发环境配置
- 修改 Dockerfile 使用 node 基础镜像并添加代理服务器
- 新增 proxy-server.js 处理 API 请求代理
- 更新 nginx 配置指向本地代理服务
- 修改前端请求添加自定义 base URL 头支持

.dockerignore

@@ -11,3 +11,4 @@ coverage
 .nyc_output
 .DS_Store
 Thumbs.db
+Dockerfile.dev

Dockerfile

@@ -1,4 +1,4 @@
-FROM node:20-alpine
+FROM node:20-alpine AS builder
 
 WORKDIR /app
 
@@ -8,6 +8,26 @@ RUN npm install
 
 COPY . .
 
-EXPOSE 5173
+RUN npm run build
 
-CMD ["npm", "run", "dev", "--", "--host"]
+FROM node:20-alpine
+
+WORKDIR /app
+
+COPY --from=builder /app/node_modules ./node_modules
+COPY --from=builder /app/dist ./dist
+COPY --from=builder /app/proxy-server.js ./
+
+RUN npm install express cors http-proxy-middleware
+
+RUN apk add --no-cache nginx
+
+COPY nginx.conf /etc/nginx/conf.d/default.conf
+
+COPY start.sh /start.sh
+
+RUN chmod +x /start.sh
+
+EXPOSE 80 3000
+
+CMD ["/start.sh"]

docker-compose.yml

@@ -5,12 +5,7 @@ services:
     build:
       context: .
       dockerfile: Dockerfile
-    container_name: thinkflow-app
+    container_name: thinkflow
     ports:
-      - "5173:5173"
+      - "80:80"
-    volumes:
-      - .:/app
-      - /app/node_modules
-    environment:
-      - NODE_ENV=development
     restart: unless-stopped

nginx.conf

@@ -0,0 +1,29 @@
+server {
+    listen 80;
+    server_name localhost;
+    root /app/dist;
+    index index.html;
+
+    location / {
+        try_files $uri $uri/ /index.html;
+    }
+
+    location /api/chat {
+        proxy_pass http://localhost:3000/api/chat;
+        proxy_set_header Host $host;
+        proxy_set_header X-Real-IP $remote_addr;
+        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
+        proxy_set_header X-Forwarded-Proto $scheme;
+    }
+
+    location /api/image {
+        proxy_pass http://localhost:3000/api/image;
+        proxy_set_header Host $host;
+        proxy_set_header X-Real-IP $remote_addr;
+        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
+        proxy_set_header X-Forwarded-Proto $scheme;
+    }
+
+    gzip on;
+    gzip_types text/plain text/css application/json application/javascript text/xml application/xml application/xml+rss text/javascript;
+}

package.json

@@ -15,7 +15,10 @@
     "@vue-flow/minimap": "^1.5.4",
     "@vue-flow/node-resizer": "^1.5.0",
     "axios": "^1.6.7",
+    "cors": "^2.8.5",
+    "express": "^4.18.2",
     "html-to-image": "^1.11.13",
+    "http-proxy-middleware": "^2.0.6",
     "lucide-vue-next": "^0.322.0",
     "markdown-it": "^14.1.0",
     "vue": "^3.4.15",

proxy-server.js

@@ -0,0 +1,45 @@
+const express = require('express');
+const { createProxyMiddleware } = require('http-proxy-middleware');
+const cors = require('cors');
+
+const app = express();
+const PORT = process.env.PROXY_PORT || 3000;
+
+app.use(cors());
+app.use(express.json());
+
+app.use('/api/chat', createProxyMiddleware({
+  target: 'https://thinkflow.lz-t.top',
+  changeOrigin: true,
+  pathRewrite: {
+    '^/api/chat': '/chat/completions'
+  },
+  onProxyReq: (proxyReq, req, res) => {
+    const customBaseUrl = req.headers['x-custom-base-url'];
+    if (customBaseUrl) {
+      const url = new URL(customBaseUrl);
+      proxyReq.path = url.pathname;
+      proxyReq.setHeader('Host', url.host);
+    }
+  }
+}));
+
+app.use('/api/image', createProxyMiddleware({
+  target: 'https://thinkflow.lz-t.top',
+  changeOrigin: true,
+  pathRewrite: {
+    '^/api/image': '/images/generations'
+  },
+  onProxyReq: (proxyReq, req, res) => {
+    const customBaseUrl = req.headers['x-custom-base-url'];
+    if (customBaseUrl) {
+      const url = new URL(customBaseUrl);
+      proxyReq.path = url.pathname;
+      proxyReq.setHeader('Host', url.host);
+    }
+  }
+}));
+
+app.listen(PORT, () => {
+  console.log(`Proxy server running on port ${PORT}`);
+});

src/composables/useThinkFlow.ts

@@ -49,12 +49,12 @@ export function useThinkFlow({ t, locale }: { t: Translate; locale: Ref<string>
      */
     const DEFAULT_CONFIG = {
         chat: {
-            baseUrl: 'https://thinkflow.lz-t.top/chat/completions',
+            baseUrl: '/api/chat',
             model: 'glm-4-flash',
             apiKey: ''
         },
         image: {
-            baseUrl: 'https://thinkflow.lz-t.top/images/generations',
+            baseUrl: '/api/image',
             model: 'cogview-3-flash',
             apiKey: ''
         }
@@ -761,12 +761,18 @@ export function useThinkFlow({ t, locale }: { t: Translate; locale: Ref<string>
         const finalApiKey = apiConfig.mode === 'default' ? useConfig.apiKey || API_KEY : useConfig.apiKey
 
         try {
+            const headers: any = {
+                'Content-Type': 'application/json',
+                Authorization: `Bearer ${finalApiKey}`
+            }
+            
+            if (apiConfig.mode !== 'default' && useConfig.baseUrl) {
+                headers['X-Custom-Base-Url'] = useConfig.baseUrl
+            }
+            
             const response = await fetch(useConfig.baseUrl, {
                 method: 'POST',
-                headers: {
+                headers,
-                    'Content-Type': 'application/json',
-                    Authorization: `Bearer ${finalApiKey}`
-                },
                 body: JSON.stringify({
                     model: useConfig.model,
                     messages: [
@@ -813,12 +819,19 @@ export function useThinkFlow({ t, locale }: { t: Translate; locale: Ref<string>
             const detail = node.data.description || ''
             const path = findPathToNode(nodeId)
             const context = path.length > 5 ? `... -> ${path.slice(-4).join(' -> ')}` : path.join(' -> ')
+            
+            const headers: any = {
+                'Content-Type': 'application/json',
+                Authorization: `Bearer ${finalApiKey}`
+            }
+            
+            if (apiConfig.mode !== 'default' && useConfig.baseUrl) {
+                headers['X-Custom-Base-Url'] = useConfig.baseUrl
+            }
+            
             const response = await fetch(useConfig.baseUrl, {
                 method: 'POST',
-                headers: {
+                headers,
-                    'Content-Type': 'application/json',
-                    Authorization: `Bearer ${finalApiKey}`
-                },
                 body: JSON.stringify({
                     model: useConfig.model,
                     prompt: t('prompts.image', { topic, detail, context })
@@ -869,12 +882,18 @@ export function useThinkFlow({ t, locale }: { t: Translate; locale: Ref<string>
             const path = findPathToNode(nodeId)
             const context = path.join(' -> ')
 
+            const headers: any = {
+                'Content-Type': 'application/json',
+                Authorization: `Bearer ${finalApiKey}`
+            }
+            
+            if (apiConfig.mode !== 'default' && useConfig.baseUrl) {
+                headers['X-Custom-Base-Url'] = useConfig.baseUrl
+            }
+            
             const response = await fetch(useConfig.baseUrl, {
                 method: 'POST',
-                headers: {
+                headers,
-                    'Content-Type': 'application/json',
-                    Authorization: `Bearer ${finalApiKey}`
-                },
                 body: JSON.stringify({
                     model: useConfig.model,
                     messages: [{ role: 'user', content: t('prompts.deepDivePrompt', { rootTopic, context, topic, detail }) }]
@@ -1031,12 +1050,18 @@ export function useThinkFlow({ t, locale }: { t: Translate; locale: Ref<string>
         const finalApiKey = apiConfig.mode === 'default' ? useConfig.apiKey || API_KEY : useConfig.apiKey
 
         try {
+            const headers: any = {
+                'Content-Type': 'application/json',
+                Authorization: `Bearer ${finalApiKey}`
+            }
+            
+            if (apiConfig.mode !== 'default' && useConfig.baseUrl) {
+                headers['X-Custom-Base-Url'] = useConfig.baseUrl
+            }
+            
             const response = await fetch(useConfig.baseUrl, {
                 method: 'POST',
-                headers: {
+                headers,
-                    'Content-Type': 'application/json',
-                    Authorization: `Bearer ${finalApiKey}`
-                },
                 body: JSON.stringify({
                     model: useConfig.model,
                     messages: [

start.sh

@@ -0,0 +1,5 @@
+#!/bin/sh
+
+node proxy-server.js &
+
+nginx -g 'daemon off;'

vite.config.ts

@@ -1,17 +1,32 @@
-import { defineConfig } from 'vite'
+import { defineConfig, loadEnv } from 'vite'
 import vue from '@vitejs/plugin-vue'
 import path from 'path'
 
-// https://vitejs.dev/config/
+export default defineConfig(({ mode }) => {
-export default defineConfig({
+  const env = loadEnv(mode, process.cwd(), '')
-  plugins: [vue()],
+  
-  server: {
+  return {
-    host: '0.0.0.0', // 允许通过 IP 访问
+    plugins: [vue()],
-    port: 5173,      // 你可以根据需要修改端口
+    server: {
-  },
+      host: '0.0.0.0',
-  resolve: {
+      port: 5173,
-    alias: {
+      proxy: {
-      '@': path.resolve(__dirname, './src'),
+        '/api/chat': {
+          target: env.VITE_API_BASE_URL || 'https://thinkflow.lz-t.top',
+          changeOrigin: true,
+          rewrite: (path) => path.replace(/^\/api\/chat/, '/chat/completions')
+        },
+        '/api/image': {
+          target: env.VITE_API_BASE_URL || 'https://thinkflow.lz-t.top',
+          changeOrigin: true,
+          rewrite: (path) => path.replace(/^\/api\/image/, '/images/generations')
+        }
+      }
     },
-  },
+    resolve: {
+      alias: {
+        '@': path.resolve(__dirname, './src'),
+      },
+    },
+  }
 })