feat: sample.png

.gitignore

@@ -4,3 +4,6 @@
 /frontend/package-lock.json
 /frontend/dist
 plan.md
+info.md
+# docker-compose.self.yml
+compose.self.env

LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2025 shenjianZ
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

README.md

@@ -1,123 +1,95 @@
-# 轻量级临时邮件项目 (Email Unlimit)
+# Email Unlimit - 轻量级、可自托管的临时邮件解决方案
 
 本项目是一个轻量级的、可自托管的临时邮件解决方案。它允许您使用自己的域名接收邮件，并通过一个简洁的网页界面来查看这些邮件。
 
 与 `Mailu` 等复杂的邮件套件不同，本项目采用了一个极简的 Node.js 服务来直接接收和处理邮件，部署和维护都非常简单。
 
+**在线体验:** <a href="https://mail.shenjianl.cn" target="_blank">https://mail.shenjianl.cn</a>
+
+**网站截图**：
+![sample.png](./sample.png)
+
 ## 技术架构
 
 *   **前端 (Frontend)**: 使用 Vue.js 构建的单页面应用，负责展示收到的邮件列表。
 *   **后端 (Backend)**:
     *   使用 Node.js 和 Express 搭建的 API 服务器。
     *   内置一个轻量级的 SMTP 服务器 (`smtp-server`)，用于直接接收邮件，无需外部邮件服务。
-    *   负责将收到的邮件解析并存入数据库。
-*   **数据库 (Database)**: 需要一个外部的 MySQL 数据库来存储邮件信息。
-*   **部署 (Deployment)**: 后端服务通过 Docker Compose 进行容器化部署，前端静态文件由宿主机的 Nginx 提供服务。
+    *   通过 WebSocket 实现新邮件的实时推送。
+*   **数据库 (Database)**: 使用 MySQL 存储邮件信息，确保数据的安全性和持久性。
+*   **部署 (Deployment)**: 使用 Docker Compose 统一管理后端服务、数据库和 Nginx，实现一键部署。
 
-## 部署要求
+## 前置条件
 
-在开始之前，<EFBFBD><EFBFBD>确保您已准备好以下环境：
+在开始之前，请确保您已满足以下条件：
 
-1.  一台拥有公网 IP 的 Linux 服务器。
-2.  一个您自己的域名。
-3.  服务器上已安装 `Docker` 和 `Docker Compose`。
-4.  服务器上已安装 `Nginx`。
-5.  一个可用的外部 MySQL 数据库，并已创建好数据库。
-6.  本地开发环境已安装 `Node.js` 和 `npm` (用于构建前端)。
+### 1. 硬件与域名
+- 一台拥有公网 IP 的云服务器。
+- 一个您自己的域名（建议已完成备案）。
 
-## 部署步骤
+### 2. 软件环境
+- 服务器上已安装 [Docker 和 Docker Compose](https://docs.docker.com/get-docker/)。
+- 本地开发环境已安装 [Node.js](https://nodejs.org/) (仅用于构建前端)。
 
-### 步骤 1: 配置域名 DNS
+### 3. 域名 DNS 配置
+要让邮件能正确发送到您的服务器，您必须配置域名的 `A` 记录和 `MX` 记录。假设您的域名是 `example.com`，您希望用于收信的子域名是 `mail.example.com`。
 
-要让邮件能正确发送到您的服务器，您必须配置域名的 `MX` 记录。
-
-1.  登录您的域名注册商（如 GoDaddy, Cloudflare 等）。
-2.  找到 DNS 解析设置。
-3.  添加一条 `MX` 记录：
-    *   **类型 (Type)**: `MX`
-    *   **名称 (Name/Host)**: `@` (代表您的根域名)
-    *   **值 (Value/Points to)**: `您的服务器公网 IP 地址`
-    *   **优先级 (Priority)**: `10`
+| 类型 | 主机记录/名称 | 记录值/指向 | 备注 |
+| :--- | :--- | :--- | :--- |
+| A | mail | `您的服务器公网 IP` | 将 `mail` 子域名指向您的服务器 |
+| MX | @ | `mail.example.com` | 优先级设置为 10 |
 
 > **注意**: DNS 记录生效可能需要几分钟到几小时。
 
-### 步骤 2: 部署后端服务
+### 4. 申请 SSL/TLS 证书
+为了启用 HTTPS，您需要为您的域名 `mail.example.com` 申请 SSL 证书。您可以从 Let's Encrypt、阿里云、腾讯云等证书颁发机构免费获取。
 
-1.  将本项目克隆或上传到您的服务器。
-2.  进入项目根目录，编辑 `docker-compose.yml` 文件。
-3.  **填写您的外部数据库连接信息**：
-    ```yaml
-    services:
-      backend:
-        # ...
-        environment:
-          - DB_HOST=your_external_db_host     # 替换为您的外部数据库主机名或IP
-          - DB_USER=your_external_db_user     # 替换为您的数据库用户名
-          - DB_PASSWORD=your_external_db_password # 替换为您的数据库密码
-          - DB_NAME=your_external_db_name       # 替换为您的数据库名称
+## 部署步骤
+
+本部署方案使用 Docker Compose 统一管理所有服务（Nginx, Backend, MySQL），实现一键启动，无需在宿主机上安装 Nginx 或其他依赖。
+
+### 步骤 1: 获取并准备项目
+将项目代码下载并解压到您的服务器，例如 `/data/email-unlimit` 目录。
+
+### 步骤 2: 上传 SSL 证书
+将您申请到的 SSL 证书文件（通常是 `.pem`/.`crt` 和 `.key` 文件）上传到项目的 `certs` 目录下 (`/data/email-unlimit/certs`)。
+
+### 步骤 3: 构建前端静态文件 (本地环境)
+1.  在您的**本地开发机**上，进入 `frontend` 目录，修改 `.env` 环境变量文件：
+    ```env
+    VITE_APP_DOMAIN=example.com # 改为你的主域名
     ```
-4.  在 `backend` 目录下有一个 `init.sql` 文件，请手动将其中的 SQL 命令在您的外部数据库中执行，以创建所需的表。
-5.  在项目根目录，使用 Docker Compose 启动后端服务：
-    ```bash
-    docker-compose up -d --build
-    ```
-    此命令会构建并以后台模式启动后端容器。服务将监听服务器的 `5182` (API) 和 `25` (SMTP) 端口。
-
-### 步骤 3: 构建和部署前端
-
-1.  **在您的本地开发机上**，进入 `frontend` 目录。
-2.  安装依赖并构建静态文件：
+2.  安装依赖并构建：
     ```bash
+    cd frontend
     npm install
     npm run build
     ```
-    这将在 `frontend/dist` 目录下生成所有用于部署的静态文件。
-3.  将 `frontend/dist` 目录下的 **所有文件** 上传到您服务器的指定位置，例如 `/var/www/email-unlimit`。
+3.  将构建生成的 `dist` 目录（位于 `frontend/dist`）**完整上传**到服务器的 `/data/email-unlimit/frontend` 目录下。
 
-### 步骤 4: 配置宿主机 Nginx
+### 步骤 4: 修改 Nginx 配置 (服务器)
+编辑项目根目录下的 `nginx.full.conf` 文件，仅需修改以下三项：
+```nginx
+server_name mail.example.com;  # 改为您自己的域名
+ssl_certificate  /etc/nginx/certs/your_certificate.pem; # 改为您自己的证书文件名
+ssl_certificate_key /etc/nginx/certs/your_certificate.key; # 改为您自己的密钥文件名
+```
+> **注意**: 配置文件中的证书路径 `/etc/nginx/certs/` 是容器内的路径，它会映射到宿主机的 `/data/email-unlimit/certs` 目录，请确保文件名正确。
 
-1.  在服务器上，为您的应用创建一个 Nginx 配置文件，例如 `/etc/nginx/sites-available/email.conf`。
-2.  将以下配置写入该文件。请务必将 `your_domain.com` 和 `root` 路径修改为您自己的配置。
-
-    ```nginx
-    server {
-        listen 443 ssl;
-        server_name mail.shenjianl.cn; # 替换为您的域名
-        ssl_certificate /usr/local/nginx/conf/ssl_certificate/mail/mail.shenjianl.cn_bundle.pem;
-        ssl_certificate_key /usr/local/nginx/conf/ssl_certificate/mail/mail.shenjianl.cn.key;
-        # 前端静态文件路径
-        root /data/email-unlimit/frontend/dist;
-        index index.html;
-
-        # 处理 Vue Router 的 history 模式
-        location / {
-            try_files $uri $uri/ /index.html;
-        }
-
-        # 将 /api 请求反向代理到后端 Docker 容器
-        location /api {
-            proxy_pass http://localhost:5182;
-            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;
-        }
-    }
-    ```
-3.  启用该配置并重启 Nginx：
-    ```bash
-    # 创建软链接
-    sudo ln -s /etc/nginx/sites-available/email.conf /etc/nginx/sites-enabled/
-    
-    # 测试配置语法
-    sudo nginx -t
-    
-    # 重启 Nginx
-    sudo systemctl restart nginx
-    ```
+### 步骤 5: 启动服务 (服务器)
+在服务器的项目根目录 (`/data/email-unlimit`) 下执行以下命令：
+```bash
+# -f 指定使用 docker-compose.full.yml 配置文件，-d 表示后台运行
+docker compose -f docker-compose.full.yml up -d
+```
+服务启动后，您可以通过 `docker compose -f docker-compose.full.yml logs -f` 查看实时日志。
 
 ## 如何使用
 
-1.  **访问您的网站**: 在浏览器中打开 `http://your_domain.com`。
-2.  **发送测试邮件**: 使用任何邮箱客户端，向 `anything@your_domain.com` (例如 `test@your_domain.com`) 发送一封邮件。
-3.  **查看邮件**: 在网站上输入您刚刚使用的收件人地址 (`anything@your_domain.com`)，点击查询，即可看到收到的邮件。
+1.  **访问您的网站**: 在浏览器中打开 `https://mail.example.com` (替换为您的域名)。
+2.  **发送测试邮件**: 使用任何邮箱客户端，向 `anything@example.com` (例如 `test@example.com`) 发送一封邮件。
+3.  **查看邮件**: 在网站首页的输入框中输入您刚刚使用的收件人地址 (`test@example.com`)，点击查询，即可看到收到的邮件。
+
+## 许可证
+
+本项目采用 MIT 许可证。详情请参阅 [LICENSE](LICENSE) 文件。

backend/Dockerfile

@@ -1,5 +1,10 @@
 FROM node:20-alpine
 
+# Set timezone to Asia/Shanghai FIRST
+# This ensures that any native modules compiled during npm install are linked correctly.
+RUN apk add --no-cache tzdata
+ENV TZ=Asia/Shanghai
+
 WORKDIR /usr/src/app
 
 COPY package*.json ./

backend/app.js

@@ -29,7 +29,7 @@ app.get('/api/messages', async (req, res) => {
 
   try {
     const [rows] = await db.execute(
-      'SELECT id, sender, recipient, subject, body, received_at FROM emails WHERE recipient LIKE ? ORDER BY received_at DESC',
+      'SELECT id, sender, recipient, subject, body, CAST(received_at AS CHAR) as received_at FROM emails WHERE recipient LIKE ? ORDER BY received_at DESC',
       [`%${recipient}%`]
     );
     res.json(rows);
@@ -100,7 +100,7 @@ app.delete('/api/messages', async (req, res) => {
     return res.status(400).send('Recipient is required');
   }
   try {
-    await db.execute('DELETE FROM emails WHERE recipient = ?', [recipient]);
+    await db.execute('DELETE FROM emails WHERE recipient LIKE ?', [`%${recipient}%`]);
     logger.info('All messages for recipient deleted successfully', { recipient });
     res.status(204).send(); // No Content
   } catch (error) {
@@ -142,14 +142,19 @@ wss.on('connection', (ws, req) => {
 });
 
 emitter.on('newEmail', (email) => {
-  const recipient = email.recipient;
-  if (clients.has(recipient)) {
-    const ws = clients.get(recipient);
-    logger.info(`Sending new email notification to`, { recipient });
-    ws.send(JSON.stringify(email));
+  const dbRecipient = email.recipient;  // 比如 "6471" <6471@shenjianl.cn>
+
+  // 遍历所有 clients，用 includes 判断
+  for (const [clientRecipient, ws] of clients.entries()) {
+    if (dbRecipient.includes(clientRecipient)) {
+      logger.info(`Sending new email notification to`, { recipient: clientRecipient });
+      ws.send(JSON.stringify(email));
+      break;  // 如果只想发给第一个匹配的就 break
+    }
   }
 });
 
+
 // Start API server
 server.listen(apiPort, () => {
   logger.info(`Backend API and WebSocket server listening at http://localhost:${apiPort}`);

backend/init.sql

@@ -4,7 +4,7 @@ CREATE TABLE IF NOT EXISTS emails (
     sender VARCHAR(255) NOT NULL,
     subject VARCHAR(512),
     body TEXT,
-    received_at DATETIME DEFAULT CURRENT_TIMESTAMP,
+    received_at DATETIME,
     raw MEDIUMBLOB
 );
 

backend/logger.js

@@ -4,7 +4,8 @@ const logger = winston.createLogger({
   level: 'info',
   format: winston.format.combine(
     winston.format.timestamp({
-      format: 'YYYY-MM-DD HH:mm:ss'
+      format: 'YYYY-MM-DD HH:mm:ss',
+      tz: 'Asia/Shanghai'
     }),
     winston.format.errors({ stack: true }),
     winston.format.splat(),
@@ -17,11 +18,23 @@ const logger = winston.createLogger({
   ]
 });
 
+// 在非生产环境下，添加一个带有着色的控制台输出
 if (process.env.NODE_ENV !== 'production') {
   logger.add(new winston.transports.Console({
     format: winston.format.combine(
       winston.format.colorize(),
-      winston.format.simple()
+      // 确保控制台日志也有正确格式和时区的时间戳
+      winston.format.timestamp({
+        format: 'YYYY-MM-DD HH:mm:ss',
+        tz: 'Asia/Shanghai'
+      }),
+      winston.format.printf(({ level, message, timestamp, stack }) => {
+        if (stack) {
+          // 打印错误堆栈
+          return `${timestamp} ${level}: ${message}\n${stack}`;
+        }
+        return `${timestamp} ${level}: ${message}`;
+      })
     )
   }));
 }

backend/saveEmail.js

@@ -1,6 +1,7 @@
 const { simpleParser } = require('mailparser');
 const db = require('./db');
 const emitter = require('./eventEmitter');
+const logger = require('./logger');
 
 // Helper function to convert stream to buffer
 function streamToBuffer(stream) {
@@ -19,20 +20,25 @@ async function saveEmail(stream) {
         
         // Now, parse the buffered email content
         const parsed = await simpleParser(emailBuffer);
-        const rawEmail = emailBuffer.toString();
+        // const rawEmail = emailBuffer.toString(); // We are not saving the raw email content for now.
 
         const recipient = parsed.to ? parsed.to.text : 'undisclosed-recipients';
         const sender = parsed.from ? parsed.from.text : 'unknown-sender';
-        const subject = parsed.subject;
+        const subject = parsed.subject || 'No Subject';
         const body = parsed.text || (parsed.html || '');
 
+        // Manually create a timestamp for 'Asia/Shanghai' timezone
+        const received_at = new Date().toLocaleString('sv-SE', {
+            timeZone: 'Asia/Shanghai'
+        });
+
         const [result] = await db.execute(
-            'INSERT INTO emails (recipient, sender, subject, body, raw) VALUES (?, ?, ?, ?, ?)',
-            [recipient, sender, subject, body, rawEmail]
+            'INSERT INTO emails (recipient, sender, subject, body, received_at) VALUES (?, ?, ?, ?, ?)',
+            [recipient, sender, subject, body, received_at]
         );
         const newEmailId = result.insertId;
 
-        console.log(`Email from <${sender}> to <${recipient}> saved with ID: ${newEmailId}`);
+        logger.info(`Email from <${sender}> to <${recipient}> saved with ID: ${newEmailId}`);
 
         if (parsed.attachments && parsed.attachments.length > 0) {
             for (const attachment of parsed.attachments) {
@@ -40,7 +46,7 @@ async function saveEmail(stream) {
                     'INSERT INTO email_attachments (email_id, filename, content_type, content) VALUES (?, ?, ?, ?)',
                     [newEmailId, attachment.filename, attachment.contentType, attachment.content]
                 );
-                console.log(`Attachment ${attachment.filename} saved.`);
+                logger.info(`Attachment ${attachment.filename} saved for email ID: ${newEmailId}`);
             }
         }
 
@@ -48,15 +54,17 @@ async function saveEmail(stream) {
         const [rows] = await db.execute('SELECT id, sender, recipient, subject, body, received_at FROM emails WHERE id = ?', [newEmailId]);
         if (rows.length > 0) {
             emitter.emit('newEmail', rows[0]);
+            logger.info(`Event 'newEmail' emitted for email ID: ${newEmailId}`);
         }
 
     } catch (error) {
-        console.error('Failed to save email:', error);
-        // We should not exit the process here, but maybe throw the error
-        // so the caller (SMTPServer) can handle it.
+        logger.error('Failed to save email:', {
+            errorMessage: error.message,
+            errorStack: error.stack
+        });
+        // Re-throw the error so the caller (SMTPServer) can handle it.
         throw error;
     }
 }
 
 module.exports = { saveEmail };
-

certs/README.md

@@ -0,0 +1 @@
+SSL证书可以放置在这里

compose.env

@@ -0,0 +1,9 @@
+# MySQL/MariaDB Settings
+MYSQL_ROOT_PASSWORD=123456
+MYSQL_DATABASE=maildb
+
+# Backend Database Settings
+DB_HOST=email-mysql
+DB_USER=root
+DB_PASSWORD=${MYSQL_ROOT_PASSWORD}
+DB_NAME=${MYSQL_DATABASE}

compose.full.env

@@ -1,12 +1,9 @@
 # MySQL/MariaDB Settings
-MYSQL_ROOT_PASSWORD=your_strong_root_password
+MYSQL_ROOT_PASSWORD=123456
 MYSQL_DATABASE=maildb
-MYSQL_USER=root
-MYSQL_PASSWORD=root_password
 
 # Backend Database Settings
-# These should match the MySQL/MariaDB settings above
-DB_HOST=mysql
-DB_USER=${MYSQL_USER}
-DB_PASSWORD=${MYSQL_PASSWORD}
+DB_HOST=email-mysql
+DB_USER=root
+DB_PASSWORD=${MYSQL_ROOT_PASSWORD}
 DB_NAME=${MYSQL_DATABASE}

docker-compose.build.yml

@@ -0,0 +1,35 @@
+services:
+  # 1. 后端服务 (Node.js + Express + SMTP Server)
+  backend:
+    build: ./backend
+    container_name: email-backend
+    restart: always
+    env_file:
+      - compose.env
+    networks:
+      - email-network
+    ports:
+      - "5182:5182" # API port
+      - "25:25"     # SMTP port
+
+  # 2. 数据库服务 (MySQL)
+  mysql:
+    image: mysql:8.0 
+    container_name: email-mysql
+    restart: always
+    environment:
+      - TZ=Asia/Shanghai
+    env_file:
+      - compose.env
+    volumes:
+      - mysql-data:/var/lib/mysql
+      - ./backend/init.sql:/docker-entrypoint-initdb.d/init.sql:ro
+    networks:
+      - email-network
+
+networks:
+  email-network:
+    driver: bridge
+
+volumes:
+  mysql-data: {}

docker-compose.full.yml

@@ -1,48 +1,47 @@
-version: '3.3'
-
 services:
   # 1. 后端服务 (Node.js + Express + SMTP Server)
   backend:
-    build: ./backend
+    image: registry.cn-hangzhou.aliyuncs.com/pull-image/email-unlimit-backend:latest
     container_name: email-backend
     restart: always
     env_file:
       - compose.full.env
     networks:
       - email-network
-    # 不直接暴露端口给外部，由 Nginx 统一代理
-    # ports:
+    ports:
     #   - "5182:5182"
-    #   - "25:25"
+    - "25:25"
 
   # 2. 数据库服务 (MySQL)
   mysql:
-    image: mysql:8.0
+    image: registry.cn-hangzhou.aliyuncs.com/pull-image/mysql:8.0
     container_name: email-mysql
     restart: always
+    environment:
+      - TZ=Asia/Shanghai
     env_file:
       - compose.full.env
     volumes:
       - mysql-data:/var/lib/mysql
+      - ./backend/init.sql:/docker-entrypoint-initdb.d/init.sql:ro
     networks:
       - email-network
 
   # 3. Nginx 反向代理
   nginx:
-    image: nginx:latest
+    image: registry.cn-hangzhou.aliyuncs.com/pull-image/nginx:1.21.6
     container_name: email-nginx
     restart: always
     ports:
-      - "7614:80"       # HTTP
+      - "80:80"       # HTTP
       - "443:443"     # HTTPS (需要SSL证书)
-      - "25:25"       # SMTP 端口，转发给后端
     volumes:
       # 挂载前端构建好的静态文件
       - ./frontend/dist:/usr/share/nginx/html
       # 挂载 Nginx 配置文件
       - ./nginx.full.conf:/etc/nginx/nginx.conf:ro
-      # (可选) 挂载 SSL 证书
-      # - ./certs:/etc/nginx/certs:ro
+      # 挂载 SSL 证书
+      - ./certs:/etc/nginx/certs:ro
     depends_on:
       - backend
       - mysql

docker-compose.self.yml

@@ -0,0 +1,16 @@
+services:
+  backend:
+    build: ./backend
+    container_name: email-backend
+    restart: always
+    ports:
+      - "5182:5182" # API port
+      - "25:25"     # SMTP port
+    # mysql 使用外部数据源
+    env_file:
+      - compose.self.env
+    networks:
+      - email-network
+networks:
+  email-network:
+    driver: bridge

docker-compose.yml

@@ -1,19 +1,35 @@
 services:
+  # 1. 后端服务 (Node.js + Express + SMTP Server)
   backend:
-    build: ./backend
-    container_name: email-backend-container
+    image: registry.cn-hangzhou.aliyuncs.com/pull-image/email-unlimit-backend:latest
+    container_name: email-backend
     restart: always
+    environment:
+      - TZ=Asia/Shanghai
     ports:
       - "5182:5182" # API port
       - "25:25"     # SMTP port
-    environment:
-      - DB_HOST=43.143.145.172     # 替换为您的外部数据库主机名或IP
-      - DB_USER=root     # 替换为您的数据库用户名
-      - DB_PASSWORD=kyff145972 # 替换为您的数据库密码
-      - DB_NAME=maildb       # 替换为您的数据库名称
+    env_file:
+      - compose.env
+    networks:
+      - email-network
+
+  # 2. 数据库服务 (MySQL)
+  mysql:
+    image: registry.cn-hangzhou.aliyuncs.com/pull-image/mysql:8.0  # mysql:8.0
+    container_name: email-mysql
+    restart: always
+    env_file:
+      - compose.env
+    volumes:
+      - mysql-data:/var/lib/mysql
+      - ./backend/init.sql:/docker-entrypoint-initdb.d/init.sql:ro
     networks:
       - email-network
 
 networks:
   email-network:
     driver: bridge
+
+volumes:
+  mysql-data: {}

frontend/.env

@@ -0,0 +1,3 @@
+VITE_APP_DOMAIN=shenjianl.cn
+VITE_REPO_NAME=Gitea
+VITE_REPO_URL=https://gitea.shenjianl.cn/shenjianZ/email-unlimit

frontend/src/components/AppHeader.vue

@@ -1,10 +1,15 @@
+<script setup>
+const repoUrl = import.meta.env.VITE_REPO_URL;
+const repoName = import.meta.env.VITE_REPO_NAME;
+</script>
+
 <template>
   <header class="app-header">
     <router-link to="/" class="logo-link">
       <div class="logo">Email Unlimit</div>
     </router-link>
     <nav class="nav-links">
-      <a href="https://gitea.shenjianl.cn/shenjianZ/email-unlimit" target="_blank">Gitee</a>
+      <a :href="repoUrl" target="_blank">{{ repoName }}</a>
       <router-link to="/settings" class="settings-link" title="设置">
         <img src="@/assets/setting.svg" alt="Settings" class="settings-icon" />
       </router-link>

frontend/src/i18n/index.js

@@ -24,6 +24,7 @@ const messages = {
       selectMail: '请从选择一封邮件查看',
       from: '发件人',
       to: '收件人',
+      received_at: '收件时间',
       attachments: '附件',
       delete: '删除',
       clearInbox: '清空收件箱',
@@ -34,8 +35,13 @@ const messages = {
         deleteFailed: '删除邮件失败。',
         confirmClearAll: '确定要清空这个收件箱的所有邮件吗？此操作不可恢复。',
         clearFailed: '清空收件箱失败。',
+        generateRandomSuccess: '已生成随机邮箱地址',
+        checkInboxStart: '正在查询收件箱',
         copyFailed: '复制失败!',
+        copySuccess: '复制成功！',        // <-- 这里添加
         actionCancelled: '操作已取消',
+        deleteSuccess: '删除成功！',
+        clearSuccess: '收件箱已清空！',
       },
       newMailNotification: '收到新邮件！',
     }
@@ -63,6 +69,7 @@ const messages = {
       selectMail: 'Please select an email to view',
       from: 'From',
       to: 'To',
+      received_at: 'Received At',
       attachments: 'Attachments',
       delete: 'Delete',
       clearInbox: 'Clear Inbox',
@@ -73,8 +80,13 @@ const messages = {
         deleteFailed: 'Failed to delete email.',
         confirmClearAll: 'Are you sure you want to clear all emails in this inbox? This action cannot be undone.',
         clearFailed: 'Failed to clear inbox.',
+        generateRandomSuccess: 'Random email address generated',
+        checkInboxStart: 'Checking inbox',
         copyFailed: 'Copy failed!',
+        copySuccess: 'Copied successfully!',  // <-- 这里添加
         actionCancelled: 'Action cancelled',
+        deleteSuccess: 'Deleted successfully!',
+        clearSuccess: 'Inbox cleared!',
       },
       newMailNotification: 'New mail received!',
     }

frontend/src/views/Home.vue

@@ -2,7 +2,7 @@
   <main id="app-main">
     <section class="hero-section">
       <h1>{{ $t('home.title') }}</h1>
-      <p>{{ $t('home.subtitle') }}<code>@shenjianl.cn</code>{{ $t('home.subtitleAfter') }}</p>
+      <p>{{ $t('home.subtitle') }}<code>@{{ domain }}</code>{{ $t('home.subtitleAfter') }}</p>
       <form @submit.prevent="fetchMessages" class="input-group">
         <div class="input-wrapper">
           <input
@@ -64,6 +64,7 @@
                 <h3>{{ selectedMessage.subject }}</h3>
                 <p class="from-line"><strong>{{ $t('home.from') }}:</strong> {{ selectedMessage.sender }}</p>
                 <p><strong>{{ $t('home.to') }}:</strong> {{ selectedMessage.recipient }}</p>
+                <p><strong>{{ $t('home.received_at') }}:</strong> {{ selectedMessage.received_at }}</p>
               </div>
               <div class="header-actions">
                 <button @click="deleteMessage(selectedMessage.id)" :title="$t('home.delete')">
@@ -100,23 +101,24 @@ const { t } = useI18n();
 const recipient = ref('');
 const messages = ref([]);
 const selectedMessage = ref(null);
+const domain = import.meta.env.VITE_APP_DOMAIN;
 
 if (import.meta.env.DEV) {
   selectedMessage.value = {
     id: 'sample-1',
     sender: 'demo@example.com',
-    recipient: 'you@shenjianl.cn',
+    recipient: `you@${domain}`,
     subject: 'Markdown 样式测试邮件',
     body: `# 会议议程：项目启动会\n\n大家好，\n\n这是关于 **“Email-Unlimit”** 项目启动会的议程安排。\n\n---\n\n## 会议详情\n\n- **日期**: 2025年7月30日\n- **时间**: 上午10:00\n- **地点**: 线上会议室 (链接稍后提供)\n\n## 议程\n\n1.  **项目介绍** - 介绍项目目标和范围。\n2.  **团队分工** - 明确各自的职责。\n3.  **技术选型** - 讨论并确认技术栈。\n4.  **Q&A** - 自由提问环节。\n\n请准时参加。\n\n谢谢！\n\n> 这是一条重要的提醒：请提前准备好您的问题。`
   };
 }
 const loading = ref(false);
 const copyStatus = ref('idle'); // 'idle' | 'copied'
-const domain = 'shenjianl.cn';
 const attachments = ref([]);
 const attachmentsLoading = ref(false);
 const newMailNotification = ref(false);
 
+
 const renderedBody = computed(() => {
   if (selectedMessage.value && selectedMessage.value.body) {
     return marked(selectedMessage.value.body);
@@ -168,6 +170,7 @@ const fetchMessages = async () => {
     ElMessage.warning(t('home.alerts.enterEmail'));
     return;
   }
+  ElMessage.info(t('home.alerts.checkInboxStart'));
   loading.value = true;
   selectedMessage.value = null;
   attachments.value = [];
@@ -326,60 +329,39 @@ const generateRandomEmail = () => {
   } else {
     prefix = `${word1}${separator}${word2}${number}`;
   }
-  
+  ElMessage.success(t('home.alerts.generateRandomSuccess'));
   recipient.value = `${prefix}@${domain}`;
 };
 
-const copyEmail = () => {
+const copyEmail = async () => {
   if (!recipient.value) return;
 
-  const textToCopy = recipient.value;
-
-  if (navigator.clipboard && window.isSecureContext) {
-    navigator.clipboard.writeText(textToCopy).then(() => {
-      showCopySuccess();
-    }).catch(err => {
-      console.error('Modern copy failed: ', err);
-      fallbackCopy(textToCopy);
-    });
-  } else {
-    fallbackCopy(textToCopy);
-  }
-};
-
-const fallbackCopy = (text) => {
-  const textArea = document.createElement('textarea');
-  textArea.value = text;
-  
-  textArea.style.position = 'fixed';
-  textArea.style.top = '-9999px';
-  textArea.style.left = '-9999px';
-
-  document.body.appendChild(textArea);
-  textArea.focus();
-  textArea.select();
-
   try {
-    const successful = document.execCommand('copy');
-    if (successful) {
-      showCopySuccess();
+    if (navigator.clipboard && window.isSecureContext) {
+      await navigator.clipboard.writeText(recipient.value);
     } else {
-      throw new Error('Fallback copy was unsuccessful');
+      // fallback 方案
+      const textArea = document.createElement('textarea');
+      textArea.value = recipient.value;
+      textArea.style.position = 'fixed'; // 防止滚动时跳动
+      textArea.style.left = '-9999px';
+      textArea.style.top = '-9999px';
+      document.body.appendChild(textArea);
+      textArea.focus();
+      textArea.select();
+      const success = document.execCommand('copy');
+      document.body.removeChild(textArea);
+      if (!success) throw new Error('Fallback copy failed');
     }
+    copyStatus.value = 'copied';
+    ElMessage.success(t('home.alerts.copySuccess'));
+    setTimeout(() => copyStatus.value = 'idle', 2000);
   } catch (err) {
-    console.error('Fallback copy failed: ', err);
+    console.error('Copy failed:', err);
     ElMessage.error(t('home.alerts.copyFailed'));
   }
-
-  document.body.removeChild(textArea);
 };
 
-const showCopySuccess = () => {
-  copyStatus.value = 'copied';
-  setTimeout(() => {
-    copyStatus.value = 'idle';
-  }, 2000);
-};
 </script>
 
 <style scoped>

frontend/src/views/Settings.vue

@@ -1,3 +1,17 @@
+<script setup>
+import { useLanguageStore } from '@/stores/language';
+import { computed } from 'vue';
+
+const domain = import.meta.env.VITE_APP_DOMAIN;
+const languageStore = useLanguageStore();
+
+const setLanguage = (lang) => {
+  languageStore.setLocale(lang);
+};
+
+const currentLocale = computed(() => languageStore.locale);
+</script>
+
 <template>
   <div class="settings-page">
     <div class="settings-container">
@@ -5,7 +19,7 @@
       <ol>
         <i18n-t keypath="howItWorks.step1" tag="li">
           <template #domain>
-            <code>@{{ 'shenjianl.cn' }}</code>
+            <code>@{{ domain }}</code>
           </template>
         </i18n-t>
         <li>{{ $t('howItWorks.step2') }}</li>
@@ -22,25 +36,8 @@
 </template>
 
 <script>
-import { useLanguageStore } from '@/stores/language';
-import { computed } from 'vue';
-
 export default {
   name: 'Settings',
-  setup() {
-    const languageStore = useLanguageStore();
-
-    const setLanguage = (lang) => {
-      languageStore.setLocale(lang);
-    };
-
-    const currentLocale = computed(() => languageStore.locale);
-
-    return {
-      setLanguage,
-      currentLocale,
-    };
-  },
 };
 </script>
 

nginx.full.conf

@@ -1,30 +1,69 @@
-events {}
+worker_processes  1;
+
+events {
+    worker_connections  1024;
+}
 
 http {
-    server {
-        listen 7614;
+    charset utf-8;
+    include       mime.types;
+    default_type  application/octet-stream;
+
+    # 启用 SSL 协议，建议加上 TLSv1.3
+    ssl_protocols TLSv1 TLSv1.1 TLSv1.2 TLSv1.3;
+    ssl_prefer_server_ciphers on;
+
+    sendfile        on;
+    keepalive_timeout  65;
+
+    # HTTP 80 端口，重定向到 HTTPS
+    server {
+        listen 80;
+        server_name mail.shenjianl.cn;  # 改为你自己的域名
+
+        # 统一重定向到 HTTPS
+        return 301 https://$host$request_uri;
+    }
+
+    # HTTPS 443 端口主服务
+    server {
+        listen 443 ssl;
+        server_name mail.shenjianl.cn;  # 改为你自己的域名
+
+        ssl_certificate /etc/nginx/certs/mail.shenjianl.cn_bundle.pem; # 改为你自己的证书文件
+        ssl_certificate_key /etc/nginx/certs/mail.shenjianl.cn.key;    # 改为你自己的密钥文件
+
+        root /usr/share/nginx/html;
+        index index.html;
 
-        # 前端静态文件
         location / {
-            root /usr/share/nginx/html;
-            index index.html;
             try_files $uri $uri/ /index.html;
         }
 
-        # 后端 API 转发
+        # 反向代理 /api 到后端服务
         location /api {
-            proxy_pass http://backend:5182;
+            proxy_pass http://email-backend:5182;
             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;
         }
-    }
-}
 
-stream {
-    server {
-        listen 25;
-        proxy_pass backend:25;
+        # WebSocket 支持
+        location /ws {
+            proxy_pass http://email-backend:5182;
+            proxy_http_version 1.1;
+            proxy_set_header Upgrade $http_upgrade;
+            proxy_set_header Connection "Upgrade";
+
+            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;
+
+            # 设置更长的超时时间以保持 WebSocket 连接
+            proxy_read_timeout 600s;
+            proxy_send_timeout 600s;
+        }
     }
 }