如何通过Nginx实现自定义子域名到通配符子域名的重定向？

前置用户侧配置 #

首先需要用户完成自有域名的DNS解析配置，二选一即可：

• CNAME解析：将user.abc.com的CNAME记录值设置为hello.xyz.com
• A记录解析：将user.abc.com的A记录值设置为你方服务器的公网IP

Nginx侧配置 #

根据业务需求可以选择重定向跳转或者反向代理两种实现方式：

方案1：301永久重定向（地址栏显示hello.xyz.com） #

适合需要统一域名入口的场景，用户访问user.abc.com时会自动跳转至你方子域名，地址栏同步变更。

# 自定义域名处理server块
server {
    listen 80;
    listen 443 ssl http2;
    server_name user.abc.com;

    # HTTPS证书配置，可使用免费证书服务签发
    ssl_certificate /path/to/user.abc.com/fullchain.pem;
    ssl_certificate_key /path/to/user.abc.com/privkey.pem;

    # 重定向到目标子域名，保留请求路径
    return 301 https://hello.xyz.com$request_uri;
}

# 原有通配符子域名配置保持不变即可
server {
    listen 443 ssl http2;
    server_name *.xyz.com;
    root /path/to/your/angular/dist;
    index index.html;
    # Angular单页应用路由适配
    try_files $uri $uri/ /index.html;
    ssl_certificate /path/to/*.xyz.com/fullchain.pem;
    ssl_certificate_key /path/to/*.xyz.com/privkey.pem;
}

方案2：反向代理（地址栏保留user.abc.com） #

适合需要保留用户自有域名的场景，用户全程看不到你方的子域名。

server {
    listen 80;
    listen 443 ssl http2;
    server_name user.abc.com;

    ssl_certificate /path/to/user.abc.com/fullchain.pem;
    ssl_certificate_key /path/to/user.abc.com/privkey.pem;

    location / {
        proxy_pass https://hello.xyz.com;
        proxy_set_header Host hello.xyz.com;
        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;

        # 适配Angular单页应用路由，避免刷新出现404
        proxy_intercept_errors on;
        error_page 404 = /index.html;
    }
}

批量用户自定义域名适配方案 #

如果有大量用户自定义域名需要配置，无需逐个新增server块，可使用map指令实现动态映射：

# http块下新增映射规则
map $host $target_domain {
    default "";
    user.abc.com hello.xyz.com;
    user2.def.com demo.xyz.com;
    # 可批量新增映射关系
}

server {
    listen 80 default_server;
    listen 443 ssl default_server;
    server_name _;

    ssl_certificate /path/to/default/ssl/fullchain.pem;
    ssl_certificate_key /path/to/default/ssl/privkey.pem;

    # 重定向场景逻辑
    if ($target_domain != "") {
        return 301 https://$target_domain$request_uri;
    }

    # 无匹配规则的请求返回404或自定义提示页
    return 404;
}

配置生效校验 #

• 配置修改后执行nginx -t校验配置语法是否合法
• 校验通过后执行nginx -s reload使配置生效
• 若Angular项目配置了CSP、域名白名单校验规则，需要将用户自定义域名加入白名单避免资源加载异常

内容的提问来源于stack exchange，提问作者Ranganadh P