我正在用AngularJS前端+GAE后端(Python和Flask(开发一个应用程序。我在设置app.yaml以路由使用Flask-Restless扩展创建的API端点时遇到了问题。我的app.yaml文件如下:
application: myAppID
version: 1
runtime: python27
threadsafe: true
api_version: 1
handlers:
# handler 1
- url: /favicon.ico
static_files: favicon.ico
upload: favicon.ico
# handler 2
- url: /api/.*
script: main.app
# handler 3
- url: /test
script: main.app
# handler 4
- url: (.*)/
static_files: app1/index.html
upload: app #this is the frontend folder for Angular
# handler 5
- url: (.*)
static_files: app1
upload: app #this is the frontend folder for Angular
在Angular中,路由配置如下:
App.config(['$stateProvider', '$locationProvider', '$urlRouterProvider', 'RouteHelpersProvider',
function ($stateProvider, $locationProvider, $urlRouterProvider, helper) {
'use strict';
$locationProvider.html5Mode(false);
// default route
$urlRouterProvider.otherwise('/app/dashboard');
// other routes ...
}]);
main.py文件如下所示:
from flask import Flask
import os
from werkzeug import debug
from flask import jsonify
from google.appengine.ext.webapp.util import run_wsgi_app
app = Flask('myApp')
if os.getenv('SERVER_SOFTWARE') and os.getenv('SERVER_SOFTWARE').startswith('Google App Engine/'):
app.debug = False
else:
app.debug = True
if app.debug:
app.wsgi_app = debug.DebuggedApplication(app.wsgi_app, True)
@app.route('/test')
def test():
return jsonify(test={"json": "test"})
import models
run_wsgi_app(app)
models
是包含Flask SQLAlchemy模型和Flask Restless端点的文件。
Angular部分加载正确,例如此URL工作正常:
A) http://localhost:8080/#/app/dashboard
但是GAE后端部分对以下URL的响应为500错误:
B) http://localhost:8080/api/person
C) http://localhost:8080/test
如果我删除handler 4
和handler 5
,那么B
和C
URL工作正常,但Angular前端停止工作。
我做错了什么?
我在忙,所以用手机写作没那么有趣。。。
无论如何,我在我的应用程序中所做的是,我只有一个触发flask应用程序的处理程序。
在flask应用程序中,/route通常会将angular web应用程序作为静态文件返回。
你需要配置你的Flask应用程序,它会知道静态(HTML,JS等(文件夹。
编辑:
app.yaml应该是这样的:
handlers:
- url: .* # This regex directs all routes to main.app
script: main.app
main.app是烧瓶应用程序。。现在让我们看看如何从路线"/"服务angular应用程序
from flask import Flask, render_template
app = Flask(__name__, static_folder='/templates') # This sets /templates to be the folder for all JS HTML CSS files
@app.route('/')
def wellcomePage():
return app.send_static_file('index.html')
app.js文件中的角度路由配置:
app.config(['$routeProvider', '$locationProvider',
function($routeProvider, $locationProvider) {
$routeProvider
.when('/', {
templateUrl: 'templates/views/home.html'
}).... Some More Routes..
请注意,templateUrl:"templates/…">
请看一下我的应用程序。我想这会帮助你理解我在这里想说的。。。
github 的SE集线器
当我使用一个奇怪的键盘时,我会编辑这个答案:(
如果这有帮助,请告诉我。