How do I cancel the model loading process

Questions
1

As shown in the figure, I need to close the popup window before the model is loaded. At this time, I need to cancel the loading process of the model. How can I achieve this

Snipaste_2023-09-24_21-02-45
Snipaste_2023-09-24_21-02-451149Ă—895 80.8 KB

1 Like
2

Is it possible?

The source code has a discouraging-for-users and encouraging-for-developers comment:

1 Like
3

i was going to suggest an AbortController with signals on the XHR request but as this hasn’t been internalized to the Loader may be a bit tricky without creating a fork of the Loader / FileLoader class…

Maybe the best bet for a user would be to simply close the window and on load (using a flag to check if the window was closed before loading) .dispose() of the loaded asset and make the result of the loader null? :man_shrugging:

EDIT: Otherwise maybe something like the following could be used for the more proficient user…

import {Loader} from 'three'

let controller

const customLoad = async (url, lib = {}) => {

    controller = new AbortController();
    const signal = controller.signal;

    try {
        const response = await fetch(url, { signal });
        const result = await response.json();
        this.data = this.parse(result, lib);

        dispatchEventList(this.events.load, this);
        controller = null

        return this.data;
    } catch (err) {
        if (err.name === 'AbortError') {
            controller = null
            console.log('Loading process was aborted.');
        } else {
            controller = null
            console.error('Loader:', err);
        }
    }

}

Loader.prototype.customLoad = customLoad


abortBtn.addEventListener("click", () => {
  if (controller) {
    controller.abort();
    console.log("Download aborted");
  }
});

this is just pseudo code and definitely not tested so may need some tweaking to implement properly…

EDIT 2: I realise this doesn’t ever reference GLTFLoader which is where the cusomLoad method would need to be called… This could definitely be implemented in a similar way however, whereby GLTFLoader would also be prototyped with a customLoad method that calls the Loader’s newly created customLoad method…

1 Like
4

thank you a lot, Where is the dispatchEventList function defined? Or does it need to be introduced?

5

thank you a lot. The only way to solve this problem is to use the existing api :sob:

6

dispatchEventList is part of three’s core where the Loader class is defined…