当前位置: 首页 > news >正文

阿里云服务器安装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 即可访问到页面

    http://www.lqws.cn/news/161731.html

    相关文章:

  • Spring Boot 使用 SLF4J 实现控制台输出与分类日志文件管理
  • uv管理spaCy语言模型
  • 使用Hutool工具进行rsa加密解密示例:
  • JVM垃圾回收器-ZGC
  • GC1809:高性能音频接收与转换芯片
  • NineData云原生智能数据管理平台新功能发布|2025年5月版
  • SpringCloud——Nacos
  • SDC命令详解:使用set_fanout_load命令进行约束
  • 可穿戴设备:健康监测的未来之眼
  • clickhouse常用语句汇总——持续更新中
  • 牛客小白月赛113
  • Git的由来与应用详解:从Linux内核到现代开发的革命性工具
  • windows server2019 不成功的部署docker经历
  • [特殊字符] 一文了解目前主流的 Cursor AI 免费续杯工具!
  • AI时代的弯道超车之第二十四章:AI伦理和版权问题
  • 智慧园区数字孪生全链交付方案:降本增效30%,多案例实践驱动全周期交付
  • STM32入门教程——OLED调试工具
  • Elasticsearch最新入门教程
  • vue3 eslint ts 关闭多单词命名检查
  • AirSim/Cosys-AirSim 游戏开发(二)使用自定义场景
  • 大模型学习
  • adb 连不上真机设备问题汇总
  • uniapp微信小程序视频实时流+pc端预览方案
  • 音视频之视频压缩编码的基本原理
  • Rust Floem UI 框架使用简介
  • 从《现实不似你所见》探寻与缘起性空的思想交织
  • OPenCV CUDA模块目标检测----- HOG 特征提取和目标检测类cv::cuda::HOG
  • 基于STM32设计的水资源监测系统
  • 前缀和题目:逐步求和得到正数的最小值
  • PySpark性能调优手册:大数据处理中的避坑与实践