feat: now slave server can sync options with master server (close #88)

README.md

@@ -48,26 +48,27 @@ _✨ All in one 的 OpenAI 接口，整合各种 API 访问方式，开箱即用
    + [x] OpenAI 官方通道
    + [x] **Azure OpenAI API**
    + [x] [API2D](https://api2d.com/r/197971)
+   + [x] [OhMyGPT](https://aigptx.top?aff=uFpUl2Kf)
    + [x] [CloseAI](https://console.openai-asia.com)
    + [x] [OpenAI-SB](https://openai-sb.com)
    + [x] [OpenAI Max](https://openaimax.com)
-   + [x] [OhMyGPT](https://www.ohmygpt.com)
    + [x] 自定义渠道：例如使用自行搭建的 OpenAI 代理
 2. 支持通过**负载均衡**的方式访问多个渠道。
 3. 支持 **stream 模式**，可以通过流式传输实现打字机效果。
-4. 支持**令牌管理**，设置令牌的过期时间和使用次数。
+4. 支持**多机部署**，[详见此处](#多机部署)。
-5. 支持**兑换码管理**，支持批量生成和导出兑换码，可使用兑换码为令牌进行充值。
+5. 支持**令牌管理**，设置令牌的过期时间和使用次数。
-6. 支持**通道管理**，批量创建通道。
+6. 支持**兑换码管理**，支持批量生成和导出兑换码，可使用兑换码为令牌进行充值。
-7. 支持发布公告，设置充值链接，设置新用户初始额度。
+7. 支持**通道管理**，批量创建通道。
-8. 支持丰富的**自定义**设置，
+8. 支持发布公告，设置充值链接，设置新用户初始额度。
+9. 支持丰富的**自定义**设置，
    1. 支持自定义系统名称，logo 以及页脚。
    2. 支持自定义首页和关于页面，可以选择使用 HTML & Markdown 代码进行自定义，或者使用一个单独的网页通过 iframe 嵌入。
-9. 支持通过系统访问令牌访问管理 API。
+10. 支持通过系统访问令牌访问管理 API。
-10. 支持用户管理，支持**多种用户登录注册方式**：
+11. 支持用户管理，支持**多种用户登录注册方式**：
     + 邮箱登录注册以及通过邮箱进行密码重置。
     + [GitHub 开放授权](https://github.com/settings/applications/new)。
     + 微信公众号授权（需要额外部署 [WeChat Server](https://github.com/songquanpeng/wechat-server)）。
-11. 未来其他大模型开放 API 后，将第一时间支持，并将其封装成同样的 API 访问方式。
+12. 未来其他大模型开放 API 后，将第一时间支持，并将其封装成同样的 API 访问方式。
 
 ## 部署
 ### 基于 Docker 进行部署
@@ -133,6 +134,14 @@ sudo service nginx restart
 
 更加详细的部署教程[参见此处](https://iamazing.cn/page/how-to-deploy-a-website)。
 
+### 多机部署
+1. 所有服务器 `SESSION_SECRET` 设置一样的值。
+2. 必须设置 `SQL_DSN`，使用 MySQL 数据库而非 SQLite，请执行配置主备数据库同步。
+3. 所有从服务器必须设置 `SYNC_FREQUENCY`，以定期从数据库同步配置。
+4. 从服务器可以选择设置 `FRONTEND_BASE_URL`，以重定向页面请求到主服务器。‘
+
+环境变量的具体使用方法详见[此处](#环境变量)。
+
 ## 配置
 系统本身开箱即用。
 
@@ -157,6 +166,10 @@ sudo service nginx restart
    + 例子：`SESSION_SECRET=random_string`
 3. `SQL_DSN`：设置之后将使用指定数据库而非 SQLite。
    + 例子：`SQL_DSN=root:123456@tcp(localhost:3306)/one-api`
+4. `FRONTEND_BASE_URL`：设置之后将使用指定的前端地址，而非后端地址。
+   + 例子：`FRONTEND_BASE_URL=https://openai.justsong.cn`
+5. `SYNC_FREQUENCY`：设置之后将定期与数据库同步配置，单位为秒，未设置则不进行同步。
+   + 例子：`SYNC_FREQUENCY=60`
 
 ### 命令行参数
 1. `--port <port_number>`: 指定服务器监听的端口号，默认为 `3000`。

common/constants.go

@@ -132,7 +132,7 @@ const (
 var ChannelBaseURLs = []string{
 	"",                            // 0
 	"https://api.openai.com",      // 1
-	"https://openai.api2d.net",    // 2
+	"https://oa.api2d.net",        // 2
 	"",                            // 3
 	"https://api.openai-asia.com", // 4
 	"https://api.openai-sb.com",   // 5

controller/channel.go

@@ -201,7 +201,7 @@ func testChannel(channel *model.Channel, request *ChatRequest) error {
 	if err != nil {
 		return err
 	}
-	if response.Error.Type != "" {
+	if response.Error.Message != "" {
 		return errors.New(fmt.Sprintf("type %s, code %s, message %s", response.Error.Type, response.Error.Code, response.Error.Message))
 	}
 	return nil
@@ -265,14 +265,14 @@ var testAllChannelsLock sync.Mutex
 var testAllChannelsRunning bool = false
 
 // disable & notify
-func disableChannel(channelId int, channelName string, err error) {
+func disableChannel(channelId int, channelName string, reason string) {
 	if common.RootUserEmail == "" {
 		common.RootUserEmail = model.GetRootUserEmail()
 	}
 	model.UpdateChannelStatusById(channelId, common.ChannelStatusDisabled)
 	subject := fmt.Sprintf("通道「%s」（#%d）已被禁用", channelName, channelId)
-	content := fmt.Sprintf("通道「%s」（#%d）已被禁用，原因：%s", channelName, channelId, err.Error())
+	content := fmt.Sprintf("通道「%s」（#%d）已被禁用，原因：%s", channelName, channelId, reason)
-	err = common.SendEmail(subject, common.RootUserEmail, content)
+	err := common.SendEmail(subject, common.RootUserEmail, content)
 	if err != nil {
 		common.SysError(fmt.Sprintf("发送邮件失败：%s", err.Error()))
 	}
@@ -312,7 +312,7 @@ func testAllChannels(c *gin.Context) error {
 				if milliseconds > disableThreshold {
 					err = errors.New(fmt.Sprintf("响应时间 %.2fs 超过阈值 %.2fs", float64(milliseconds)/1000.0, float64(disableThreshold)/1000.0))
 				}
-				disableChannel(channel.Id, channel.Name, err)
+				disableChannel(channel.Id, channel.Name, err.Error())
 			}
 			channel.UpdateResponseTime(milliseconds)
 		}

controller/model.go

@@ -0,0 +1,153 @@
+package controller
+
+import (
+	"fmt"
+	"github.com/gin-gonic/gin"
+)
+
+// https://platform.openai.com/docs/api-reference/models/list
+
+type OpenAIModelPermission struct {
+	Id                 string  `json:"id"`
+	Object             string  `json:"object"`
+	Created            int     `json:"created"`
+	AllowCreateEngine  bool    `json:"allow_create_engine"`
+	AllowSampling      bool    `json:"allow_sampling"`
+	AllowLogprobs      bool    `json:"allow_logprobs"`
+	AllowSearchIndices bool    `json:"allow_search_indices"`
+	AllowView          bool    `json:"allow_view"`
+	AllowFineTuning    bool    `json:"allow_fine_tuning"`
+	Organization       string  `json:"organization"`
+	Group              *string `json:"group"`
+	IsBlocking         bool    `json:"is_blocking"`
+}
+
+type OpenAIModels struct {
+	Id         string                `json:"id"`
+	Object     string                `json:"object"`
+	Created    int                   `json:"created"`
+	OwnedBy    string                `json:"owned_by"`
+	Permission OpenAIModelPermission `json:"permission"`
+	Root       string                `json:"root"`
+	Parent     *string               `json:"parent"`
+}
+
+var openAIModels []OpenAIModels
+var openAIModelsMap map[string]OpenAIModels
+
+func init() {
+	permission := OpenAIModelPermission{
+		Id:                 "modelperm-LwHkVFn8AcMItP432fKKDIKJ",
+		Object:             "model_permission",
+		Created:            1626777600,
+		AllowCreateEngine:  true,
+		AllowSampling:      true,
+		AllowLogprobs:      true,
+		AllowSearchIndices: false,
+		AllowView:          true,
+		AllowFineTuning:    false,
+		Organization:       "*",
+		Group:              nil,
+		IsBlocking:         false,
+	}
+	// https://platform.openai.com/docs/models/model-endpoint-compatibility
+	openAIModels = []OpenAIModels{
+		{
+			Id:         "gpt-3.5-turbo",
+			Object:     "model",
+			Created:    1677649963,
+			OwnedBy:    "openai",
+			Permission: permission,
+			Root:       "gpt-3.5-turbo",
+			Parent:     nil,
+		},
+		{
+			Id:         "gpt-3.5-turbo-0301",
+			Object:     "model",
+			Created:    1677649963,
+			OwnedBy:    "openai",
+			Permission: permission,
+			Root:       "gpt-3.5-turbo-0301",
+			Parent:     nil,
+		},
+		{
+			Id:         "gpt-4",
+			Object:     "model",
+			Created:    1677649963,
+			OwnedBy:    "openai",
+			Permission: permission,
+			Root:       "gpt-4",
+			Parent:     nil,
+		},
+		{
+			Id:         "gpt-4-0314",
+			Object:     "model",
+			Created:    1677649963,
+			OwnedBy:    "openai",
+			Permission: permission,
+			Root:       "gpt-4-0314",
+			Parent:     nil,
+		},
+		{
+			Id:         "gpt-4-32k",
+			Object:     "model",
+			Created:    1677649963,
+			OwnedBy:    "openai",
+			Permission: permission,
+			Root:       "gpt-4-32k",
+			Parent:     nil,
+		},
+		{
+			Id:         "gpt-4-32k-0314",
+			Object:     "model",
+			Created:    1677649963,
+			OwnedBy:    "openai",
+			Permission: permission,
+			Root:       "gpt-4-32k-0314",
+			Parent:     nil,
+		},
+		{
+			Id:         "gpt-3.5-turbo",
+			Object:     "model",
+			Created:    1677649963,
+			OwnedBy:    "openai",
+			Permission: permission,
+			Root:       "gpt-3.5-turbo",
+			Parent:     nil,
+		},
+		{
+			Id:         "text-embedding-ada-002",
+			Object:     "model",
+			Created:    1677649963,
+			OwnedBy:    "openai",
+			Permission: permission,
+			Root:       "text-embedding-ada-002",
+			Parent:     nil,
+		},
+	}
+	openAIModelsMap = make(map[string]OpenAIModels)
+	for _, model := range openAIModels {
+		openAIModelsMap[model.Id] = model
+	}
+}
+
+func ListModels(c *gin.Context) {
+	c.JSON(200, openAIModels)
+}
+
+func RetrieveModel(c *gin.Context) {
+	modelId := c.Param("model")
+	if model, ok := openAIModelsMap[modelId]; ok {
+		c.JSON(200, model)
+	} else {
+		openAIError := OpenAIError{
+			Message: fmt.Sprintf("The model '%s' does not exist", modelId),
+			Type:    "invalid_request_error",
+			Param:   "model",
+			Code:    "model_not_found",
+		}
+		c.JSON(200, gin.H{
+			"error": openAIError,
+		})
+	}
+}

controller/relay.go

@@ -4,7 +4,6 @@ import (
 	"bufio"
 	"bytes"
 	"encoding/json"
-	"errors"
 	"fmt"
 	"github.com/gin-gonic/gin"
 	"github.com/pkoukk/tiktoken-go"
@@ -47,6 +46,11 @@ type OpenAIError struct {
 	Code    string `json:"code"`
 }
 
+type OpenAIErrorWithStatusCode struct {
+	OpenAIError
+	StatusCode int `json:"status_code"`
+}
+
 type TextResponse struct {
 	Usage `json:"usage"`
 	Error OpenAIError `json:"error"`
@@ -71,21 +75,33 @@ func countToken(text string) int {
 func Relay(c *gin.Context) {
 	err := relayHelper(c)
 	if err != nil {
-		c.JSON(http.StatusOK, gin.H{
+		c.JSON(err.StatusCode, gin.H{
-			"error": gin.H{
+			"error": err.OpenAIError,
-				"message": err.Error(),
-				"type":    "one_api_error",
-			},
 		})
-		if common.AutomaticDisableChannelEnabled {
+		channelId := c.GetInt("channel_id")
+		common.SysError(fmt.Sprintf("Relay error (channel #%d): %s", channelId, err.Message))
+		if err.Type != "invalid_request_error" && err.StatusCode != http.StatusTooManyRequests &&
+			common.AutomaticDisableChannelEnabled {
 			channelId := c.GetInt("channel_id")
 			channelName := c.GetString("channel_name")
-			disableChannel(channelId, channelName, err)
+			disableChannel(channelId, channelName, err.Message)
 		}
 	}
 }
 
-func relayHelper(c *gin.Context) error {
+func errorWrapper(err error, code string, statusCode int) *OpenAIErrorWithStatusCode {
+	openAIError := OpenAIError{
+		Message: err.Error(),
+		Type:    "one_api_error",
+		Code:    code,
+	}
+	return &OpenAIErrorWithStatusCode{
+		OpenAIError: openAIError,
+		StatusCode:  statusCode,
+	}
+}
+
+func relayHelper(c *gin.Context) *OpenAIErrorWithStatusCode {
 	channelType := c.GetInt("channel")
 	tokenId := c.GetInt("token_id")
 	consumeQuota := c.GetBool("consume_quota")
@@ -93,15 +109,15 @@ func relayHelper(c *gin.Context) error {
 	if consumeQuota || channelType == common.ChannelTypeAzure {
 		requestBody, err := io.ReadAll(c.Request.Body)
 		if err != nil {
-			return err
+			return errorWrapper(err, "read_request_body_failed", http.StatusBadRequest)
 		}
 		err = c.Request.Body.Close()
 		if err != nil {
-			return err
+			return errorWrapper(err, "close_request_body_failed", http.StatusBadRequest)
 		}
 		err = json.Unmarshal(requestBody, &textRequest)
 		if err != nil {
-			return err
+			return errorWrapper(err, "unmarshal_request_body_failed", http.StatusBadRequest)
 		}
 		// Reset request body
 		c.Request.Body = io.NopCloser(bytes.NewBuffer(requestBody))
@@ -144,12 +160,12 @@ func relayHelper(c *gin.Context) error {
 	if consumeQuota {
 		err := model.PreConsumeTokenQuota(tokenId, preConsumedQuota)
 		if err != nil {
-			return err
+			return errorWrapper(err, "pre_consume_token_quota_failed", http.StatusOK)
 		}
 	}
 	req, err := http.NewRequest(c.Request.Method, fullRequestURL, c.Request.Body)
 	if err != nil {
-		return err
+		return errorWrapper(err, "new_request_failed", http.StatusOK)
 	}
 	if channelType == common.ChannelTypeAzure {
 		key := c.Request.Header.Get("Authorization")
@@ -164,18 +180,18 @@ func relayHelper(c *gin.Context) error {
 	client := &http.Client{}
 	resp, err := client.Do(req)
 	if err != nil {
-		return err
+		return errorWrapper(err, "do_request_failed", http.StatusOK)
 	}
 	err = req.Body.Close()
 	if err != nil {
-		return err
+		return errorWrapper(err, "close_request_body_failed", http.StatusOK)
 	}
 	err = c.Request.Body.Close()
 	if err != nil {
-		return err
+		return errorWrapper(err, "close_request_body_failed", http.StatusOK)
 	}
 	var textResponse TextResponse
-	isStream := resp.Header.Get("Content-Type") == "text/event-stream"
+	isStream := strings.HasPrefix(resp.Header.Get("Content-Type"), "text/event-stream")
 	var streamResponseText string
 
 	defer func() {
@@ -257,50 +273,60 @@ func relayHelper(c *gin.Context) error {
 		})
 		err = resp.Body.Close()
 		if err != nil {
-			return err
+			return errorWrapper(err, "close_response_body_failed", http.StatusOK)
 		}
 		return nil
 	} else {
-		for k, v := range resp.Header {
-			c.Writer.Header().Set(k, v[0])
-		}
 		if consumeQuota {
 			responseBody, err := io.ReadAll(resp.Body)
 			if err != nil {
-				return err
+				return errorWrapper(err, "read_response_body_failed", http.StatusOK)
 			}
 			err = resp.Body.Close()
 			if err != nil {
-				return err
+				return errorWrapper(err, "close_response_body_failed", http.StatusOK)
 			}
 			err = json.Unmarshal(responseBody, &textResponse)
 			if err != nil {
-				return err
+				return errorWrapper(err, "unmarshal_response_body_failed", http.StatusOK)
 			}
 			if textResponse.Error.Type != "" {
-				return errors.New(fmt.Sprintf("type %s, code %s, message %s",
+				return &OpenAIErrorWithStatusCode{
-					textResponse.Error.Type, textResponse.Error.Code, textResponse.Error.Message))
+					OpenAIError: textResponse.Error,
+					StatusCode:  resp.StatusCode,
+				}
 			}
 			// Reset response body
 			resp.Body = io.NopCloser(bytes.NewBuffer(responseBody))
 		}
+		// We shouldn't set the header before we parse the response body, because the parse part may fail.
+		// And then we will have to send an error response, but in this case, the header has already been set.
+		// So the client will be confused by the response.
+		// For example, Postman will report error, and we cannot check the response at all.
+		for k, v := range resp.Header {
+			c.Writer.Header().Set(k, v[0])
+		}
+		c.Writer.WriteHeader(resp.StatusCode)
 		_, err = io.Copy(c.Writer, resp.Body)
 		if err != nil {
-			return err
+			return errorWrapper(err, "copy_response_body_failed", http.StatusOK)
 		}
 		err = resp.Body.Close()
 		if err != nil {
-			return err
+			return errorWrapper(err, "close_response_body_failed", http.StatusOK)
 		}
 		return nil
 	}
 }
 
 func RelayNotImplemented(c *gin.Context) {
+	err := OpenAIError{
+		Message: "API not implemented",
+		Type:    "one_api_error",
+		Param:   "",
+		Code:    "api_not_implemented",
+	}
 	c.JSON(http.StatusOK, gin.H{
-		"error": gin.H{
+		"error": err,
-			"message": "Not Implemented",
-			"type":    "one_api_error",
-		},
 	})
 }

controller/user.go

@@ -467,6 +467,13 @@ func CreateUser(c *gin.Context) {
 		})
 		return
 	}
+	if err := common.Validate.Struct(&user); err != nil {
+		c.JSON(http.StatusOK, gin.H{
+			"success": false,
+			"message": "输入不合法 " + err.Error(),
+		})
+		return
+	}
 	if user.DisplayName == "" {
 		user.DisplayName = user.Username
 	}

main.go

@@ -47,6 +47,13 @@ func main() {
 
 	// Initialize options
 	model.InitOptionMap()
+	if os.Getenv("SYNC_FREQUENCY") != "" {
+		frequency, err := strconv.Atoi(os.Getenv("SYNC_FREQUENCY"))
+		if err != nil {
+			common.FatalLog(err)
+		}
+		go model.SyncOptions(frequency)
+	}
 
 	// Initialize HTTP server
 	server := gin.Default()

middleware/auth.go

@@ -85,6 +85,8 @@ func RootAuth() func(c *gin.Context) {
 func TokenAuth() func(c *gin.Context) {
 	return func(c *gin.Context) {
 		key := c.Request.Header.Get("Authorization")
+		key = strings.TrimPrefix(key, "Bearer ")
+		key = strings.TrimPrefix(key, "sk-")
 		parts := strings.Split(key, "-")
 		key = parts[0]
 		token, err := model.ValidateUserToken(key)

model/option.go

@@ -4,6 +4,7 @@ import (
 	"one-api/common"
 	"strconv"
 	"strings"
+	"time"
 )
 
 type Option struct {
@@ -59,6 +60,10 @@ func InitOptionMap() {
 	common.OptionMap["ModelRatio"] = common.ModelRatio2JSONString()
 	common.OptionMap["TopUpLink"] = common.TopUpLink
 	common.OptionMapRWMutex.Unlock()
+	loadOptionsFromDatabase()
+}
+
+func loadOptionsFromDatabase() {
 	options, _ := AllOption()
 	for _, option := range options {
 		err := updateOptionMap(option.Key, option.Value)
@@ -68,6 +73,14 @@ func InitOptionMap() {
 	}
 }
 
+func SyncOptions(frequency int) {
+	for {
+		time.Sleep(time.Duration(frequency) * time.Second)
+		common.SysLog("Syncing options from database")
+		loadOptionsFromDatabase()
+	}
+}
+
 func UpdateOption(key string, value string) error {
 	// Save to database first
 	option := Option{

model/token.go

@@ -6,7 +6,6 @@ import (
 	_ "gorm.io/driver/sqlite"
 	"gorm.io/gorm"
 	"one-api/common"
-	"strings"
 )
 
 type Token struct {
@@ -38,7 +37,6 @@ func ValidateUserToken(key string) (token *Token, err error) {
 	if key == "" {
 		return nil, errors.New("未提供 token")
 	}
-	key = strings.Replace(key, "Bearer ", "", 1)
 	token = &Token{}
 	err = DB.Where("`key` = ?", key).First(token).Error
 	if err == nil {

router/main.go

@@ -2,12 +2,24 @@ package router
 
 import (
 	"embed"
+	"fmt"
 	"github.com/gin-gonic/gin"
+	"net/http"
+	"os"
+	"strings"
 )
 
 func SetRouter(router *gin.Engine, buildFS embed.FS, indexPage []byte) {
 	SetApiRouter(router)
 	SetDashboardRouter(router)
 	SetRelayRouter(router)
-	setWebRouter(router, buildFS, indexPage)
+	frontendBaseUrl := os.Getenv("FRONTEND_BASE_URL")
+	if frontendBaseUrl == "" {
+		SetWebRouter(router, buildFS, indexPage)
+	} else {
+		frontendBaseUrl = strings.TrimSuffix(frontendBaseUrl, "/")
+		router.NoRoute(func(c *gin.Context) {
+			c.Redirect(http.StatusMovedPermanently, fmt.Sprintf("%s%s", frontendBaseUrl, c.Request.RequestURI))
+		})
+	}
 }

router/relay-router.go

@@ -11,8 +11,8 @@ func SetRelayRouter(router *gin.Engine) {
 	relayV1Router := router.Group("/v1")
 	relayV1Router.Use(middleware.TokenAuth(), middleware.Distribute())
 	{
-		relayV1Router.GET("/models", controller.Relay)
+		relayV1Router.GET("/models", controller.ListModels)
-		relayV1Router.GET("/models/:model", controller.Relay)
+		relayV1Router.GET("/models/:model", controller.RetrieveModel)
 		relayV1Router.POST("/completions", controller.RelayNotImplemented)
 		relayV1Router.POST("/chat/completions", controller.Relay)
 		relayV1Router.POST("/edits", controller.RelayNotImplemented)

router/web-router.go

@@ -10,7 +10,7 @@ import (
 	"one-api/middleware"
 )
 
-func setWebRouter(router *gin.Engine, buildFS embed.FS, indexPage []byte) {
+func SetWebRouter(router *gin.Engine, buildFS embed.FS, indexPage []byte) {
 	router.Use(gzip.Gzip(gzip.DefaultCompression))
 	router.Use(middleware.GlobalWebRateLimit())
 	router.Use(middleware.Cache())

web/src/components/UsersTable.js

@@ -4,6 +4,7 @@ import { Link } from 'react-router-dom';
 import { API, showError, showSuccess } from '../helpers';
 
 import { ITEMS_PER_PAGE } from '../constants';
+import { renderText } from '../helpers/render';
 
 function renderRole(role) {
   switch (role) {
@@ -64,7 +65,7 @@ const UsersTable = () => {
     (async () => {
       const res = await API.post('/api/user/manage', {
         username,
-        action,
+        action
       });
       const { success, message } = res.data;
       if (success) {
@@ -161,18 +162,18 @@ const UsersTable = () => {
             <Table.HeaderCell
               style={{ cursor: 'pointer' }}
               onClick={() => {
-                sortUser('username');
+                sortUser('id');
               }}
             >
-              用户名
+              ID
             </Table.HeaderCell>
             <Table.HeaderCell
               style={{ cursor: 'pointer' }}
               onClick={() => {
-                sortUser('display_name');
+                sortUser('username');
               }}
             >
-              显示名称
+              用户名
             </Table.HeaderCell>
             <Table.HeaderCell
               style={{ cursor: 'pointer' }}
@@ -220,9 +221,17 @@ const UsersTable = () => {
               if (user.deleted) return <></>;
               return (
                 <Table.Row key={user.id}>
-                  <Table.Cell>{user.username}</Table.Cell>
+                  <Table.Cell>{user.id}</Table.Cell>
-                  <Table.Cell>{user.display_name}</Table.Cell>
+                  <Table.Cell>
-                  <Table.Cell>{user.email ? user.email : '无'}</Table.Cell>
+                    <Popup
+                      content={user.email ? user.email : '未绑定邮箱地址'}
+                      key={user.display_name}
+                      header={user.display_name ? user.display_name : user.username}
+                      trigger={<span>{renderText(user.username, 10)}</span>}
+                      hoverable
+                    />
+                  </Table.Cell>
+                  <Table.Cell>{user.email ? renderText(user.email, 30) : '无'}</Table.Cell>
                   <Table.Cell>{user.quota}</Table.Cell>
                   <Table.Cell>{renderRole(user.role)}</Table.Cell>
                   <Table.Cell>{renderStatus(user.status)}</Table.Cell>

web/src/helpers/render.js

@@ -0,0 +1,6 @@
+export function renderText(text, limit) {
+  if (text.length > limit) {
+    return text.slice(0, limit - 3) + '...';
+  }
+  return text;
+}