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

- 删除 Dockerfile.dev 和 entrypoint.sh，简化开发环境配置 - 修改 Dockerfile 使用 node 基础镜像并添加代理服务器 - 新增 proxy-server.js 处理 API 请求代理 - 更新 nginx 配置指向本地代理服务 - 修改前端请求添加自定义 base URL 头支持
feat(docker): 重构Docker配置以支持生产环境部署
2026-01-22 16:40:16 +08:00 · 2026-01-22 16:28:55 +08:00
9 changed files with 178 additions and 40 deletions
--- a/.dockerignore
+++ b/.dockerignore
@@ -11,3 +11,4 @@ coverage
 .nyc_output
 .DS_Store
 Thumbs.db
+Dockerfile.dev
--- a/26
+++ b/26
@@ -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"]
--- a/docker-compose.yml
+++ b/docker-compose.yml
@@ -5,12 +5,7 @@ services:
    build:
      context: .
      dockerfile: Dockerfile
-    container_name: thinkflow-app
+    container_name: thinkflow
    ports:
-      - "5173:5173"
-    volumes:
-      - .:/app
-      - /app/node_modules
-    environment:
-      - NODE_ENV=development
+      - "80:80"
    restart: unless-stopped
--- a/nginx.conf
+++ b/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;
+}
--- a/package.json
+++ b/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",
--- a/proxy-server.js
+++ b/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}`);
+});
--- a/src/composables/useThinkFlow.ts
+++ b/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: {
-                    'Content-Type': 'application/json',
-                    Authorization: `Bearer ${finalApiKey}`
-                },
+                headers,
                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: {
-                    'Content-Type': 'application/json',
-                    Authorization: `Bearer ${finalApiKey}`
-                },
+                headers,
                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: {
-                    'Content-Type': 'application/json',
-                    Authorization: `Bearer ${finalApiKey}`
-                },
+                headers,
                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: {
-                    'Content-Type': 'application/json',
-                    Authorization: `Bearer ${finalApiKey}`
-                },
+                headers,
                body: JSON.stringify({
                    model: useConfig.model,
                    messages: [
--- a/start.sh
+++ b/start.sh
@@ -0,0 +1,5 @@
+#!/bin/sh
+
+node proxy-server.js &
+
+nginx -g 'daemon off;'
--- a/vite.config.ts
+++ b/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({
-  plugins: [vue()],
-  server: {
-    host: '0.0.0.0', // 允许通过 IP 访问
-    port: 5173,      // 你可以根据需要修改端口
-  },
-  resolve: {
-    alias: {
-      '@': path.resolve(__dirname, './src'),
+export default defineConfig(({ mode }) => {
+  const env = loadEnv(mode, process.cwd(), '')
+  
+  return {
+    plugins: [vue()],
+    server: {
+      host: '0.0.0.0',
+      port: 5173,
+      proxy: {
+        '/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'),
+      },
+    },
+  }
 })