Python 如何部署Flask/Vue.js web应用程序

在部署Flask/Vue.js web应用程序时，我需要一些帮助

当前设置： Vue.js前端带有Vue路由器，带有静态页面+Flask后端（通过Ajax进行通信，只需要方便通过表单发送电子邮件）

问题：

我对如何在VPS上部署它感到困惑：

• 在两个不同端口上有两个进程，一个用于uWsgi+Flask，一个用于Vue，Nginx为它们提供服务
• 一个单独的进程—Uswgi+Flask为静态（内置）Vue页面提供服务，Nginx在页面前面。Flask需要将请求重定向到适当的静态视图
• 别的

我的烧瓶后端/API：

from flask_cors import CORS
from flask_mail import Message
from datetime import datetime
import pytz
from flask_mail_sendgrid import MailSendGrid
from config import confreader

app = Flask(__name__)

app.config.from_object(confreader)

curdate = str(datetime.now(pytz.timezone("Europe/Bucharest")))

cors = CORS(app, resources={r"/api/*": {"origins": "*"}})

mail = MailSendGrid(app)

@app.route('/api/sendemail', methods=['POST'])
def send_email():

    subject = '[Contact Form Message] ' + request.json['name'] + ' on ' + curdate
    template = f"""
    <h1>{request.json['name']} ({request.json['email']}) on {curdate}</h1>
    <p>{request.json['text']}</p>"""

    msg = Message(
        subject,
        recipients=[app.config['MAIL_DEFAULT_SENDER']],
        html=template,
        sender=request.json['email']
    )

    try:
      mail.send(msg)
      return jsonify(True)
    except:
      return jsonify(False)

if __name__ == '__main__':
    app.run()

来自flask_cors进口cors
从电子邮件导入消息
从日期时间导入日期时间
进口皮茨
从flask\u mail\u sendgrid导入MailSendGrid
从配置导入confreader
app=烧瓶（名称）
app.config.from_对象（confreader）
curdate=str（datetime.now（pytz.timezone（“欧洲/布加勒斯特”））
cors=cors（应用程序，资源={r”/api/*”：{“源”：“*”}）
mail=MailSendGrid（应用程序）
@app.route（'/api/sendmail'，methods=['POST']）
def send_email（）：
subject='[Contact Form Message]'+request.json['name']+'on'+curdate
模板=f“”
{curdate}上的{request.json['name']}（{request.json['email']}）
{request.json['text']}
“”
消息(
主题,，
收件人=[app.config['MAIL\u DEFAULT\u SENDER']]，
html=模板，
sender=request.json['email']
)
尝试：
邮件发送（msg）
返回jsonify（True）
除：
返回jsonify（False）
如果uuuu name uuuuuu='\uuuuuuu main\uuuuuuu'：
app.run（）

---

谢谢大家!

Nginx可以服务于静态文件，所以您可以将Nginx指向一个目录，在该目录中放置您编译的Vue.js应用程序。同时，它也应该服务于你的烧瓶应用程序。因此，应该定义两个位置

可能有不止一种方法，下面是我在网上找到的一个随机示例：

server {  
    listen 80;
    server_name 123.45.67.89;

    location /api {
        include uwsgi_params;
        uwsgi_pass unix:/home/survey/flask-vuejs-survey/backend/surveyapi.sock;
    }

    location / {
        root /home/survey/flask-vuejs-survey/frontend/survey-spa/dist;
        try_files $uri $uri/ /index.html;
    }
}

---

Nginx可以提供静态文件，因此您可以将Nginx指向一个目录，在该目录中放置您编译的Vue.js应用程序。同时，它也应该服务于你的烧瓶应用程序。因此，应该定义两个位置

可能有不止一种方法，下面是我在网上找到的一个随机示例：

server {  
    listen 80;
    server_name 123.45.67.89;

    location /api {
        include uwsgi_params;
        uwsgi_pass unix:/home/survey/flask-vuejs-survey/backend/surveyapi.sock;
    }

    location / {
        root /home/survey/flask-vuejs-survey/frontend/survey-spa/dist;
        try_files $uri $uri/ /index.html;
    }
}