Linux使用Nginx代理是很常见的方式,但是对于运维方面不是很熟悉的开发者来说,用Nginx转发后台接口这些配置起来让人头疼阿~

首先不管是Centos还是Ubuntu 使用命令行安装好Nginx后,默认的配置文件都是在 /etc/nginx 下,进入此目录可以看到默认的配置文件 nginx.conf ,注意图中红色框框的地方

打开nginx.conf 可以看见两行配置如下:

include /etc/nginx/conf.d/*.conf;
include /etc/nginx/sites-enabled/*;

意思就是在 conf.d 或者 sites-enabled 目录下都可以配置自定义配置,conf.d是空文件,sites-enabled是有个默认的配置

我们一般在conf.d增加一个配置文件就可以啦,在这里笔者增加一个vue前端请求Javaweb接口的转发,配置文件名自定义,以.conf结尾就行。如下配置:

server {
    listen 80 default_server;
    server_name _;
    listen [::]:80 default_server;
    root /home/ubuntu/dice-demo/dist;
    index index.html index.htm index.nginx-debian.html;
    location /apis {
        proxy_set_header   Host             $host;
        proxy_set_header   X-Real-IP        $remote_addr;
        proxy_set_header   X-Forwarded-For  $proxy_add_x_forwarded_for;
        proxy_pass http://localhost:8080/api/;
    }
}

这里表示监听80端口,root 后面的路径的静态文件的目录,即表示访问服务器IP或者域名,就会自动跳转到 你的网站首页。

location /apis 表示请求路径中带有 apis的都会被转发到 8080/api 这个前缀开头的接口地址。

笔者这里的apis是vue前端统一路由发出的http请求,apis后面的url在这里会自动被填充到 api/后面,所以 前端和后端部署在同一台服务器, 只是用Nginx代理转发,把前端的请求转发到对应的接口地址上,从而实现前后端数据交互。

 

GitHub 加速计划 / li / linux-dash
10.39 K
1.2 K
下载
A beautiful web dashboard for Linux
最近提交(Master分支:2 个月前 )
186a802e added ecosystem file for PM2 4 年前
5def40a3 Add host customization support for the NodeJS version 4 年前
Logo

旨在为数千万中国开发者提供一个无缝且高效的云端环境,以支持学习、使用和贡献开源项目。

更多推荐