【Unity】WebGL上からWebStorageに対して読み書きする方法

今回はUnityのWebGL絡みのちょっとしたお話です。
UnityのAssets内にPluginフォルダを作り、そこに.jslibファイルを置くとC#からJavaScriptの関数を呼び出せます。
以前cookieの操作について記事を書きました。

【Unity】WebGL上からcookieで簡単なデータ管理を行う方法

それでHTML5のWebStorageを操作しようとしてそこそこ詰まってしまったので、そのお話です。

先に言ってしまうとWebStorageというより変数の扱い方で、Unityのドキュメントにすべて載っているので、そちらを参照いただいたほうが確実かと思います。
https://docs.unity3d.com/ja/2018.4/Manual/webgl-interactingwithbrowserscripting.html

それで終わりだと面白くないので、備忘も兼ねて私が実装した際の.jslibファイルの中身をご紹介します。
ここまではlocalStorageを使っていますが、sessionStorageでも基本は同じかと。

jslibファイルの準備

冒頭でお話した通り、Assets内のPluginフォルダに.jslibファイルを作成・配置します。

mergeInto(LibraryManager.library, {

  GetLocalStorage: function(key) {
    var item_string = localStorage.getItem(Pointer_stringify(key));

    if (!item_string) {
      return "";
    }

    var bufferSize = lengthBytesUTF8(item_string) + 1;
    var buffer = _malloc(bufferSize);
    stringToUTF8(item_string, buffer, bufferSize);
    return buffer;
  },

  SetLocalStorage: function(key, user_id) {
    localStorage.setItem(Pointer_stringify(key), Pointer_stringify(user_id));
  }

});

Unityから渡す変数はすべてPointer_stringify()を挟むことに注意します。これがないと渡した変数が数値の羅列になって残念なことになります。

JSから値を受け取る場合、単純にStorage.getItem()の結果をreturnしても、Unity上では空の文字列しか取れません。
UTF8やら_malloc()やらをあれこれ挟む必要があります。全然直感的じゃないですね…。

また、変数宣言にletを使うとビルド時にエラー(stderr:JS optimizer error:Unexpected token: name )になります。constなら大丈夫です。
特にJS意識高い系の人はvarの使用を避けがちなのでお気を付けください。

使い方

使いたいクラス内にこんな感じで書きます。

[DllImport("__Internal")]
private static extern string GetLocalStorage(string key);

[DllImport("__Internal")]
private static extern void SetLocalStorage(string key, string value);

あとは通常のメソッドを呼ぶのと変わらない感じで使えます。