如何用Nginx+Cloudflare将Laravel开发路由设为其他域名首页

一、Cloudflare DNS配置 #

• 登录Cloudflare控制台，添加你的新域名（比如dev-landing.yourdomain.com），完成域名所有权验证。
• 添加DNS记录：类型选A，名称填@（主域名）或对应子域名前缀，内容填你的DigitalOcean Droplet公网IP，代理状态设为Proxied（开启橙色云朵）。
• 将新域名的SSL/TLS模式设为「Full」或「Flexible」（推荐用Full，前提是Droplet上已配置对应SSL证书）。

二、Nginx配置调整 #

情况1：开发环境/frontend对应本地静态文件目录 #

如果/frontend路由直接指向服务器上的静态文件目录（比如/var/www/dev-app/frontend），为新域名创建独立server块：

server {
    listen 80;
    server_name dev-landing.yourdomain.com;

    # 重定向HTTP到HTTPS
    return 301 https://$server_name$request_uri;
}

server {
    listen 443 ssl http2;
    server_name dev-landing.yourdomain.com;

    # 配置SSL证书（可使用Let's Encrypt或Cloudflare Origin CA证书）
    ssl_certificate /path/to/your/cert.pem;
    ssl_certificate_key /path/to/your/key.pem;

    # 直接指向开发环境frontend的文件根目录
    root /var/www/dev-app/frontend;
    index index.html index.htm;

    # 处理单页应用路由（若为SPA）
    location / {
        try_files $uri $uri/ /index.html;
    }
}

情况2：开发环境/frontend反向代理到后端服务 #

如果/frontend是代理到本地开发服务（比如localhost:3000/frontend），调整新域名的server块：

server {
    listen 80;
    server_name dev-landing.yourdomain.com;
    return 301 https://$server_name$request_uri;
}

server {
    listen 443 ssl http2;
    server_name dev-landing.yourdomain.com;

    ssl_certificate /path/to/your/cert.pem;
    ssl_certificate_key /path/to/your/key.pem;

    location / {
        # 将新域名根请求转发到开发环境/frontend路径
        proxy_pass http://localhost:3000/frontend/;
        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;

        # 重写路径避免404
        rewrite ^/(.*)$ /frontend/$1 break;
    }
}

配置验证与生效 #

• 检查Nginx配置语法：sudo nginx -t
• 重载Nginx使配置生效：sudo systemctl reload nginx

三、常见问题排查 #

• 之前用location块未生效，大概率是没为新域名创建独立server块，仅在something.management的server内添加location，导致Nginx只会匹配原域名请求，无法处理新域名。
• 用nslookup dev-landing.yourdomain.com验证Cloudflare DNS记录是否已生效。
• 若为单页应用，必须配置try_files或rewrite规则，避免刷新页面出现404。

内容的提问来源于stack exchange，提问作者Nipen Majumder