在一台服务器上通过 Nginx 配置实现不同子域名访问静态文件和后端服务

一、域名解析配置

要实现通过不同子域名访问静态文件和后端服务,首先需要进行域名解析。在域名注册商或 DNS 服务商处,为你的两个子域名 blog.xxx.comapi.xxx.com 配置 A 记录或 CNAME 记录。将它们的 A 记录都指向你服务器的 IP 地址。例如,如果服务器 IP 是 192.168.1.100,那么设置 blog.xxx.comapi.xxx.com 的 A 记录值为这个 IP。

二、Nginx 配置

(一)静态文件配置(blog.xxx.com

  1. 创建一个新的 Nginx 配置文件,或者编辑现有的配置文件。可以通过命令 sudo nano /etc/nginx/sites-available/blog(路径可能会因你的系统安装配置而有所不同)来创建或编辑。

  2. 配置内容如下:

    js 复制代码
    server {
        listen 80;
        server_name blog.xxx.com;
    
        location / {
            root /path/to/your/static/files; # 静态文件存放路径
            index index.html;
        }
    }

    这里监听 80 端口,server_name 指令指定子域名。location / 块指定了根目录,当用户访问 blog.xxx.com 时,会从指定的静态文件目录中查找资源。

(二)后端服务配置(api.xxx.com

  1. 同样,创建或编辑 Nginx 配置文件,如 sudo nano /etc/nginx/sites-available/api

  2. 配置示例:

    js 复制代码
    server {
        listen 80;
        server_name api.xxx.com;
    
        location / {
            proxy_pass http://localhost:your_backend_port; # 后端服务运行的本地端口
            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;
        }
    }

这里也是监听 80 端口,proxy_pass 指令将请求转发到本地运行的后端服务端口,其他 proxy_set_header 指令用于正确设置请求头,以便后端服务能够获取正确的客户端信息等。

通过以上步骤,你就可以实现在一台服务器上,通过不同的子域名分别访问静态文件和后端服务,并且都开启了 HTTPS 保护。

相关推荐
这是个栗子18 小时前
【Vue代码分析】前端动态路由传参与可选参数标记:实现“添加/查看”模式的灵活路由配置
前端·javascript·vue.js
刘一说18 小时前
Vue 动态路由参数丢失问题详解:为什么 `:id` 拿不到值?
前端·javascript·vue.js
skywalk816318 小时前
尝试在openi启智社区的dcu环境安装ollama最新版0.15.2(失败)
linux·运维·服务器·ollama
看我干嘛!19 小时前
第三次python作业
服务器·数据库·python
熊猫钓鱼>_>19 小时前
动态网站发布部署核心问题详解
前端·nginx·容器化·网页开发·云服务器·静态部署
方也_arkling19 小时前
elementPlus按需导入配置
前端·javascript·vue.js
我的xiaodoujiao19 小时前
使用 Python 语言 从 0 到 1 搭建完整 Web UI自动化测试学习系列 44--将自动化测试结果自动推送至钉钉工作群聊
前端·python·测试工具·ui·pytest
沛沛老爹19 小时前
Web开发者转型AI:多模态Agent视频分析技能开发实战
前端·人工智能·音视频
Andy Dennis19 小时前
FTP局域网功能小网站V2_2
服务器·flask·html5
我材不敲代码19 小时前
在Linux系统上安装MySQL
linux·运维·服务器