文章目录
- 1.了解正向代理和反向代理
- 1.1 正向代理
- 1.2 反向代理
- 2. 安装Nginx
- 3. 配置Nginx
- 3.1 打开nginx-1.18.0\conf\nginx.conf进行配置
- 3.2 优化配置代码
- 3.3 使用环境
- 3.4 开始配置
- 3.5 修改axios的baseURL
- 3.6 大功告成~
- 3.7 问题
- 参考文章:
1.了解正向代理和反向代理
1.1 正向代理
代理是在服务器和客户端之间假设的一层服务器,代理将接收客户端的请求并将它转发给服务器,然后将服务端的响应转发给客户端。
正向代理是为我们服务的,即为客户端服务的,客户端可以根据正向代理访问到它本身无法访问到的服务器资源。
正向代理对我们是透明的,对服务端是非透明的,即服务端并不知道自己收到的是来自代理的访问还是来自真实客户端的访问。
1.2 反向代理
反向代理是为服务端服务的,反向代理可以帮助服务器接收来自客户端的请求,帮助服务器做请求转发,负载均衡等。
反向代理对服务端是透明的,对我们是非透明的,即我们并不知道自己访问的是代理服务器,而服务器知道反向代理在为他服务。
2. 安装Nginx
Nginx官网下载稳定版本,解压即可食用,双击nginx.exe即可
浏览器打开http://localhost:80,如出现
则安装成功
3. 配置Nginx
3.1 打开nginx-1.18.0\conf\nginx.conf进行配置
3.2 优化配置代码
- 第一个location中的root和index字段可以删掉
- 红框中的error_page和它下面的location也可以删掉
删除上述两项后的代码如下,
3.3 使用环境
我的前端服务地址:http://localhost:8082
后端egg服务地址:http://127.0.0.1:7001
两个服务都已经启动,现在请求会发生跨域
之前有用proxy解决跨域,proxy解决跨域
3.4 开始配置
在nginx-1.18.0\conf\nginx.conf文件中location里面加上两个字段:
events {
worker_connections 1024;
}
http {
include mime.types;
default_type application/octet-stream;
sendfile on;
keepalive_timeout 65;
server {
listen 80;
server_name localhost;
// 这里加字段
location / {
proxy_pass http://127.0.0.1:7001; // 后端服务地址
add_header Access-Control-Allow-Origin *;
}
}
}
- proxy_pass,代表要代理的服务器端口
- add_header,添加 http 响应头,不加会报错,详细解释
- listen,代表监听的端口
3.5 修改axios的baseURL
这时候你的baseURL应该是http://localhost:80,记得重启nginx,在nginx.exe文件目录打开cmd命令行输入
nginx -s reload
3.6 大功告成~
如有不当,还请老哥指出
3.7 问题
2020/5/22 测出问题,无法携带token进行跨域 ×
参考文章:
面试题:nginx有配置过吗?反向代理知道吗?
nginx在应用程序中的作用