はじめに localStorageは基本的に同じドメイン内(厳密にはポート番号なども一致している必要がある)でしか有効ではありませんが、postMessage API(Web Messaging API)を使用することでクロスドメインでも共有することができます。 調べてみても古い記事が多かったり、サンプルのコードが無かったりだったので自分用の備忘録も兼ねてやり方をご紹介します。 構成 【ドメインA】 ・localstorageのデータを持つ側。 ・ドメインBからの要求に応じてlocalstorageの操作を行う。 【ドメインB】 ・ドメインAに保存されているlocalstorageの値の参照や更新を要求する側。 (実際の動作確認はA側をGithub Pages、B側をローカルサーバーに置いた状態で行いました。) ドメインA側 ドメインB側からのメッセージをトリガーにlocalstorage
![異なるドメイン間でlocalstorageを共有する方法 - Qiita](https://cdn-ak-scissors.b.st-hatena.com/image/square/a3eded48faddbca26deb86fa498558c76fdeaad0/height=288;version=1;width=512/https%3A%2F%2Fqiita-user-contents.imgix.net%2Fhttps%253A%252F%252Fcdn.qiita.com%252Fassets%252Fpublic%252Farticle-ogp-background-9f5428127621718a910c8b63951390ad.png%3Fixlib%3Drb-4.0.0%26w%3D1200%26mark64%3DaHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZ3PTkxNiZ0eHQ9JUU3JTk1JUIwJUUzJTgxJUFBJUUzJTgyJThCJUUzJTgzJTg5JUUzJTgzJUExJUUzJTgyJUE0JUUzJTgzJUIzJUU5JTk2JTkzJUUzJTgxJUE3bG9jYWxzdG9yYWdlJUUzJTgyJTkyJUU1JTg1JUIxJUU2JTlDJTg5JUUzJTgxJTk5JUUzJTgyJThCJUU2JTk2JUI5JUU2JUIzJTk1JnR4dC1jb2xvcj0lMjMyMTIxMjEmdHh0LWZvbnQ9SGlyYWdpbm8lMjBTYW5zJTIwVzYmdHh0LXNpemU9NTYmdHh0LWNsaXA9ZWxsaXBzaXMmdHh0LWFsaWduPWxlZnQlMkN0b3Amcz1mMDk1MzEyNmQwNGRiMzdkNzUxZWI4MDM3ZWQyYTk0OQ%26mark-x%3D142%26mark-y%3D112%26blend64%3DaHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZ3PTYxNiZ0eHQ9JTQwU3JfQmFuZ3MmdHh0LWNvbG9yPSUyMzIxMjEyMSZ0eHQtZm9udD1IaXJhZ2lubyUyMFNhbnMlMjBXNiZ0eHQtc2l6ZT0zNiZ0eHQtYWxpZ249bGVmdCUyQ3RvcCZzPTg4ZGE3ODUxZDBhMjRkNmEwMTI5MGE1YWIwMzRmNjk0%26blend-x%3D142%26blend-y%3D491%26blend-mode%3Dnormal%26s%3Db6971db8bc3055ff0e669349149ced29)