2

Ok, let me 1st come clean. I mistakenly added a 365d expiration date to my index.html file. I've now made a change to a JS file, which changed the name of the import in my index.html and now it's trying to import the wrong file. Oops.

So I'm thinking let's change the name of the default file name to something else that isn't cached.

What I have now

In my Angular project, I've changed all the building settings so now my index.html file is named main.html. The even the file itself is named main.html, and checking in my dist folder, there is no index.html only a main.html.

I have hosted the site on Google App Engine and this is the command I used to deploy after building.

gcloud app deploy app.yaml --quiet --project=<project-name>

Here is my app.yaml

api_version: 1

env: standard
runtime: python27
service: <service-name>
threadsafe: yes

automatic_scaling:
  min_idle_instances: 1

handlers:

- url: /(.*\.(css|eot|gz|ico|js|map|png|jpg|jpeg|svg|ttf|woff|woff2|pdf|gif))
  static_files: dist/browser/\1
  upload: dist/browser/(.*\.(css|eot|gz|ico|js|map|png|jpg|jpeg|svg|ttf|woff|woff2|pdf|gif))
  expiration: "365d"

- url: /.*
  static_files: dist/browser/main.html
  upload: dist/browser/main.html
  secure: always
  expiration: "0s"

skip_files:
 ## bunch of files

Problem:

It seems like Google is still serving up index.html, though to be honest I'm not really sure how to check. How do tell it to serve up the main.html as the default file?

1 Answers1

1

Edited Answer:

The issue that you aren't able to rename index.html on App Engine is because of the cached files and because you've your app.yaml file wrong.

  • An easy way to avoid the cached file issue is to change the filename because a new filename isn't cached anywhere, until it's requested.

You have several options:

1- Use a new file name

2- Use Etag Header

3- Add query string parameter on the get request to the server. ( Do a request to /main.html?timestamp=currenttimestamp, the parameter needs to change, or it will get cached too)

  • If you make a request to your application, on dist/browser/main.html, it will never get to the second handler , it will always stop at the first because it matches the pattern, handlers go top to bottom.

If you want to force the dist/browser/main.html to be a single file always, then the app.yaml file should be:

api_version: 1

env: standard
runtime: python27
service: <service-name>
threadsafe: yes

automatic_scaling:
  min_idle_instances: 1

handlers:
- url: /dist/browser/main.html
  static_files: dist/browser/main.html
  upload: dist/browser/main.html
  secure: always
  expiration: "0s"
- url: /(.*\.(css|eot|gz|html|ico|js|map|png|jpg|jpeg|svg|ttf|woff|woff2|pdf|gif))
  static_files: dist/browser/\1
  upload: dist/browser/(.*\.(css|eot|gz|html|ico|js|map|png|jpg|jpeg|svg|ttf|woff|woff2|pdf|gif))
  expiration: "365d"


skip_files:
 ## bunch of files
Nibrass H
  • 146
  • 5
  • I'm not sure what you mean? I tried lots of things over several hours so I don't think there was an issue with not waiting long enough – MindlessRouse Nov 04 '19 at 13:40
  • I am sorry, I investigate further and edited the answer. Let me know if it works for you. – Nibrass H Nov 05 '19 at 11:14
  • Thanks so much for continuing to look into it. I have renamed the file. The problem is the request still goes to the same url `/` so it is still cached. I have briefly looked into Etag Headers but Im not sure how to use them properly.. I can keep looking down this path. Sadly I cannot add a query parameter because this is just the root path of `/` – MindlessRouse Nov 05 '19 at 15:13
  • Try not to use expiration 365 days, because it's a bad practice and if the handler doesn't match the first one, it jumps to that one that it's cached. If you want the root path, you have to add another url with - url: / Let me know if it works – Nibrass H Nov 06 '19 at 16:49