Models overwriting and caching

Hi, this is more of a design question.

We have a backend where users can upload models themselves and the backend has two pages where they can view these models.

On the frontend there are 3 pages where models can be viewed, one of them has two canvases and another loads models in a sequence endlessly.

The thing is now if a user replaces a model (because it was faulty or too heavy or something) it will still display the old model in the preview.

I am not sure if disabling caching everywhere is a good idea? The models are not very big generally, but I do have one particular model that takes a couple seconds to load for example. So for loading a lot of models I would like to enable caching, but then users on the frontend won’t be able to see updates unless they hard refresh? Anyone have suggestions for this?

So from what I understand I am dealing with the engine cache here?

I could just disable the cache everywhere, but could also add some version checking or something via the database by just using a number and set it higher when a model is updated but how would I check if the model is cached and is updated?

This is not clear for me. How do you switch the model? Are we talking about network cache?

There is no “engine” cache per se
Maybe you can try to repro your issue so we can see it live?

What I mean is this.

1 - User uploads model
2 - Views model in viewer, but sees a mistake
3 - Uploads another model
4 - Views it in viewer again, but now sees the previous model
5 - Only when doing a hard refresh the new model is visible

So maybe I am wrong and this is the browser caching? I thought babylon also had an in engine cache going on.

EDIT - tried adding a v?=x suffix but this obviously won’t work for the skybox path loader function, so as there is only very little time left I am just going to add no cache meta tags to the frontend pages where content can be updated by the admin. Our models/skyboxes are quite small anyway so I don’t think it will be too much of an issue for now.

Hello, maybe it is too late but you have the opportunity to control the request at network level with:

WebRequest.CustomRequestModifiers

An example here: WebRequest issues / workaround | Babylon.js Playground

2 Likes

Mh alright that might have been useful, but it works for now.

One thing however I am looking into right now is that I am replacing a gltf model with another one, I am 100% certain the previous one is removed and the new model is being uploaded to the right folder because also tried it with completely different helicopter and that did work.

However when I open the gltf in blender it looks like this:

And in my viewer it always looks like this:

As you can see the propellers are supposed to be straight (angled won’t work properly right now). I checked and double checked but this file with angled rotors does not exist anymore… so this is not being cached or what? I am confused.
I even have these in the page:

  <meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate" />
    <meta http-equiv="Pragma" content="no-cache" />
    <meta http-equiv="Expires" content="0" />

I also checked if I have only one of this file and it is not somewhere else and there is only one…

EDIT - Also checked with another one and it has the same thing, maybe these rotation values are not being read?

It might be an exporter issue then, is your file looking allright in the sandbox ?

It looks fine but the nose is pointing upwards when I drag it in, which was not the case with the other helicopters but I never have any issues with them pointing into the wrong direction they all face straight ahead.

But at this point I am really not sure what could somehow be caching this file?
Because at least here the rotor is straight, and mine just shows a file that doesn’t exist…

Maybe the name of the textures are identical in some ways so they are used from the cache ???

Could you create a simple repro in the playground ?

This would help us troubleshooting the issue.

Mh not sure how you would want me to reproduce this if I don’t even know what is going on?

The no cache meta tags don’t seems to do much about this caching being disabled then, is there no way to just turn this all off to see if it works without it at least?

I would suggest to create the playground repro.

It could be as simple as loading the first model then loading the second to see if this repro.

Alright do you have any suggestions where I could upload this file because this server is not supposed to have cors and I don’t have anything like dropbox premium to have a link or anything.

If your server do not have cors issue, you could use it, else you could follow this doc: Using External Assets In the Playground | Babylon.js Documentation

I have at least narrowed down the issue a little bit.

Let’s say you upload model 1, you see it is broken, reupload it again and look at it in the viewer now you still see the old model.

Now switch to another browser and go to the same viewer with model and you will see the actual updated model.

When I try this in Chrome:
image

It starts working for me, which is what I was basically already trying to do with the headers.

Ok good so you need to bypass cache from the model xhr. maybe you could do like david proposed:

 BABYLON.WebRequest.CustomRequestModifiers.push((request, url) => {
        // nothing to do for external requests
        if (url.startsWith('https://') || url.startsWith('http://')) {
            return;
        }

        // set our header for all internal requests
        request.setRequestHeader('Cache-Control', 'no-cache');
    });

1 Like