Google App Engine routing and pathing - google-app-engine

I am looking to discover the best possible practice for building up a file tree inside a GAE/python.
It seems rather efficient to keep everything in one file and route everything there via WSGI.
Though for a complex and multifaceted site it makes sense to have distinct files serving different purposes.
I ran into some weird complications when I had many urls listed in the app.yaml
handlers:
- url: /favicon\.ico
static_files: favicon.ico
upload: favicon\.ico
- url: /unit3.*
script: unit3.app
- url: /birthday.*
script: birthday.app
- url: /signup.*
script: signup.app
- url: /rot13.*
script: rot13.app
- url: /welcome.*
script: signup.app
- url: .*
script: main.app
libraries:
- name: webapp2
version: "2.5.1"
- name: jinja2
version: latest
and then having to duplicate those paths in separate .py files
app = webapp2.WSGIApplication([('/signup',SignUpHandler),
('/welcome',WelcomeHandler),
('/signup/.*', NotFoundPageHandler)]
,debug=True)
Is it weird that I think having to detail the routing of the url twice or more is cumbersome? Is there a way to have distinct files (html, css, py, js) and then have the app.yaml connect all the dots with the routing?

Best way to go is use webapp2 framework, routing is very simple there.
You can then just define urls.py and add routes there.
http://webapp-improved.appspot.com/
Routing in webapp.
http://webapp-improved.appspot.com/api/webapp2.html#uri-routing
Here is boilerplate code to get you started.
https://github.com/coto/gae-boilerplate

Related

App Engine app.yaml handlers not working as expected

I am trying to set up a vue.js application with the vue router set in "history" mode. I also want to serve my back end APIs from the same app engine application. (e.g., if a user navigates to /some/path/in/the/app and refreshes the page or shares the link, the application will display the expected page)
here is my app.yaml:
runtime: python37
handlers:
- url: /api/.*
secure: always
script: auto
- url: /css
static_dir: www/css
- url: /js
static_dir: www/js
- url: /semantic
static_dir: www/semantic
- url: /img
static_dir: www/img
- url: /
static_files: www/index.html
upload: www/index.html
- url: /.*
static_files: www/index.html
upload: www/index.html
When I try to hit any of my api endpoints, the static index.html file is served instead of the response from the endpoint.
If the last route is omitted (url: /.*), then the api endpoints are served correctly, but the Vue.js app can only be entered from the "/" route and the deep links in the application do not work as expected
I am not looking to have a script in my application to serve the a static file.
note, this question is similar, but none of the answers addressed my situation:
AppEngine app.yaml config for single page apps
The trick was to follow a microservice architecture and split my application into two modules and define the routes in a dispatch.yaml file.
There is a sample project here:
App Engine Modules sample project

app engine loading css and js files

Hello I just have deployed my laravel application in google app engine. But I have problems with css and js loading.
I am changing app.yaml like below:
handlers:
- url: /css
static_dir: public/assets/bootstrap/css
But instead of loading css, it just loads css.map files inside public/assets/bootstrap/css
Try this..
- url: /(.+\.(css|js))$
static_files: \1
upload: .+\.(css|js)$
application_readable: true
no need to revise any url.. Hope this helps

Google app engine website page structure

I made a website using Google app engine however, if I want to link from the main page to a different page in the folder structure, is does not load on the website.
The links are fine, they work if I check it on a browser directly from my drive. Do I need to put the entire folder in a seperate folder somewhere for app engine to access it or does it need to be in one single, messy file?
Check the app.yaml file, you have to edit it and add the folders.
Ex:
application: xxxx
version: 1
runtime: python
api_version: 1
handlers:
- url: /stylesheets
static_dir: resources/stylesheets
- url: /imgs
static_dir: resources/imgs
- url: /js
static_dir: resources/js
- url: /html
static_dir: resources/html
mime_type: text/html
- url: /.*
script: main.py
You have to put all your files that you want to display directly through an HTTP call in WEB-INF folder, assuming that you are coding in Java.

Where do I put my sitemap on appengine?

I know for typical static file such as stylesheets app.yaml must contain the path to the directory holding said files. E.g.
- url: /stylesheets
static_dir: stylesheets
How do I go about adding a sitemap to GAE server?
this is what i did for my favicon, since it's a static file:
- url: /favicon.ico
static_files: media/img/favicon.ico
upload: media/img/favicon.ico
the xml sitemap is a static file too, so you may want to do the same:
- url: /sitemap.xml
static_files: my/folder/path/sitemap.xml
upload: my/folder/path/sitemap.xml
not completely sure about the upload line, tho. but my favicon didn't work in the first place without it
edit: if you want a dynamic sitemap, you could follow the instructions in this link to generate them everytime the sitemap page gets visited
In order to follow the best practices on App Engine I would recommend you to check this Boilerplate http://appengine.beecoss.com
Over there you will find where put sitemap.xml and many more files you need. This is the best way to do it.
- url: /(robots\.txt|humans\.txt|crossdomain\.xml|sitemap\.xml)
static_files: static/\1
upload: static/(robots\.txt|humans\.txt|crossdomain\.xml|sitemap\.xml)

Configure app.yaml in GAE to allow selection of scripts through URL

I have created an app in Google App Engine and it's working pretty well in a conventional browser. The main script is called example.py (because I have been hacking off an example and I never changed it). It calls a html file and passes in variables as you would expect.
Now I want to develop a new version that's more suitable for mobile devices. To do this, I wrote a new python script called example_mobile.py. It's similar to example.py except that it calls a different html file with a different stylesheet. Inelegant I know but I thought it would be easy to implement through the app.yaml file.
Here is my app.yaml file:
application: (my application id string)
version: 1
runtime: python
api_version: 1
handlers:
- url: /remote_api
script: $PYTHON_LIB/google/appengine/ext/remote_api/handler.py
login: admin
- url: /stylesheets
static_dir: stylesheets
- url: /javascript
static_dir: javascript
- url: /images
static_dir: images
- url: /mobile/.*
script: example_mobile.py
- url: /.*
script: example.py
www.(my domain name).com pulls up the output from example.py no problem. I was hoping that www.(my domain name).com/mobile would pull up the output from example_mobile.py but it didn't work. Also tried www.mobile.(my domain name).com but no luck. Tried leaving off the /.* at the end of /mobile but that didn't help either. I switched example_mobile.py and example.py to check that it wasn't the python and I got the expected result so there's definitely something wrong with how I'm formatting and using the app.yaml file. Can't seem to find a similar use case in the GAE docs so any help would be much appreciated.
Thanks,
Dessie
To trigger the /mobile/.* route you should visit www.(my domain name).com/mobile/
One simple suggestion is to have a single example.py matched by /.* leaving the routing part to the WSGIApplication class.
application = webapp.WSGIApplication(
[('/mobile', example.MobileHandler),
( '/', example.MainHandler)],
debug=True)
One rule of thumb here is that on app.yaml you should have different routes for different applications or different components.
Is mobile a different application/components or just the same application with a different theme and some lighter features?

Resources