nginx基础使用及代理跨域

nginx 根目录
brew info nginx

一,下载解压(无需安装)

路径不能出现中文
下载地址

二,修改配置文件

根目录>conf>nginx.conf
server{}里面为一个服务,默认80,访问index.html

server {
        listen       5000;
        server_name  localhost;

        #charset koi8-r;

        #access_log  logs/host.access.log  main;

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

三,常见命令

启动

start nginx

查看进程

tasklist /fi "imagename eq nginx.exe"

修改配置文件之后的重启

nginx -s reload

快速停止

nginx -s stop

有序停止

nginx -s quit

以上说的是作为容器部署项目,现在说说利用nginx跨域

如果后台因为种种原因不能开放CORS,而jsonp又只能解决get请求
在vue项目中,开发环境我们可以配置node代理跨域
打包之后部署nginx反向代理跨域…

一,用node在本地起一个服务(端口为3000)

在这里插入图片描述

二,写一个简单的ajax请求,部署在nginx中(端口为5000)

在这里插入图片描述

三,发起请求后出现跨域问题

因为客户端在5000端口,服务端在3000端口
在这里插入图片描述

四,配置代理(nginx.conf)

将本服务器的地址转发为后台的接口地址,即可解决跨域

 listen       5000;
        server_name  localhost;

        #charset koi8-r;

        #access_log  logs/host.access.log  main;

        location / {
            root   html;
            index  index.html index.htm;
        }
          # 新加的
        location /api {
            proxy_pass   http://localhost:3000; # 后端接口 IP:port
        }

修改一下地址
在这里插入图片描述

五,前端跨域成功

在这里插入图片描述
看看代理之后的地址
在这里插入图片描述
还有很多种配置代理跨域的方法 个人认为这种比较简单

有想换工作的同学可以找我内推哦不低于15k(前端,java,测试)

在这里插入图片描述