Error Static file referenced by handler not found: dist/api/landing for Angular App deployed on Google Cloud

user_5050126 0
Viewed 99

please help, I do not have experience deploying, I have been trying for days, bear with me. Thanks.

I have been working on a angular app with flask backend and both work proper locally, I need to deploy them. The server is written in flask and it is accessible via Postman. The page renders properly from "https://apt-trainer-279210.uc.r.appspot.com/" but on API call an error 404 not found when calling "api/landing" to my server. Going to the logs on GAE I see error.

Static file referenced by handler not found: dist/api/landing

I am guessing that its looking for file in the above path but it should be calling my server instead. Below is my app.yaml file for angular:

runtime: python27
api_version: 1
threadsafe: true
handlers:
 - url: /
   static_files: dist/index.html
   upload: dist/index.html
 - url: /
   static_dir: dist

skip_files:
 - e2e/
 - node_modules/
 - src/
 - coverage
 - ^(.*/)?\..*$
 - ^(.*/)?.*\.json$
 - ^(.*/)?.*\.md$
 - ^(.*/)?.*\.yaml$
 - ^LICENSE

Also note that in the angular app I proxy to the server:

 {
  "/api": {
  "target": "http://civil-planet-279210.uc.r.appspot.com" ,
  "secure": true,
  "logLevel": "debug",
  "changeOrigin": true,
  "pathRewrite": {
  "^/api/*": ""
 }

} }

A Similar question was also posted but the user was using Cloud Endpoints while my server is in python flask. I could not use the solution.

Not sure if I should post the app.yaml for the python server as it is working properly.

Your assistance would be greatly appreaciated.

angular flask google-cloud-platform google-app-engine html
2 Answers

According to my understanding this is working as expected. According to the documentation about header element we may find in url part:

The URL pattern has some differences in behavior when used with the following elements:

static_dir

Uses a URL prefix. The regular express pattern should not contain groupings when used with the static_dir element. All URLs that begin with this prefix are handled by this handler, using the portion of the URL after the prefix as part of the file path.

So calling .../api/landing will use the same logic: " using the portion of the URL after the prefix as part of the file path."

I am not sure what is your intention, but I think you should create the handler for the feature you want to invoke.

BTW you are using Python 2 which is not already not recommended and not supported. I would consider migration. You can see this at top of every page of documentation.

user_124103320

Was able to fix the issue with the following yaml - I was missing the third handler.

runtime: python27
api_version: 1
threadsafe: true

handlers:
- url: /
  static_files: dist/index.html
  upload: dist/index.html

- url: /
  static_dir: dist

- url: /.*
  script: auto
  secure: always
  redirect_http_response_code: 301

skip_files:
- e2e/
- node_modules/
- src/
- coverage
- ^(.*/)?\..*$
- ^(.*/)?.*\.json$
- ^(.*/)?.*\.md$
- ^(.*/)?.*\.yaml$
- ^LICENSE
user_50501260
Related