Not able to find static file with GCP app engine-CodePudding

I am trying to deploy a flask app with bootstrap and Jinja2 on GCP app engine. I have a css file for custom style of bootstrap template. The deployment was succeeded and the app worked fine except this custom.css, which I get a 404 error from app engine dashboard.

It works fine locally, so I am guessing there is something wrong with my app.yaml configuration.

My project directory structure is like this:

app
|
|-static
|   |-custom.css
|
|-templates
|   |-base.html
|
|  __init__.py
|  auth.py
|  functions.py
|  main.py
|  app.yaml
|  requirements.txt

app.yaml

runtime: python39
entrypoint: gunicorn -b :$PORT main:app

handlers:
  - url: /static
    static_dir: public

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

base.html

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <link
      rel="stylesheet"
      href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css"
      integrity="sha384-Vkoo8x4CGsO3 Hhxv8T/Q5PaXtkKtu6ug5TOeNV6gBiFeWPGFN9MuhOf23Q9Ifjh"
      crossorigin="anonymous"
    />
    <link
      rel="stylesheet"
      href="https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css"
      crossorigin="anonymous"
    />
    <link
      rel="stylesheet"
      type="text/css"
      href="/static/custom.css"
    />
  </head>

I am quite new to GCP and also unfamiliar with yaml, any help or suggestion will be appreciated.

Edit: Sorry I forgot to mentioned that I tried following approach and didn't work as well:

handlers:
  - url: /static
    static_dir: static

CodePudding user response：

You don't have a folder called public and python3 doesn't have that concept but your app.yaml is referring to a public folder.

In app.yaml, make the change for your static handler to

    - url: /static
    static_dir: static

Extra Information:

Your local environment is not always an exact replica of GAE Production. It is at best a simulation. So don't always assume what works in local will work in production.
Bullet 1 is especially important if you are not running your local environment with dev_appserver.py command. For example, if you test on your local environment using the command - python run XXXX, flask run XXX, then you are not using a GAE Simulated environment and thus are not using app.yaml

CodePudding user response：

The issue is with the mismatch of the folder names in your app.yaml:

handlers:
  - url: /static
    static_dir: public

What you're doing here is pointing the external /static path to the internal public path. Since the path public doesn't exist in your app, it will return a 404 not found error.

Change the static_dir value to static and it will work...

These docs are not exactly clear on this, but the docs for app.yaml explain it nicely (see the section about static_dir)