React app giving 404 error when deployed to GCP

Question

I have deployed my react app to GCP's App engine. It successfully deploys and the landing page is accessible. However none of the routes work. All the routes are giving '404' error. I am pretty sure its the app.yaml configuration that has issue. Help please!

app.yaml

runtime: nodejs10

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

- url: /
  static_dir: build

check this: https://stackoverflow.com/a/48016400/11380693 – Akhil Nayak Apr 05 '20 at 07:38 — Akhil Nayak, Apr 05 '20 at 07:38
I tried that out, did not work – Yuvraj Singh Apr 05 '20 at 07:43 — Yuvraj Singh, Apr 05 '20 at 07:43

score 0 · Answer 1 · answered Apr 05 '20 at 10:47

The issue is that you are using both static_files and static_dir to your / url.

You need to either use static_files or static_dir.

From the description of your question it looks like you want to use static_dir to match everything that is inside the directory after the url: /.

As stated in the documentation:

static_dir: The path to the directory containing the static files, from the application root directory. Everything after the end of the matched url pattern is appended to static_dir to form the full path to the requested file.
static_files: A static file pattern handler associates a URL pattern with paths to static files uploaded with the application. The URL pattern regular expression can define regular expression groupings to be used in the construction of the file path. You can use this instead of static_dir to map to specific files in a directory structure without mapping the entire directory.

React app giving 404 error when deployed to GCP

app.yaml

1 Answers1