0

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


handlers:

- 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"

- 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?

Edit 1

When I visit www.my-domain.com it still serves up the old index.html. But when I go to the <project>.appspot.com (the google URL) which I haven't been to and I'm guessing neither has anyone else in quite some time, (not cached) it works.

It seems like Changing the name of the index.html doesn't matter to the cache providers only that they are GETing data from /. I have asked another related question about redirecting to another URL / => app

(Redirect base `/` path to folder in Google App Engine)

Edit 2

Using the technique here (https://www.maxlaumeister.com/blog/how-to-use-google-app-engine-as-a-free-redirect-server/) I was able to get a redirect working so when the user loads / the server redirects to /app/. This works great, for the uncached appspot.com url. My custom domain still doesn't work.

I'm pretty sure some middle man (ISP or Tier 1 provider) is cacheing the entire GET request to /. Not just index.html or the server response to /

I'm not sure what other ideas I have. Are there any other ways to bust this caching?

MindlessRouse
  • 425
  • 2
  • 12

2 Answers2

1

You can achieve this by modifying your app.yaml file and add a handler as in the example shown below:

Serving main.html here:

handlers:
- url: /
  static_files: app/main.html
  upload: app/main.html

Serving index.html, instead:

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

Where app is the folder in which index.html and main.html are located in. You may have something that looks different.

sllopis
  • 2,292
  • 1
  • 8
  • 13
  • I posted my app.yaml, I have already modified that to serve `main.html` but that didn't seem to do anything – MindlessRouse Nov 04 '19 at 13:38
  • Hi @MindlessRouse. Please notice that I am using `url: /` for the root URL (/), whereas `url: /.*` would be for all other URLs. More info is can be found **[here](https://cloud.google.com/appengine/docs/standard/python/config/appref#handlers_script)**. Let me know if this works for you. – sllopis Nov 04 '19 at 14:40
  • I tried what you mentioned. The reason I have `url: /.*` is because this is an Angular Single page app. Without the star, if you deeplink into some page then you get a 404. – MindlessRouse Nov 04 '19 at 15:24
  • Ignoring the SPA needs, I did try the `url: /` and it seemed to still be serving the old `index.html` – MindlessRouse Nov 05 '19 at 02:14
  • As you mentioned, it also worked for me when using `appspot.com` Google's domain. I just realized now you are using a custom domain. Have you tried deploying a new version of your App Engine? When performing updates in your static files, changes will not be applied right away, due to **[propagation and cache](https://cloud.google.com/appengine/docs/standard/python/config/appref#static_cache_expiration)** reasons. Also since I saw your edited question, you can **[override routing rules using](https://cloud.google.com/appengine/docs/standard/python/reference/dispatch-yaml)** `dispatch.yaml` file – sllopis Nov 05 '19 at 10:44
  • Through trying lots of different ideas I have redeployed maybe 40 times. On recheck this morning it is still cached. This is where my mistake error came in. I set the `expiration` for `url: /` in my app.yaml to 30 days. I think the ISPs/CDNs/Whatever are holding on to my old index.html file and serving it to users. – MindlessRouse Nov 05 '19 at 14:53
  • I looked into the `dispatch.yaml` (I used this to redirect API requests). I deployed a new service. Where I was using default, I changed to newui. I then redirected my base url `*.my-domain.com/*` to this new Service. But that didnt work. – MindlessRouse Nov 05 '19 at 15:18
  • I think this is expected as it says on the [documentation](https://cloud.google.com/appengine/docs/standard/python/config/appref#static_cache_expiration): After a file is transmitted with a given expiration time, there is generally no way to clear it out of intermediate caches, even if the user clears their own browser cache. Re-deploying a new version of the app will not reset any caches. I haven't tested it on a custom domain myself. However, my hypothesis is that you may have to wait until the static cache is flushed out from your since it worked for both of us on our `appspot.com` domain. – sllopis Nov 05 '19 at 15:55
  • This is what I was fearful of. Waiting 30 days is pretty much unacceptable for me. – MindlessRouse Nov 05 '19 at 15:57
  • Let us [continue this discussion in chat](https://chat.stackoverflow.com/rooms/201891/discussion-between-sllopis-and-mindlessrouse). – sllopis Nov 05 '19 at 16:13
0

Change value for index index.html to main.html in angular-cli.json

Varun_Ambhire
  • 23
  • 4