client.html

<div>
    <div>Client Page</div>
</div>
<script src="dist/browser.js"></script>
<script type="text/javascript">

    const remoteOriginStorageclient = IframeStorage.constructClient({
        iframe: {
            // src: "http://127.0.0.1:5101/hub.html", -- for local testing
            src: "https://iframe-shared-storage.vercel.app/hub.html",
            messagingOptions: { enableLog: 'both' },
            iframeReadyTimeoutMs: 1000
        },
    });

    console.log('client constructed:', remoteOriginStorageclient);

    async function exampleSetAndGet() {
        await remoteOriginStorageclient.localStorage.setItem('foo', 'bar ' + Math.random());
        const value = await remoteOriginStorageclient.localStorage.getItem('foo');
        console.log('Got value localStorage via hub:', value);

        await remoteOriginStorageclient.indexedDBKeyval.set('foo-indexed-db', 'value-indexed-db ' + Math.random());
        const idbValue = await remoteOriginStorageclient.indexedDBKeyval.get('foo-indexed-db');
        console.log('Got value from IndexedDB via hub:', idbValue);
    }

</script>
<button onclick="exampleSetAndGet()"> send </button>