这是一个只会前端的后台小白日常杂记,工作闲时的自学经历,如有错误欢迎指正:
目标是3个Demo(Angular,Vue,React),用到的技术应该有:
后台:Nginx,Node,Express,PM2;(对后台没啥了解,用到再补充吧)
前端:Vue,VueX及一些相关技术;
万事开头难 首先第一件事是买台云服务器 因为以前用现有的服务器搭建了一个博客,怕弄乱了,这次趁着百度云优惠就又买了一台。
废话不多说,现在就开始吧。
前置要求:1H1G服务器一台(跑个小网站绰绰有余) 域名一个 满世界的特惠域名 随便买了一个练手
第一步:阅读大神写的nginx文档 http://www.nginx.cn/install 由于一时没找到官方写的nginx文档,没办法先用民间的吧,看评论都是说好的,作为小白没办法就硬着头皮上吧。(以下步骤多为参考该网站,侵删)。
第二步:看完了大神的文档 我们就开始操作吧!
首先在终端连接我们的服务器 ssh [email protected]
@后面的是我们的服务器外网地址。
连接成功后开始安装nginx
# 安装依赖
yum -y install gcc zlib zlib-devel pcre-devel openssl openssl-devel
# 下载nginx安装包
wget http://nginx.org/download/nginx-1.12.2.tar.gz
# 解压缩
tar -zxvf linux-nginx-1.12.2.tar.gz
cd nginx-1.12.2/
# 执行配置
./configure
# 编译安装(默认安装在/usr/local/nginx)
make
make install
防火墙配置
nginx默认监听80端口,如果未关闭防火墙需要配置iptables规则开放80端口(以centos6为例)。
编辑配置文件:vim /etc/sysconfig/iptables
在文件中间添加iptables规则
-A INPUT -m state --state NEW -m tcp -p tcp --dport 80 -j ACCEPT
重启防火墙:service iptables restart
或者关闭iptables规则:iptables -F && iptables -t nat -F
Nginx验证
nginx主配置文件:/usr/local/nginx/conf/nginx.conf
nginx日志文件:/usr/local/nginx/logs/access.log
启动Nginx:sudo /usr/local/nginx/sbin/nginx
Nginx常用命令
测试配置文件:${Nginx}/sbin/nginx -t
启动命令:${Nginx}/sbin/nginx
停止命令:${Nginx}/sbin/nginx -s stop/quit
重启命令:${Nginx}/sbin/nginx -s reload
查看进程命令:ps -ef | grep nginx
平滑重启:kill -HUP [Nginx主进程号(即ps命令查到的PID)]
也可建立软连接
ln -s /usr/local/nginx/sbin/nginx /usr/local/sbin/
nginx -t
好了,现在我们的nginx安装好了!
这时想到公司的不同网站都是在同一个主域名下,通过子域名进行区分,该如何配置呢?
经过度娘的百般折磨后 我找到了配置的方法。
首先我们来到nginx的配置目录下
我们可以看到目录下有这些文件
用vi编辑器打开配置文件
vi nginx.conf
以下是添加注释后的文件
# 运行用户
#user nobody;
#启动进程,通常设置成和cpu的数量相等
worker_processes 1;
#全局错误日志及PID文件
#error_log logs/error.log;
#error_log logs/error.log notice;
#error_log logs/error.log info;
#pid logs/nginx.pid;
#工作模式及连接数上限
events {
#单个后台worker process进程的最大并发链接数
worker_connections 1024;
# 根据大神的说法
# 并发总数是 worker_processes 和 worker_connections 的乘积
# 即 max_clients = worker_processes * worker_connections
# 在设置了反向代理的情况下,max_clients = worker_processes * worker_connections / 4 为什么
# 为什么上面反向代理要除以4,应该说是一个经验值
# 根据以上条件,正常情况下的Nginx Server可以应付的最大连接数为:4 * 8000 = 32000
# worker_connections 值的设置跟物理内存大小有关
# 因为并发受IO约束,max_clients的值须小于系统可以打开的最大文件数
# 而系统可以打开的最大文件数和内存大小成正比,一般1GB内存的机器上可以打开的文件数大约是10万左右
# 我们来看看360M内存的VPS可以打开的文件句柄数是多少:
# $ cat /proc/sys/fs/file-max
# 输出 34336
# 32000 < 34336,即并发连接总数小于系统可以打开的文件句柄总数,这样就在操作系统可以承受的范围之内
# 所以,worker_connections 的值需根据 worker_processes 进程数目和系统可以打开的最大文件总数进行适当地进行设置
# 使得并发总数小于操作系统可以打开的最大文件数目
# 其实质也就是根据主机的物理CPU和内存进行配置
# 当然,理论上的并发总数可能会和实际有所偏差,因为主机还有其他的工作进程需要消耗系统资源。
# ulimit -SHn 65535
}
http {
#设定mime类型,类型由mime.type文件定义
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 指令指定 nginx 是否调用 sendfile 函数(zero copy 方式)来输出文件,
#对于普通应用,必须设为 on,
#如果用来进行下载等应用磁盘IO重负载应用,可设置为 off,
#以平衡磁盘与网络I/O处理速度,降低系统的uptime.
sendfile on;
#tcp_nopush on;
#连接超时时间
#keepalive_timeout 0;
keepalive_timeout 65;
#开启gzip压缩
gzip on;
# gzip_disable "MSIE [1-6].";
#设定虚拟主机配置
server {
#侦听80端口
listen 80;
#定义使用 www.dev.xxxxxxxx.cn访问
server_name www.dev.xxxxxxxx.cn;
#默认请求
location / {
#根路径配置
root html;
#定义首页索引文件的名称
index dev.html dev.htm;
}
# 定义错误提示页面
error_page 500 502 503 504 /50x.html;
location /50x.html{
root html;
}
}
server {
listen 80;
server_name www.test.xxxxxxx.cn;
#charset koi8-r;
#access_log logs/host.access.log main;
root /www;
location /test {
index index.html index.htm;
}
location / {
index index.html index.htm;
}
#error_page 404 /404.html;
# redirect server error pages to the static page /50x.html
location /page {
root html;
index index.html index.htm;
}#
error_page 500 502 503 504 /50x.html;
location = /50x.html {
root html;
}
}
要想实现同一网址指向不同页面 有3种方案
方案1:监听不同的端口
server {
#侦听80端口
listen 80;
#定义使用 www.dev.xxxxxxxx.cn访问
server_name www.dev.xxxxxxxx.cn;
#默认请求
location / {
#根路径配置
root html;
#定义首页索引文件的名称
index dev.html dev.htm;
}
# 定义错误提示页面
error_page 500 502 503 504 /50x.html;
location /50x.html{
root html;
}
}
server {
#侦听80端口
listen 8888;
#定义使用 www.dev.xxxxxxxx.cn访问
server_name www.dev.xxxxxxxx.cn;
#默认请求
location / {
#根路径配置
root html;
#定义首页索引文件的名称
index dev.html dev.htm;
}
# 定义错误提示页面
error_page 500 502 503 504 /50x.html;
location /50x.html{
root html;
}
}
方案2:使用不同的子域名
server {
#侦听80端口
listen 80;
#定义使用 www.dev.xxxxxxxx.cn访问
server_name www.dev.xxxxxxxx.cn;
#默认请求
location / {
#根路径配置
root html;
#定义首页索引文件的名称
index dev.html dev.htm;
}
# 定义错误提示页面
error_page 500 502 503 504 /50x.html;
location /50x.html{
root html;
}
}
server {
#侦听80端口
listen 80;
#定义使用 www.dev.xxxxxxxx.cn访问
server_name www.test.xxxxxxxx.cn;
#默认请求
location / {
#根路径配置
root html;
#定义首页索引文件的名称
index dev.html dev.htm;
}
# 定义错误提示页面
error_page 500 502 503 504 /50x.html;
location /50x.html{
root html;
}
}
方法3 配置location 见配置文件详解
location这就有点复杂了
nginx location指令详解
Nginx的HTTP配置主要包括三个区块,结构如下:
http { //这个是协议级别
include mime.types;
default_type application/octet-stream;
keepalive_timeout 65;
gzip on;
server { //这个是服务器级别
listen 80;
server_name localhost;
location / { //这个是请求级别
root html;
index index.html index.htm;
}
}
}
location区段
通过指定模式来与客户端请求的URI相匹配,基本语法如下:location [=||*|^~|@] pattern{……}
1、没有修饰符 表示:必须以指定模式开始,如:
server {
server_name baidu.com;
location /abc {
……
}
}
那么,如下是对的:
http://baidu.com/abc
http://baidu.com/abc?p1
http://baidu.com/abc/
http://baidu.com/abcde
2、=表示:必须与指定的模式精确匹配
server {
server_name sish
location = /abc {
……
}
}
那么,如下是对的:
http://baidu.com/abc
http://baidu.com/abc?p1
如下是错的:
http://baidu.com/abc/
http://baidu.com/abcde
3、~ 表示:指定的正则表达式要区分大小写
server {
server_name baidu.com;
location ~ ^/abc$ {
……
}
}
那么,如下是对的:
http://baidu.com/abc
http://baidu.com/abc?p1=11&p2=22
如下是错的:
http://baidu.com/ABC
http://baidu.com/abc/
http://baidu.com/abcde
4、~* 表示:指定的正则表达式不区分大小写
server {
server_name baidu.com;
location ~* ^/abc$ {
……
}
}
那么,如下是对的:
http://baidu.com/abc
http://baidu..com/ABC
http://baidu..com/abc?p1=11&p2=22
如下是错的:
http://baidu..com/abc/
http://baidu..com/abcde
5、^~ 类似于无修饰符的行为,也是以指定模式开始,不同的是,如果模式匹配,
那么就停止搜索其他模式了。
6、@ :定义命名location区段,这些区段客户段不能访问,只可以由内部产生的请
求来访问,如try_files或error_page等
查找顺序和优先级
1:带有“=“的精确匹配优先
2:没有修饰符的精确匹配
3:正则表达式按照他们在配置文件中定义的顺序
4:带有“^~”修饰符的,开头匹配
5:带有“~” 或“~*” 修饰符的,如果正则表达式与URI匹配
6:没有修饰符的,如果指定字符串与URI开头匹配
Location区段匹配示例
location = / {
# 只匹配 / 的查询.
[ configuration A ]
}
location / {
# 匹配任何以 / 开始的查询,但是正则表达式与一些较长的字符串将被首先匹配。
[ configuration B ]
}
location ^~ /images/ {
# 匹配任何以 /images/ 开始的查询并且停止搜索,不检查正则表达式。
[ configuration C ]
}
location ~* \.(gif|jpg|jpeg)$ {
# 匹配任何以gif, jpg, or jpeg结尾的文件,但是所有 /images/ 目录的请求将在Configuration C中处
理。
[ configuration D ]
} 各
请求的处理如下例:
■/ → configuration A
■/documents/document.html → configuration B
■/images/1.gif → configuration C
■/documents/1.jpg → configuration D
root 、alias指令区别
location /img/ {
alias /var/www/image/;
}
#若按照上述配置的话,则访问/img/目录里面的文件时,ningx会自动去/var/www/image/目录找文件
location /img/ {
root /var/www/image;
}
#若按照这种配置的话,则访问/img/目录下的文件时,nginx会去/var/www/image/img/目录下找文件。
proxy_pass
proxy_pass——反向代理配置,用于代理请求,适用于前后端负载分离或多台机器、服务器负载分离的场景,在匹配到location配置的URL路径后,转发请求到proxy_pass配置额URL,是否会附加location配置路径与proxy_pass配置的路径后是否有"/"有关,有"/"则不附加,如:
location /test/ {
proxy_pass http://127.0.0.1:8080/;
}
请求/test/1.jpg,将会被nginx转发请求到http://127.0.0.1:8080/1.jpg(未附加/test/路径)
--以上部分内容转载自 http://www.nginx.cn/install