前后端网站部署 Nginx 配置

看大家的教程，大家的Nginx似乎都是在 nginx.conf 这个文件配置，但是在我的 Nginx 中，除了 nginx.conf 之外，在/etc/nginx/conf.d下面还有一个 default.conf 文件。在里面修改配置可以让我的 Nginx 生效。

我的应用的状况是：后台是 EggJS，运行在 127.0.0.1:3030，前端静态文件希望通过80端口访问。要让前端代码在浏览器访问的时候可以正确拿到数据。下面是我的 Nginx 配置：

server {
    listen       80;
    server_name  localhost;

    location / {
        # 这里放的是前端静态文件，即访问 IP:80 时返回的 index.html
        root   /usr/share/nginx/html/dist;
        index  index.html index.htm;
    }
    # 当页面调动 /api/* 接口时，自动将请求转到 3030端口
    location /api {
        proxy_http_version 1.1;
        proxy_pass http://127.0.0.1:3030;
        proxy_set_header Upgrade $http_upgrade;
        proxy_set_header Connection "Upgrade";
        proxy_redirect default;
    }
     # 当页面调动 /musicApi 接口时，自动将请求转到 http://123.56.221.77 端口，这是远程的IP地址
    location /musicApi {
        proxy_http_version 1.1;
        proxy_pass http://123.56.221.77;
        proxy_set_header Upgrade $http_upgrade;
        proxy_set_header Connection "Upgrade";
        proxy_redirect default;
    }
}

特别要注意的是，代码中请求的 API 地址中，端口只要是80就可以，不需要在代码中将调用地址写为 127.0.0.1/api/:3030，直接写127.0.0.1/api即可。这样的接口才是访问80端口，才能被 Nginx 代理到，让 Nginx 把请求代理到 proxy_pass 指定的地址。

参考资料：
egg部署后怎么用nginx反向代理？ - CNode技术社区
前端必须知道的Nginx的常用配置 - 个人文章 - SegmentFault 思否