首页 > 解决方案 > ReactJS + Flask 在本地工作,但不在 Heroku

问题描述

我不知道如何在 Heroku 上显示我的 React 应用程序。

在我的本地计算机上,我npm run start为 React 部分做,然后我转到 Flask 文件夹并做py app.py.

我的项目结构是:

project
 - client 
  - build
  - node_modules
  - public
  - src
  - package.json
  - package-lock.json
 - app.py
 - Procfile
 - requirements.txt

所以我创建了一个 Heroku 应用程序并推送所有内容。起初它可以工作,但 React 应用程序没有显示它只是 Flask 服务器的答案,然后我做了一些修改,就像我在类似帖子上看到的那样(基本上添加了++ static_folder,现在我是这样的static_url_patherrorHandlerapp.py


    import flask
    from flask import Flask, render_template, request, redirect, Response, send_from_directory
    import json
    import logging.handlers
    import os
    from bson.json_util import dumps
    from flask_cors import CORS
    from werkzeug.utils import secure_filename
    import pandas as pd
    import sys
    import io
    import csv
    
    UPLOAD_FOLDER = './uploads'
    STATIC_FOLDER = './client/build'
    
    app = flask.Flask(__name__, static_folder='.client/build', static_url_path='/')
    app.secret_key = 's_e_c_r_e_t'
    app.config['UPLOAD_FOLDER'] = UPLOAD_FOLDER
    CORS(app) # CORS
    
    
    @app.route('/', methods=['GET'])
    def home():
        return app.send_static_file('index.html')
    
    @app.errorhandler(404)
    def not_found(e):
        return app.send_static_file('index.html')
        
    if __name__ == "__main__":
        app.run(host='0.0.0.0', port=80, threaded=True)

但现在我得到的只是一个内部服务器错误,有人可以帮我吗?

[日志]

2021-06-27T09:14:01.112325+00:00 heroku[web.1]: Starting process with command `gunicorn app:app`
2021-06-27T09:14:03.948938+00:00 app[web.1]: [2021-06-27 09:14:03 +0000] [4] [INFO] Starting gunicorn 20.1.0
2021-06-27T09:14:03.949683+00:00 app[web.1]: [2021-06-27 09:14:03 +0000] [4] [INFO] Listening at: http://0.0.0.0:33615 (4)
2021-06-27T09:14:03.949803+00:00 app[web.1]: [2021-06-27 09:14:03 +0000] [4] [INFO] Using worker: sync
2021-06-27T09:14:03.955150+00:00 app[web.1]: [2021-06-27 09:14:03 +0000] [7] [INFO] Booting worker with pid: 7
2021-06-27T09:14:04.042602+00:00 app[web.1]: [2021-06-27 09:14:04 +0000] [8] [INFO] Booting worker with pid: 8
2021-06-27T09:14:05.492057+00:00 heroku[web.1]: State changed from starting to up
2021-06-27T09:14:29.000000+00:00 app[api]: Build succeeded
2021-06-27T09:21:45.423207+00:00 heroku[router]: at=info method=GET path="/" host=projet-bachelor.herokuapp.com request_id=94624b44-ea88-491d-830c-610285d569da fwd="31.10.171.236" dyno=web.1 connect=0ms service=16ms status=500 bytes=495 protocol=https
2021-06-27T09:21:45.423462+00:00 app[web.1]: 10.37.182.10 - - [27/Jun/2021:09:21:45 +0000] "GET / HTTP/1.1" 500 290 "-" "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/91.0.4472.114 Safari/537.36"
2021-06-27T09:21:45.423207+00:00 heroku[router]: at=info method=GET path="/" host=projet-bachelor.herokuapp.com request_id=94624b44-ea88-491d-830c-610285d569da fwd="31.10.171.236" dyno=web.1 connect=0ms service=16ms status=500 bytes=495 protocol=https
2021-06-27T09:21:45.423462+00:00 app[web.1]: 10.37.182.10 - - [27/Jun/2021:09:21:45 +0000] "GET / HTTP/1.1" 500 290 "-" "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/91.0.4472.114 Safari/537.36"
2021-06-27T09:22:58.213996+00:00 heroku[router]: at=info method=GET path="/" host=projet-bachelor.herokuapp.com request_id=ec593fd3-4baf-402c-a8e5-1dd5dfec6098 fwd="31.10.171.236" dyno=web.1 connect=1ms service=8ms status=500 bytes=495 protocol=https
2021-06-27T09:22:58.262772+00:00 app[web.1]: 10.69.232.207 - - [27/Jun/2021:09:22:58 +0000] "GET / HTTP/1.1" 500 290 "-" "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/91.0.4472.114 Safari/537.36"
2021-06-27T09:24:29.546947+00:00 app[web.1]: 10.51.248.89 - - [27/Jun/2021:09:24:29 +0000] "GET / HTTP/1.1" 500 290 "-" "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/91.0.4472.114 Safari/537.36"

标签: pythonreactjsflaskheroku

解决方案


分配的路径错误,请删除./,静态和上传文件夹在根目录

import flask
from flask import Flask, render_template, request, redirect, Response, send_from_directory
import json
import logging.handlers
import os
from bson.json_util import dumps
from flask_cors import CORS
from werkzeug.utils import secure_filename
import pandas as pd
import sys
import io
import csv

UPLOAD_FOLDER = 'uploads'
STATIC_FOLDER = 'client/build'

app = flask.Flask(__name__, static_folder=STATIC_FOLDER, static_url_path='/')
app.secret_key = 's_e_c_r_e_t'
app.config['UPLOAD_FOLDER'] = UPLOAD_FOLDER
CORS(app) # CORS


@app.route('/', methods=['GET'])
def home():
    return app.send_static_file('index.html')

@app.errorhandler(404)
def not_found(e):
    return app.send_static_file('index.html')
    
if __name__ == "__main__":
    app.run(host='0.0.0.0', port=80, threaded=True)

推荐阅读