Angular frontend with django rest backend on google cloud app engine error 502 Bad Gateway

Question

I have deployed my angular front end with Django Rest Framework backend on Google App Engine. When I make a request to the backend from the frontend I get an error 502 Bad Gateway any help on identifying the problem will be really appreciated. I have tried several online recommendations are not working for me. This is my front end app.yaml

runtime: nodejs12
handlers:
  - url: /
    static_files: smis/index.html
    upload: smis/index.html
    secure: always
  - url: /
    static_dir: smis
    secure: always

This is my backend app.yaml file

runtime: python38
service: backend
handlers:
  - url: /static
    static_dir: /static/
    secure: always
  - url: /.*
    script: auto
    secure: always

This is my dispatch.yaml file

#routing rules
dispatch:
  #api
  - url: "*/api/*"
    service: backend

Answer 1

The leading wildcard in your url routing is invalid. Try this:

#routing rules
dispatch:
  #api
  - url: "/api/*"
    service: backend

Then, any url that begins with /api/... will go to the python backend

Answer 2

I found out I had not set main.py file. App engine handles request in the main.py file which should be in the root directory. The contents of main.py file can be derived from wsgi.py file. This is the content I place in the main.py file and it worked for me:

import os

from django.core.wsgi import get_wsgi_application

os.environ.setdefault('DJANGO_SETTINGS_MODULE', 'smis.settings')

application = get_wsgi_application()
app = application
```