配置Nginx的location

1.概述location匹配

参数名称	参数说明
=	精确匹配
~	区分大小写匹配
!~	区分大小写不匹配
~*	不区分大小写匹配
!~*	不区分大小写不匹配
^~	以什么字符开头的查询
@	服务跳转
*	匹配任意字符
\	转义字符
$	以什么字符结尾

2.克隆（Git clone）一个静态页面进行测试

#安装git工具
yum install git -y

#切换到nginx存放html目录下
cd /usr/local/nginx/html/

#克隆静态页面
git clone https://github.com/TheRoadTo/Cartoon-Page.git

#赋予所属用户和所属组的权限
chown -R  nginx:nginx /usr/local/nginx/html/Cartoon-Page/

#打开浏览器IP/Cartoon-Page/first.html，查看网页

3.配置nginx的location

vi /usr/local/nginx/conf/nginx.conf
server {
......
	location = / {
            proxy_pass  http://172.25.0.20:80/Cartoon-Page/first.html;
        }
    location / {
            root   html;
            index index.php index.html index.htm;
        }
......
}

#检查nginx配置文件
nginx -t
nginx: the configuration file /usr/local/nginx/conf/nginx.conf syntax is ok
nginx: configuration file /usr/local/nginx/conf/nginx.conf test is successful

#重启nginx服务
nginx -s reload

参数名称	参数说明
location = /	精确匹配到 /（根目录），相当于http://172.25.0.20:80 / （根目录）匹配以下的目录
proxy_pass	反向代理转发，相当于http://172.25.0.20:80/Cartoon-Page/first.html这个URL链接地址，会以它为访问的首页

#查看浏览器，用IP查看，可以匹配到首页，但是一些样式和图片无法匹配

vi /usr/local/nginx/conf/nginx.conf
server {
......
	location = / {
            proxy_pass  http://172.25.0.20:80/Cartoon-Page/first.html;
        }
    location ~* \.(jpg|png|jpeg|bmp|gif|swf|ico|txt|css|js)$ {
            root /usr/local/nginx/html/Cartoon-Page;
        }

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

#检查nginx配置文件
nginx -t
nginx: the configuration file /usr/local/nginx/conf/nginx.conf syntax is ok
nginx: configuration file /usr/local/nginx/conf/nginx.conf test is successful

#重启nginx服务
nginx -s reload

参数名称	参数说明
location ~* .(jpg|png|jpeg|bmp|gif|swf|ico|txt|css|js)$	不区分大小写匹配,相当于 http://172.25.0.20:80/Cartoon-Page/ * / 匹配以下后缀名的文件*.(jpg|png|jpeg|bmp|gif|swf|ico|txt|css|js)
root	指定文件路径有两种方式root和alias，root的路径是root路径＋location路径，alias的路径是alias路径替换location路径

#打开浏览器，用IP就可以浏览

#打开其他的链接，但是跳转不了

状态码名称	状态码说明
200	访问正常
301	永久重定向
302	临时跳转
403	拒绝访问
404	找不到文件
500	服务器内部错误
502	请求超时，这个在php-fpm最容易出现这种情况，需要优化php-fpm
504	和502类似

vi /usr/local/nginx/conf/nginx.conf
server {
......
	location = / {
            proxy_pass  http://172.25.0.20:80/first.html;
        }
    location ~* \.(jpg|png|jpeg|bmp|gif|swf|ico|txt|css|js)$ {
            root /usr/local/nginx/html/Cartoon-Page;
        }

    location / {
            autoindex on;
            root /usr/local/nginx/html/Cartoon-Page;
            index index.php index.html index.htm;
        }
......
}

#检查nginx配置文件
nginx -t
nginx: the configuration file /usr/local/nginx/conf/nginx.conf syntax is ok
nginx: configuration file /usr/local/nginx/conf/nginx.conf test is successful

#重启nginx服务
nginx -s reload

注意: 精确匹配的proxy_pass http://172.25.0.20:80/first.html;要去掉/Cartoon-Page，因为下面的/（根）匹配已经指定目录

参数名称	参数说明
autoindex on	开启目录浏览功能
root /usr/local/nginx/html/Cartoon-Page	指定/Cartoon-Page以下的Web目录

#点击其他链接

#成功打开，可以自动跳转链接

4.查看Web目录结构

#安装树状图列出目录
yum install tree -y

#查看树状图列出目录
tree /usr/local/nginx/html/Cartoon-Page/
/usr/local/nginx/html/Cartoon-Page/
├── css
│   ├── fifth.css
│   ├── first.css
│   ├── fourth.css
│   ├── second.css
│   └── third.css
├── fifth.html
├── first.html
├── fourth.html
├── image
│   ├── 01.jpg
│   ├── 02.jpg
│   ├── 03.jpg
│   ├── 0.jpg
│   ├── bg.png
│   ├── body.jpg
│   ├── content.jpg
│   ├── cotent_list.jpg
│   ├── head1.jpg
│   ├── head.jpg
│   ├── jq.jpg
│   ├── left2.jpg
│   ├── logo.png
│   ├── nav_bg.gif
│   ├── right.jpg
│   ├── search.jpg
│   └── yikan.png
├── README.md
├── second.html
└── third.html

文件名称	文件说明
*.html	为静态页面的主文件
*.css	为静态页面的样式文件
image	image目录为存放图片的目录
css	css目录为存放样式文件
README.md	自述文件（即讲解文件）