CODEWITHSUNDEEP
google-app-engineflaskgoogle-cloud-platform
puoygae
puoygae

Reputation: 573

Configure Google App Engine to serve a JS client side app

I have a basic flask app that uses the flask_restful extension (for making restful services):

main.py

from google.cloud import datastore
from flask import Flask
from flask_restful import Resource, Api

app = Flask(__name__)
api = Api(app)

datastore_client = datastore.Client()

class HelloWorld(Resource):
    def get(self):
        # retrieve from datastore here
        return {'greeting': 'hello'}

api.add_resource(HelloWorld, '/greet')

Typically, a flask app will render a template like this:

@app.route('/')
def home():
    return render_template("index.html")

By default, flask will retrieve index.html from the templates/index.html directory.

However, when the / route is visited, I do not want to render the a template. Instead, I would like to serve a JS client app (Angular, React, Vue) inside an entirely different directory within the app engine project:

my-gae-project/
    app.yaml
    main.py
    main_test.py
    requirements.txt
    app/          <--- JS app lives here; consumes flask restful api
        src/
            index.html
            script.js
            style.js
        build/
            index.html

At first, I thought it would be as easy as modifying the app.yaml file to point to the app/ subdirectory:

runtime: python37

handlers: 

- url: /static
  static_dir: static

- url: /app
  static_dir: app

- url: /.*      <--- route all requests to '/' to app.index.html
  script: app/index.html

But this does not work. So, how exactly can I serve a JS client within GAE that consumes the flask rest API?

Upvotes: 0

Views: 141

Answers (1)

Ryan Joseph
Ryan Joseph

Reputation: 350

This would not be recommended in production on App Engine, you can either decide whether you would like to develop your whole application in Python Flask or JS (React, Angular, Vue).

The best solution to this, would be to divide your application into two services. running on GAE

Upvotes: 1

Related Questions