How to proxy the window.location

Originally we only supported browser routing, so we had a lot of code in our code to route jumps by manipulating window.location directly, now we have added embedded mode using in-memory routing, in this scenario, manipulating window.location directly to make the browser’s address change is no longer the behavior we expect. we want to use it without modifying the We want to rewrite window.location in embedded mode without modifying a lot of calls in the code.

The code I am currently using is as follows:

export const proxyLocation = (location: Location) => {
    const newLocation = {
        get pathname() {
            return location.pathname;
        },
        set pathname(value) {
            push(value);
        },
        get href() {
            return patchUrl(location.pathname + location.search);
        },
        set href(value) {
            push(value);
        },
        get origin() {
            return backendServer.url;
        },
        get search() {
            return location.search;
        },
        replace: function (url) {
            replace(url);
        },
        reload: function () {
            replace(window.location.href);
        },
    };

    Object.defineProperty(window, 'location', {
        value: newLocation,
        writable: false,
        configurable: true,
        enumerable: true,
    });
}

But this code will report an error when run:

TypeError: Cannot redefine property: location
at Function.defineProperty ()

Is there a solution to this problem?

You need to sign in to view this answers

Related Post