前后端分离的前端是怎么部署到生产环境中的，直接通过 nginx 吗？

V2EX = way to explore

V2EX 是一个关于分享和探索的地方

现在注册

已注册用户请登录

推荐学习书目

› Learn Python the Hard Way

Python Sites

› PyPI - Python Package Index

› http://diveintopython.org/toc/index.html

› Pocoo

值得关注的项目

› PyPy

› Celery

› Jinja2

› Read the Docs

› gevent

› pyenv

› virtualenv

› Stackless Python

› Beautiful Soup

› 结巴中文分词

› Green Unicorn

› Sentry

› Shovel

› Pyflakes

› pytest

Python 编程

› pep8 Checker

Styles

› PEP 8

› Google Python Style Guide

› Code Style from The Hitchhiker's Guide

这是一个创建于 3385 天前的主题，其中的信息可能已经有所发展或是发生改变。

前后端分离在本地测试没问题，但是需要部署到服务器上，目前的方式就是直接用 nginx 直接定位到项目文件夹中的 index.html 文件？
但是，我总觉得有其他的方法，比如在项目中用 python 来启动一个服务，然后用 nginx 来监听这个端口？

最好的办法是什么，求解！

Nginx

分离

Python

部署

20 条回复 • 2016-03-08 19:00:59 +08:00

Ellison

2015-08-20 17:20:08 +08:00

nginx 直接定位到项目文件夹中的 index.html 文件
这哪里分离了...

比如后端跑 Apache 监听 8080 端口,nginx 就 proxy_pass 到 8080

6IbA2bj5ip3tK49j

2015-08-20 17:22:41 +08:00

nginx 直接暴露 html ， js ， css 等资源。反代接口部分。
我是这样做的。

wakemecn

2015-08-20 17:34:46 +08:00

楼主的这个想法叫反向代理

Mirachael

2015-08-20 17:47:42 +08:00

@Ellison 对啊，前端的入口文件不是 index.html 么，我本地就是这么做的。

Mirachael

2015-08-20 17:49:50 +08:00

@xgfan 这样吗
location / {
root /Users/mojixiang/Works/xinmei/client;
index index.html index.htm;
}

Mirachael

2015-08-20 17:50:34 +08:00

@wakemecn 我后端 api 用的反向代理

Mirachael

2015-08-20 17:51:26 +08:00

@wakemecn 所以我觉得前端也应该可以的

wakemecn

2015-08-20 18:02:15 +08:00

@mojixiang1102 静态内同，反向代理干嘛。多加了一层不说，还放弃了 Nginx 的缓存。动态内容当然还是要反向代理

minfzhon

2015-08-20 18:07:34 +08:00 via iPhone

反向代理吧

learnshare

2015-08-20 18:24:02 +08:00

是 Nginx 反向代理啊，或者单纯 80 服务给静态文件目录

Mirachael

2015-08-20 18:27:24 +08:00

@wakemecn 懂了，多谢！

oott123

2015-08-20 18:52:29 +08:00

前后端分离就是为了让你的前端有一个 nginx 就能跑的

你还弄个 Python 上去是要闹哪样

br00k

2015-08-20 19:18:33 +08:00

nginx 反代接口

Mirachael

2015-08-20 23:10:49 +08:00

@oott123 我错了，之前没搞明白，对不起，拉低了程序员的平均水平！

karloku

2015-08-21 00:35:37 +08:00

然而我们的前端不满足于做 spa, 开始折腾用 node 做中间件了...

loading

2015-08-21 07:02:20 +08:00 via Android

静态文件交给 nginx ，然后重定向 python 的 api 。

以 flask 为例

nginx 将 /static 部分搞定。这一步你当 python 不存在！

接着你的 flask 应该只监听 127.0.0.1:5001 而不是 80 端口

让 nginx 将 80 口的请求转到 127.0.0.1:5001

进阶:开多个 flask 在 5001 5002 5003 5004 ，让 nginx 做负载均衡！

ericls

2015-08-21 07:57:15 +08:00

前后分离不是 angular vue react 这些干的事情么。。

后端就是个 API

crayonyi

2015-08-21 10:10:43 +08:00

分享一下我在线上的配置吧：
upstream bowenpay_backend {
server 127.0.0.1:9002;
}

server {
listen 80;
server_name wx.bowenpay.com;
location = / {
root /var/www/wxweb/dist;
index index.html;
}

location ~* \.(html|htm )$ {
root /var/www/wxweb/dist;
index index.html;
}

location / {
proxy_pass http://bowenpay_backend;
proxy_set_header Host $http_host;
}

location ~* \.(css|js|jpg|jpeg|gif|png|ico|cur|gz|svg|svgz|map|mp4|ogg|ogv|webm|htc )$ {
root /var/www/wxweb/dist;
index index.html;
expires 1M;
access_log off;
add_header Cache-Control "public";
}

}

整体思路就是：
1 ）静态文件（ html/css/js/图片 /字体等）直接去对应目录下访问
2 ）其它（ api 访问）代理到对应 api 服务的端口

H4cK

2016-03-07 15:22:53 +08:00

@crayonyi 请问 nginx 支持对静态文件的负载均衡么？比如例子中的 html|htm 项，是否有可能通过培植分流到不同的 nginx 服务器呢？ thx

crayonyi

2016-03-08 19:00:59 +08:00

@H4cK 可以的。负载均衡和静态文件服务是两码事。可以配合使用的。
原理就是在前面再加一个 nginx ，设置 upstream ，分流到当前的机器。参考上面的 bowenpay_backend 设置。