当前位置: 首页>编程语言>正文

nginx前端页面执行shell脚本 nginx部署前端项目放在哪里

nginx简介

 

参照百度百科

Nginx (engine x) 是一个高性能的HTTP和反向代理web服务器,同时也提供了IMAP/POP3/SMTP服务。Nginx是由伊戈尔·赛索耶夫为俄罗斯访问量第二的Rambler.ru站点(俄文:Рамблер)开发的,第一个公开版本0.1.0发布于2004年10月4日。

其将源代码以类BSD许可证的形式发布,因它的稳定性、丰富的功能集、示例配置文件和低系统资源的消耗而闻名。2011年6月1日,html" class="superseo">nginx 1.0.4发布。

Nginx是一款轻量级的Web 服务器/反向代理服务器及电子邮件(IMAP/POP3)代理服务器,在BSD-like 协议下发行。其特点是占有内存少,并发能力强,事实上nginx的并发能力在同类型的网页服务器中表现较好,中国大陆使用nginx网站用户有:百度、京东、新浪、网易、腾讯、淘宝等。

优点

Nginx 可以在大多数 Unix Linux OS 上编译运行,并有 Windows 移植版。 Nginx 的1.19.2稳定版已经于2020年8月11日发布,一般情况下,对于新建站点,建议使用最新稳定版作为生产版本,已有站点的升级急迫性不高。Nginx 的源代码使用 2-clause BSD-like license。

Nginx 是一个很强大的高性能Web和反向代理服务,它具有很多非常优越的特性:

在连接高并发的情况下,Nginx是Apache服务不错的替代品:Nginx在美国是做虚拟主机生意的老板们经常选择的软件平台之一。能够支持高达 50,000 个并发连接数的响应,感谢Nginx为我们选择了 epoll and kqueue作为开发模型。

服务器

Nginx作为负载均衡服务:Nginx 既可以在内部直接支持 Rails 和 PHP 程序对外进行服务,也可以支持作为 HTTP代理服务对外进行服务。Nginx采用C进行编写,不论是系统资源开销还是CPU使用效率都比 Perlbal 要好很多。

处理静态文件,索引文件以及自动索引;打开文件描述符缓冲。

无缓存的反向代理加速,简单的负载均衡和容错。

FastCGI,简单的负载均衡和容错。

模块化的结构。包括 gzipping, byte ranges, chunked responses,以及 SSI-filter 等 filter。如果由 FastCG或其它代理服务器处理单页中存在的多个 SSI,则这项处理可以并行运行,而不需要相互等待。

支持 SSL 和 TLSSNI。 [2]

代码

Nginx代码完全用C语言从头写成,已经移植到许多体系结构和操作系统,包括:Linux、FreeBSD、Solaris、Mac OS X、AIX以及Microsoft Windows。Nginx有自己的函数库,并且除了zlib、PCRE和OpenSSL之外,标准模块只使用系统C库函数。而且,如果不需要或者考虑到潜在的授权冲突,可以不使用这些第三方库。

代理服务器

作为邮件代理服务:Nginx 同时也是一个非常优秀的邮件代理服务(最早开发这个产品的目的之一也是作为邮件代理服务器),Last.fm 描述了成功并且美妙的使用经验。

Nginx 是一个安装非常的简单、配置文件非常简洁(还能够支持perl语法)、Bug非常少的服务。Nginx 启动特别容易,并且几乎可以做到7*24不间断运行,即使运行数个月也不需要重新启动。你还能够不间断服务的情况下进行软件版本的升级。

功能

支持操作系统

  • FreeBSD 3— 10 / i386; FreeBSD 5— 10 / amd64;
  • Linux 2.2— 4 / i386; Linux 2.6— 4 / amd64; Linux 3— 4 / armv6l, armv7l, aarch64;
  • Solaris 9 / i386, sun4u; Solaris 10 / i386, amd64, sun4v;
  • AIX 7.1 / powerpc;
  • HP-UX 11.31 / ia64;
  • Mac OS X / ppc, i386;
  • Windows XP, Windows Server 2003,Windows 10

可见,nginx功能还是很强大的,下文讲述的部署方法,支持多系统服务器(如: linux、windows、mac等),同时也可以部署多种框架的前端项目(如: vue、react、jq等)

看到这里,相信大家对nginx有了一定了解~

接下来小编以Linux为例,来说说nginx如何部署前端页面

nginx安装

可参考

Linux系统nginx安装说明(在线/离线安装)_小慌慌的博客

检查nginx是否安装成功

访问:http://ip/,默认端口80,成功打开nginx默认页面,说明nginx启动成功。如下图所示:

nginx前端页面执行shell脚本 nginx部署前端项目放在哪里,nginx前端页面执行shell脚本 nginx部署前端项目放在哪里_Nginx,第1张

nginx部署前端页面

 1. 安装路径:/usr/local/nginx

 2. 在/usr/local/nginx目录下有个 html文件夹,这个html文件夹就是放置要部署的前端项目的地方。(同理,其他系统的服务器也找到这个路径,MAC的是在 usr/local/var/www /下,把要部署的前端项目放入即可。)

html 文件夹里面的 index.html 和 50x.html 是 nginx 自带的。index.html 就是 nginx 的欢迎页面,一般用来判断 nginx 是否启动成功。50x.html 页面就是报错页面。

 3. 修改配置 /usr/local/nginx/nginx.conf 文件(介绍多种方法)

   3.1 配置 /dist/index.html。这种配置是访问的81端口下的子目录dist,记得修改vue项目里面的 assetsPublicPath 和 router的 base 为 dist。

         3.1.1 dist 文件夹是一个打包之后的 vue 项目。把dist文件夹放到/usr/local/nginx/html下。浏览器访问:http://ip:81/dist/

#dist文件配置
#浏览器访问:http://ip:81/dist/

 server {
        listen       81;
        server_name  localhost;
        location /dist {
            root   html;
            index  /dist/index.html;
        }
    }

   3.1.2 配置 /dist/。这种配置是访问的82端口下dist项目。把dist文件夹放到/usr/local/nginx/下。浏览器访问:http://ip:82/

#浏览器访问:http://ip:82/
 server {
        listen       82;
        server_name  localhost;
        location / {
            root   /usr/local/nginx/dist;
            index  index.html index.htm;
        }
    }

   3.2 其他框架项目配置也类似,如配置 /test/web.html。

#法1:浏览器访问 http://ip:83/
 server {
        listen       83;
        server_name  localhost;

        location / {
            root   /usr/local/nginx/html/test;
            index  web.html;
        }
    }

#法2:浏览器访问 http://ip:83/
 server {
        listen       83;
        server_name  localhost;
        root   /usr/local/nginx/html/test;

    }
#---------------------------------------
#法3:浏览器访问 http://ip:84/test
 server {
        listen       84;
        server_name  localhost;
        location /test {
            root   html;
            index  /test/web.html;
        }
    }

4. 修改完nginx配置,可以先检查nginx的配置,再重启nginx即可。

测试命令

/usr/local/nginx/sbin/nginx -t

重启命令

/usr/local/nginx/sbin/nginx -s  reload

以上就是linux系统下nginx部署前端页面的多种方法介绍

补充,Mac系统下nginx部署前端页面

如果服务器是mac系统,前端项目如果没有放在nginx的/var/www/目录下的话,访问时可能会报错,如果nginx配置是没错的话,报错的日志就可能是没有权限,如下:

 [error] 37614#0: *13 "/Users/admin/Desktop/test/web.html" is forbidden (13: Permission denied), client: 127.0.0.1, server: localhost, request: "GET / HTTP/1.1", host: "localhost:85"

2个解决方案:

1. 重新安装 homebrew

2. 修改mac系统的权限配置

【建议】Mac系统下最好把被部署的项目直接放到 /var/www/ 目录下即可。因为这个目录就是nginx默认的,就不会有权限问题。


https://www.xamrdz.com/lan/5mq1963043.html

相关文章: