阿里云服务器安装nginx并配置前端资源路径（前后端部署到一台服务器并成功访问）

​​​运行以下命令，安装Nginx相关依赖。

yum install -y gcc-c++
yum install -y pcre pcre-devel
yum install -y zlib zlib-devel
yum install -y openssl openssl-devel

运行wget命令下载Nginx 1.21.6。
您可以通过Nginx开源社区直接获取对应版本的安装包URL，然后通过wget URL的方式将Nginx安装包下载至ECS实例。例如，Nginx 1.21.6的下载命令如下：

wget http://nginx.org/download/nginx-1.21.6.tar.gz

运行以下命令，解压Nginx 1.21.6安装包，然后进入Nginx所在的文件夹。

tar zxvf nginx-1.21.6.tar.gz
cd nginx-1.21.6

编译、安装

./configure

make

make install

查找安装路径

	whereis nginx

 进入nginx目录

cd /usr/local/nginx/sbin

​

启动

 ./nginx

​

没有报错信息则代表nginx启动成功！ 

启动防火墙服务

systemctl start firewalld

放行80端口

firewall-cmd --zone=public --add-port=80/tcp --permanent

重加载防火墙使修改生效 

firewall-cmd --reload

查看状态

ps -ef | grep nginx

重启

./nginx -s reload

 停止

kill -9 端口号

上传静态资源

在目录/root中建立一个空文件夹用来存放静态资源

输入命令修改nginx配置

vim /usr/local/nginx/conf/nginx.conf

 

对我的路径来说我修改了以下三个地方

（1）location / 场景（前端页面、主资源）

你的 index.html 在 /root/app 目录下，Nginx 配置 root /root/app 时：

• 访问 http://域名/ ，Nginx 会到 /root/app 找 index.html
• 页面里引用的 assets/xxx.js ，会被解析为从 /root/app/assets/xxx.js 加载（因为 root 是基础路径，请求会拼接）

（2）location /assets 场景（静态资源单独映射）

为了让 /assets 路径直接对应到静态资源目录，用 alias /root/app/assets ：

• 访问 http://域名/assets/xxx.js ，Nginx 直接到 /root/app/assets/xxx.js 找文件
• 比 root 更精准（root 会拼接路径，alias 是完全替换）

这样配置后：

• 页面访问 → 从 /root/app 取 index.html
• 资源访问 → 从 /root/app/assets 取 JS/CSS/ 图片

然后输入服务器ip+80 即可访问到页面