Ubuntu使用Nginx部署前端项目——记录

安装nginx

依次执行以下两条命令进行安装:

sudo apt-get update
sudo apt-get install nginx

通过查看版本号查看是否安装成功:

nginx -v

补充卸载操作:

sudo apt-get remove nginx nginx-common
sudo apt-get purge nginx nginx-common
sudo apt-get autoremove
sudo apt-get remove nginx-full nginx-common

补充Ubuntu的包管理器的用法:

sudo apt-get update:更新软件源
sudo apt-get upgrade:升级系统
sudo apt-get install package_name:安装软件包
sudo apt-get remove package_name:卸载软件包
sudo apt-get autoremove:自动清除无用依赖项
sudo apt-get purge package_name:卸载软件及其相关配置文件

nginx的配置文件

nginx的配置文件和静态资源文件分布位置:

/usr/sbin/nginx:主程序
/etc/nginx:存放配置文件(nginx.conf)
/usr/share/nginx:存放静态文件
/var/log/nginx:存放日志

本次实验将配置文件放到/etc/nginx/configs下:
为了操作方便我将切换到了超级用户:

sudo su
cd /etc/nginx
mkdir configs

最初的/etc/nginx目录下的文件状态如下:
在这里插入图片描述
创建文件夹configs用于存放nginx的配置文件:
在这里插入图片描述
配置文件相关注释:
在这里插入图片描述
以下是学习项目的一个配置:


#user  nobody;
worker_processes  1;

#error_log  logs/error.log;
#error_log  logs/error.log  notice;
#error_log  logs/error.log  info;

#pid        logs/nginx.pid;


events {
    worker_connections  1024;
}


http {
    include       mime.types;
    default_type  application/octet-stream;

    #log_format  main  '$remote_addr - $remote_user [$time_local] "$request" '
    #                  '$status $body_bytes_sent "$http_referer" '
    #                  '"$http_user_agent" "$http_x_forwarded_for"';

    #access_log  logs/access.log  main;

    sendfile        on;
    #tcp_nopush     on;

    #keepalive_timeout  0;
    keepalive_timeout  65;

    #gzip  on;
	
	map $http_upgrade $connection_upgrade{
		default upgrade;
		'' close;
	}

	upstream webservers{
	  server 127.0.0.1:8080 weight=90 ;
	  #server 127.0.0.1:8088 weight=10 ;
	}

    server {
        listen       80;
        server_name  localhost;

        #charset koi8-r;

        #access_log  logs/host.access.log  main;

        location / {
            root   html/sky;
            index  index.html index.htm;
        }

        #error_page  404              /404.html;

        # redirect server error pages to the static page /50x.html
        #
        error_page   500 502 503 504  /50x.html;
        location = /50x.html {
            root   html;
        }

        # 反向代理,处理管理端发送的请求
        location /api/ {
			proxy_pass   http://localhost:8080/admin/;
            #proxy_pass   http://webservers/admin/;
        }
		
		# 反向代理,处理用户端发送的请求
        location /user/ {
            proxy_pass   http://webservers/user/;
        }
		
		# WebSocket
		location /ws/ {
            proxy_pass   http://webservers/ws/;
			proxy_http_version 1.1;
			proxy_read_timeout 3600s;
			proxy_set_header Upgrade $http_upgrade;
			proxy_set_header Connection "$connection_upgrade";
        }

        # pass the PHP scripts to FastCGI server listening on 127.0.0.1:9000
        #
        #location ~ \.php$ {
        #    root           html;
        #    fastcgi_pass   127.0.0.1:9000;
        #    fastcgi_index  index.php;
        #    fastcgi_param  SCRIPT_FILENAME  /scripts$fastcgi_script_name;
        #    include        fastcgi_params;
        #}

        # deny access to .htaccess files, if Apache's document root
        # concurs with nginx's one
        #
        #location ~ /\.ht {
        #    deny  all;
        #}
    }


    # another virtual host using mix of IP-, name-, and port-based configuration
    #
    #server {
    #    listen       8000;
    #    listen       somename:8080;
    #    server_name  somename  alias  another.alias;

    #    location / {
    #        root   html;
    #        index  index.html index.htm;
    #    }
    #}


    # HTTPS server
    #
    #server {
    #    listen       443 ssl;
    #    server_name  localhost;

    #    ssl_certificate      cert.pem;
    #    ssl_certificate_key  cert.key;

    #    ssl_session_cache    shared:SSL:1m;
    #    ssl_session_timeout  5m;

    #    ssl_ciphers  HIGH:!aNULL:!MD5;
    #    ssl_prefer_server_ciphers  on;

    #    location / {
    #        root   html;
    #        index  index.html index.htm;
    #    }
    #}

}

创建并写入配置文件:

cd configs
touch test.conf
gedit test.conf

将我们添加的配置导入到nginx的配置中:

cd /etc/nginx
vim nginx.conf

添加:include /etc/nginx/configs/*.conf;
在这里插入图片描述

nginx相关命令

启动:

systemctl start nginx

停止:

systemctl stop nginx

重启:

systemctl reload nginx

查看nginx的启停状态:(如果正常启动,会看到绿色的Runing)

systemctl status nginx

如:
在这里插入图片描述
访问localhost(默认80端口)
在这里插入图片描述

部署前端项目

我第二天重启nginx的时候,发现它报错如work_process,events相关的错误,应该是configs下的test.conf与/etc/nginx/nginx.conf中的内容发生了冲突,所以我直接将test.conf的内容(见上面)复制在nginx.conf中,才重启成功。

路径相关配置:在配置文件中将以下路径改为你自己的打包好后的前端代码所在路径:

location / {
            root   /path/webcode;
            index  index.html index.htm;
        }

修改路径后,重启nginx。
按理说,这时我们访问localhost的时候就会访问前端代码的index文件。但是我的是403 Forbidden。
我修改了以下两个配置才能正常访问:
一、使nginx的启动用户和nginx的工作用户一致:
查看当前nginx的启动用户

ps aux|grep nginx

在这里插入图片描述
发现nginx的工作用户为nobody,所以再次修改配置文件中的启动文件:
在这里插入图片描述
再次查看:
在这里插入图片描述
二、修改用户对前端文件的访问权限:

chmod -R 755 /path/webcode

在这里插入图片描述
最后终于能正常访问了,暂时就踩了这些坑,完美撒花~

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mfbz.cn/a/206042.html

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

解决:ModuleNotFoundError: No module named ‘xlrd‘

解决:ModuleNotFoundError: No module named ‘xlrd’ 文章目录 解决:ModuleNotFoundError: No module named xlrd背景报错问题报错翻译报错位置代码报错原因解决方法今天的分享就到此结束了 背景 在使用之前的代码时,报错: pin_r…

C 中的结构 - 存储、指针、函数和自引用结构

0. 结构体的内存分配 当声明某种类型的结构变量时,结构成员被分配连续(相邻)的内存位置。 struct student{char name[20];int roll;char gender;int marks[5];} stu1; 此处,内存将分配给name[20]、roll、gender和marks[5]。st1这…

11-30 JavaWeb

修改与删除操作 防止空指针异常 localhost:8080 -> 分页查询 修改流程:(先查后改(两个servlet)) 修改: 传用户id(用户id怎么得到 -> 循环一次得到一个user 对象 user对象里用user.getId()得到用户id) UpdateUserQueryServlet.java (…

「Verilog学习笔记」状态机-重叠序列检测

专栏前言 本专栏的内容主要是记录本人学习Verilog过程中的一些知识点,刷题网站用的是牛客网 读入数据移位寄存,寄存后的数据与序列数做对比,相等则flag为1,不等则为0 timescale 1ns/1nsmodule sequence_test2(input wire clk ,in…

计网Lesson5 - MAC 地址与 ARP

文章目录 M A C MAC MAC 地址1. M A C MAC MAC 地址的格式 2. M A C MAC MAC 地址的获取3. A R P ARP ARP 协议4. A R P ARP ARP 缓存5. R A R P RARP RARP M A C MAC MAC 地址 1. M A C MAC MAC 地址的格式 每个网卡都有一个 6 6 6 字节的 M A C MAC MAC 地址 M A C…

最大公约数的C语言实现xdoj31

时间限制: 1 S 内存限制: 1000 Kb 问题描述: 最大公约数(GCD)指某几个整数共有因子中最大的一个,最大公约数具有如下性质, gcd(a,0)a gcd(a,1)1 因此当两个数中有一个为0时,gcd是不为0的那个整数&#xff…

ios 逆向分分析,某业帮逆向算法(一)

用到工具: 爱思助手CrackerXL(砸壳软件)越狱手机ida反汇编软件分析login 的sign 签名算法中自己写算法 已知我们32位,我们不妨猜测是md5 ,那我们试图使用CC_MD5 ,这个是ios 中的标准库, 我们使用frida-trace 注入hook一下,看看有没有 经过 是经过了这个函数,密码也是…

计算机服务器中了_locked勒索病毒如何处理,_locked勒索病毒解密数据恢复

网络技术的不断发展,给企业的生产生活提供了极大便利,越来越多的企业走向数字化办公时代,但网络的发展也为网络安全埋下隐患,网络安全威胁不断增加。近期,云天数据恢复中心陆续接到很多企业的求助,企业的计…

FO-like Transformation Oracle Cloning

参考文献: [RS91] Rackoff C, Simon D R. Non-interactive zero-knowledge proof of knowledge and chosen ciphertext attack[C]//Annual international cryptology conference. Berlin, Heidelberg: Springer Berlin Heidelberg, 1991: 433-444.[BR93] Bellare M…

网狐类源码游戏配置数据库数据(一键配置网狐数据库)

网狐类源码游戏配置数据库数据(一键配置网狐数据库) 一般拿到网狐的源码或组件,需要先附加或配置数据库,以下为全部需要更改数据的地方,这里以荣耀系列版本数据库为例: 1. 数据库设置 [RYPlatformDB].…

appium :输入框控件为android.view.View 时输入内容(如:验证码、密码输入框)

问题背景 输入密码的组件信息为&#xff1a;<android.view.View resource-id“com.qq.ac.android:id/pwd_input”> 由于输入框控件是android.view.View&#xff0c;不是android.widget.EditText&#xff0c;所以只能点击&#xff0c;而启动appium后&#xff0c;会将输入…

华为全屋智能5.0,无为而“智”

在赖特西塔里埃森混凝土墙的中心壁龛里&#xff0c;一块铜牌上刻着一些英文&#xff0c;意思是“建筑的意义不是屋顶和墙&#xff0c;而是人们生活于其中的空间”。 这句话&#xff0c;取自老子《道德经》中的“凿户牖以为室&#xff0c;当其无&#xff0c;有室之用”。 《理想…

知乎禁止转载的回答怎么复制做笔记?

问题 对于“禁止转载”的回答&#xff0c;右键复制是不行的&#xff0c;ctrl-c也不行&#xff0c;粘贴之后都是当前回答的标题。稍微看了代码&#xff0c;应该是对copy事件进行了处理。不过这样真的有用吗&#xff0c;真是防君子不防小人&#xff0c;只是给收集资料增加了许多…

osgFX扩展库-刻线特效、立方图镜面高光特效(2)

刻线特效 刻线特效(osgFX::Scribe)是一个双通道的特效&#xff0c;第一个通道以通常的方式渲染图形&#xff0c;第二个通道使用线框模式。用户设置好光照和材质之后&#xff0c;即可使用指定的颜色进行渲染。这个特效使用了PolygonOffset渲染属性类来避免多边形斑驳(Z-fighting…

【多传感器融合】BEVFusion: 激光雷达和视觉融合框架 NeurIPS 2022

前言 BEVFusion其实有两篇&#xff0c; 【1】BEVFusion: A Simple and Robust LiDAR-Camera Fusion Framework. NeurIPS 2022 | 北大&阿里提出 【2】BEVFusion: Multi-Task Multi-Sensor Fusion with Unified Bird’s-Eye View Representation 2022 | MIT提出 本文先分…

Constraintlayout

goneMargin 约束的View隐藏时的margin 约束链风格 chainStyle 权重 bias 设置宽高比 w,h 百分比 GuideLine 基线 上下的间距 Group 指定一系列View进行绑定进行操作 通过init加载 然后setIds进行绑定 然后通过group进行操作 Layer 设置动画 Barrier Flow

【猜数字游戏】用wxPython实现:基本的游戏框架 + 简单的图形用户界面

【猜数字游戏】 写在最前面猜数字游戏 实现【猜数字游戏】安装wxPython全部代码代码解析1. 初始化界面2. 生成随机数3. 处理猜测4. 特殊功能5. 分数计算 游戏小程序呈现结语 写在最前面 看到了一个比较有意思的问题 https://ask.csdn.net/questions/8038039 猜数字游戏 在这…

【模电】放大电路的性能指标

放大电路的性能指标 放大倍数输入电阻输出电阻通频带非线性失真系数最大不失真输出电压最大输出功率与效率 下图所示为放大电路的示意图。 对于信号而言&#xff0c;任何一个放大电路均可看成一个两端口网络。左边为输入端口&#xff0c;当内阻为 R s R\tiny s Rs的正弦波信号…

【Java 并发编程】进程线程、lock、设计模式、线程池...

博主&#xff1a;_LJaXi Or 東方幻想郷 专栏&#xff1a; Java | 从入门到入坟 Java 并发编程 并发编程多线程的入门类和接口线程组和线程优先级线程的状态及主要转化方法线程间的通信重排序和 happens-beforevolatilesynchronized 与锁CAS 与原子操作AQS计划任务Stream 并行计…

uc_09_创建新进程 exec() system()

1 什么是创建新进程(夺舍) 在前面文章中&#xff0c;我们学习了fork()函数用来创建子进程。 子进程是父进程的副本&#xff0c;复制父进程除代码段以外的其他数据&#xff0c;代码段数据和父进程共享。 子进程的PID与父进程不同&#xff1a; 而创建新进程则不同。 与fork()不同…