How to clear local browser cache when testing javascript?

I am trying to translate some of what I am learning the course to the real world - and struggling to get my local machine to look at my latest code. For example… I wrote a little javascript to say “Hello planet Earth” on a webpage (e.g. responseField.innerHTML = <p>Hello planet Earth</p> triggered by an eventListener waiting for a button click). My code works great.

The problem is…
…if I go back and change my string to “Hello planet Mars”… reload the webpage - click the button - it still comes up with “Hello planet Earth”. If I come back several hours later and or go to a new computer — it will say “Hello planet Mars” as desired. Something must be caching the old js code??? I am assuming its the browser… but I go clear browser history / browser data and it still won’t get my updated code.

What am I missing? There has to be some way to force my local browser to quit caching and go get the new code.

You can serve static content along with information about how long it is valid to cache it for… but is that really what you’re doing?
If you’re pointing your browser directly at your file system then I don’t imagine that it would get cached (but I don’t really know)
Or if you’re running your server in development mode then I imagine that too disables caching

ctrl f5 ought to fetch everything without considering cache

Thank you for the quick response. Everything I can find says the same thing - Control-F5 should do the trick… and it doesn’t.

My server is not local - its hosted elsewhere - perhaps the hosting company has some form of caching device between me and my server…

1 Like

Could be a redis cache, or something else. Or delay in deployment? You could contact your hosting company?

Anyway, i would do development locally on your machine (then you don’t run into this issue), and then once your code is ready, deploy to production (the remote server of the hosting company). This is a common workflow.

Working locally – my caching problem goes away - but a different problem replaces it. Now trying to test the actual API I want to work with — everything is getting blocked by CORS - because I’m coming from localhost…

Did you write the API? And now the API is running on the same server you mentioned earlier?

then the API should also be part of your working local flow.

I did not write the API. Just trying to apply some of the stuff I learned in the Javascript course to the real-world.

The API I really want to work with is published by MINDBODYOnline; I use their service to manage my small business. I am trying to test with their sandbox. I can get valid responses with Postman — but trying to make a call from my website it fails. Their API is not free — and I suspect that’s what I am running into now - is that they will not accept my API call until I pay for the service.

I really want to practice and see if I have learned enough to take the response from an API — and format it such that it can be something useful on a webpage - before I start paying for it. For example - like I want to be able to use the GetAppointments call to grab all the appointments and then post a list of times that are still available.

My current strategy is to find some free APIs and practice more there first… Try to see if the problem really is server side — or perhaps somewhere between my keyboard and chair. :slight_smile:

PS - I was able to confirm with my hosting company - they DO have a cache engine! That at least solves my Ctrl-F5 mystery! :slight_smile: And they whitelisted my IP for dev purposes…

blocking cross-origin requests is something your browser does. you.
their api is only telling your browser that this is a good idea, and it probably is a good idea.

if you controlled the api you could have changed that suggestion to allow your site

I assume this postman is doing the requests on your behalf, you can do the same thing, make the request server side instead of on the client