需求：两套前端界面，一套开发者自用，一套用户使用

(因为两套界面，所以MCP发布workflow与原版不一样)

第一个修改文件：

/docker/docker-compose.yaml

(1) 复制web镜像，对名称等，修改为自己的：

'''
  web:
    image: langgenius/dify-web:1.5.1
    restart: always
'''

  web-your: 
    build:
      context: ../web-your  # 指向修改后的代码目录
      dockerfile: ../web-your/Dockerfile
    image: dify-web:custom   # 这里   :   的前后都可以随意设置
    restart: always 

注：compose yaml文件的时候存在build不动你的新web的情况，可以单独build该镜像

（2）修改nginx的镜像设置

nginx:
    image: nginx:latest
    restart: always
# 中间省略
    environment:
      NGINX_PORT: ${NGINX_PORT:-80}
      NGINX_SHWY_PORT: ${NGINX_YOUR_PORT:-81}
    depends_on:
      - api
      - web
      - web-your   # 新增
    ports:
      - '${EXPOSE_NGINX_PORT:-8065}:${NGINX_PORT:-80}'
      - '${EXPOSE_YOUR_PORT:-8060}:${NGINX_YOUR_PORT:-81}'  # 新增
      - '${EXPOSE_NGINX_SSL_PORT:-8445}:${NGINX_SSL_PORT:-443}'

8060和81皆自定义的端口号，注意别冲突就好。

（3）增加对应的环境变量，找不到位置可以搜索EXPOSE_NGINX_PORT

x-shared-env: &shared-api-worker-env  # 在yaml文件首部
EXPOSE_YOUR_PORT : ${EXPOSE_YOUR_PORT:-8060}

第二个修改文件（设置两套监听服务）：

/docker/nginx/conf.d

修改default.conf.template（default.conf.template会自动覆盖default.conf）

server {
    listen ${NGINX_PORT};
    server_name ${NGINX_SERVER_NAME};
    
    location /console/api {
      proxy_pass http://api:5001;
      include proxy.conf;
    }

    location /api {
      proxy_pass http://api:5001;
      include proxy.conf;
    }

    location /v1 {
      proxy_pass http://api:5001;
      include proxy.conf;
    }

    location /files {
      proxy_pass http://api:5001;
      include proxy.conf;
    }


    location /e/ {
      proxy_pass http://plugin_daemon:5002;
      proxy_set_header Dify-Hook-Url $scheme://$host$request_uri;
      include proxy.conf;
    }


    location /explore {
      proxy_pass http://web:3000;
      include proxy.conf;
    }

    location / {
      proxy_pass http://web:3000;
      include proxy.conf;
    }

    # placeholder for acme challenge location
    ${ACME_CHALLENGE_LOCATION}

    # placeholder for https config defined in https.conf.template
    ${HTTPS_CONFIG}
}

server {
    listen ${NGINX_SHWY_PORT};
    server_name ${NGINX_SERVER_NAME};
    
    location /console/api {
      proxy_pass http://api:5001;
      include proxy.conf;
    }

    location /api {
      proxy_pass http://api:5001;
      include proxy.conf;
    }

    location /v1 {
      proxy_pass http://api:5001;
      include proxy.conf;
    }

    location /files {
      proxy_pass http://api:5001;
      include proxy.conf;
    }


    location /e/ {
      proxy_pass http://plugin_daemon:5002;
      proxy_set_header Dify-Hook-Url $scheme://$host$request_uri;
      include proxy.conf;
    }


    location /explore {
      proxy_pass http://web-your:4000;
      include proxy.conf;
    }

    location / {
      proxy_pass http://web-your:4000;
      include proxy.conf;
    }

    # placeholder for acme challenge location
    ${ACME_CHALLENGE_LOCATION}

    # placeholder for https config defined in https.conf.template
    ${HTTPS_CONFIG}
}

这里第二套监听81端口，docker内部使用4000

注：所以将自定义的web ui的文件夹内dockerfile的port进行对应修改

上面演示用的1.5.1，但是dify1.6的MCP更新后，大家可能有使用MCP的需求，连接本地的MCP和正常的都一样，但是对于发布开发环境内的MCP，直接照搬就会报错：

‘Failed to connect to MCP server:’

检查docker内的api日志：显示我们请求的mcp服务器url：‘404 Not Found’

就需要稍作修改了(加上你的开发环境端口号)：

# 原版：
http://192.168.0.xx/mcp/server/******/mcp
# 修改后
http://192.168.0.xx:8065/mcp/server/******/mcp