nginx配置文件和跨域问题一、nginx 1. 关于nginx配置文件 2. location & proxy_pas

一、nginx

1. 关于nginx配置文件

server {
        listen       8000;
        server_name  localhost; # 标表示监听的主机地址是什么
        # / 表示匹配路径为/的url
        location / {
           proxy_pass http://localhost:5500;
        }
 
        # /user 表示访问以/user 开头 的地址 如/username,/user/find等
        location /user {
           proxy_pass http://localhost:3000;
        }
 
    }

server：就相当于一台虚拟主机，一个虚拟主机在抽象的服务中就相当于一条主机，一个nginx可以配置多台虚拟主机

listen：表示监听来自某个服务的请求

listen 127.0.0.1:8000 【只监听来自127.0.0.1这个ip，请求8000的端口号】

listen 127.0.0.1; 【只监听来自127.0.0.1这个ip，请求80端口的请求（指定端口，默认是80）】

listen 8000; 【监听来自所有ip，请求8000的端口】

listen *:8000; 【和上面效果一样】

listen localhost:8000; 【和第一种效果一样】

小结：listen监听的是向当前nginx所在主机发送的请求

server_name：表示当前这台虚拟主机的主机名

2. location & proxy_pass

这个主要问题，就是关于 location 和 proxy_pass 后面加上斜杠的区别和组合

举例：

nginx服务器及端口 127.0.0.1:80

后端服务：127.0.0.1:8080

测试：url -> http://127.0.0.1:80/day06api/api/abc

location /day06api/ {
   proxy_pass http://127.0.0.1:8080/;
}
# 实际访问地址：http://127.0.0.1:8080/api/abc

location /day06api {
   proxy_pass http://127.0.0.1:8080/;
}
# 实际访问地址：http://127.0.0.1:8080//api/abc

location /day06api/ {
   proxy_pass http://127.0.0.1:8080;
}
#实际访问地址：http://127.0.0.1:8080/day06api/api/abc

location /day06api {
   proxy_pass http://127.0.0.1:8080;
}
#实际访问地址：http://127.0.0.1:8080/day06api/api/abc

location /day06api/ {
   proxy_pass http://127.0.0.1:8080/server/;
}
#实际访问地址：http://127.0.0.1:8080/server/api/abc

location /day06api {
   proxy_pass http://127.0.0.1:8080/server/;
}
#实际访问地址：http://127.0.0.1:8080/server//api/abc

location /day06api/ {
   proxy_pass http://127.0.0.1:8080/server;
}
#实际访问地址：http://127.0.0.1:8080/serverapi/abc

location /day06api {
   proxy_pass http://127.0.0.1:8080/server;
}
#实际访问地址：http://127.0.0.1:8080/server/api/abc

如果 proxy_pass 端口号之后有斜杠，就是将原来的url中uri部分去掉 location 部分字符，拼接在 proxy_pass 后面

如果 proxy_pass 端口号之后没有斜杠，就是使用 proxy_pass 中的ip和端口号替代原来 url 中的ip和端口号

二、关于跨域问题

问题产生的原因：

是因为前后端分离，浏览器中前端页面的（协议 || ip || 端口号）和向后端发送的请求中（协议 || ip || 端口号）中任何一个不同造成的

解决问题的方法：

将前后端都通过代理的方式进行访问，使用nginx

例子：

前端页面是127.0.0.1:9012/front/show

向后端发送请示：127.0.0.1:8021/behind/test1

这个时候前台向后台发送请求，因为跨域问题，浏览器会报错，无法进行访问

#配置nginx
server {
        listen       9003;
        server_name  localhost; # 标表示监听的主机地址是什么
        # / 表示匹配路径为/的url
        location /front {
           proxy_pass http://127.0.0.1:9012/front;
        }
 
        # /user 表示访问以/user 开头 的地址 如/username,/user/find等
        location /behind {
           proxy_pass http://127.0.0.1:8021/behind;
        }
 
    }

小结：跨域问题，是因为浏览器防止不同源网站可以互相访问缓存信息而产生的