Replace cookies with localStorage

Cookies's use case is to store persistent data and send it to the server
in subsequent requests, such as to remember logged-in sessions. WebAO is
using them to store site settings like ad-hoc hash tables that require
parsing and serialization.

As a nasty side-effect of how cookies work, clients send all their
settings every time they connect to the server. Server has absolutely no
use for them, but each client sends them anyway, which is an
uncalled-for privacy leak.

Remove this mechanism entirely, switch to localStorage which serves
exactly the purpose of per-origin store with data that never leaves the
browser.

2 files changed, 16 insertions, 19 deletions

diff --git a/webAO/client/loadResources.ts b/webAO/client/loadResources.ts
index 2608ace2..27538fdb 100644
--- a/webAO/client/loadResources.ts
+++ b/webAO/client/loadResources.ts
@@ -1,4 +1,3 @@
-import getCookie from "../utils/getCookie";
 import vanilla_evidence_arr from "../constants/evidence.js";
 import vanilla_background_arr from "../constants/backgrounds.js";
 import { changeMusicVolume } from "../dom/changeMusicVolume";
@@ -36,49 +35,48 @@ export const loadResources = () => {
     evidence_select.add(new Option(evidence));
   });
 
-  // Read cookies and set the UI to its values
+  // Read local storage and set the UI to its values
   (<HTMLInputElement>document.getElementById("OOC_name")).value =
-    getCookie("OOC_name") ||
+    localStorage.getItem("OOC_name") ||
     `web${String(Math.round(Math.random() * 100 + 10))}`;
 
-  // Read cookies and set the UI to its values
-  const cookietheme = getCookie("theme") || "default";
+  const storedTheme = localStorage.getItem("theme") || "default";
 
   (<HTMLOptionElement>(
-    document.querySelector(`#client_themeselect [value="${cookietheme}"]`)
+    document.querySelector(`#client_themeselect [value="${storedTheme}"]`)
   )).selected = true;
   reloadTheme();
 
-  const cookiechatbox = getCookie("chatbox") || "dynamic";
+  const storedChatbox = localStorage.getItem("chatbox") || "dynamic";
 
   (<HTMLOptionElement>(
-    document.querySelector(`#client_chatboxselect [value="${cookiechatbox}"]`)
+    document.querySelector(`#client_chatboxselect [value="${storedChatbox}"]`)
   )).selected = true;
-  setChatbox(cookiechatbox);
+  setChatbox(storedChatbox);
 
   (<HTMLInputElement>document.getElementById("client_mvolume")).value =
-    getCookie("musicVolume") || "1";
+    localStorage.getItem("musicVolume") || "1";
   changeMusicVolume();
   (<HTMLAudioElement>document.getElementById("client_sfxaudio")).volume =
-    Number(getCookie("sfxVolume")) || 1;
+    Number(localStorage.getItem("sfxVolume")) || 1;
   changeSFXVolume();
   (<HTMLAudioElement>document.getElementById("client_shoutaudio")).volume =
-    Number(getCookie("shoutVolume")) || 1;
+    Number(localStorage.getItem("shoutVolume")) || 1;
   changeShoutVolume();
   (<HTMLAudioElement>document.getElementById("client_testimonyaudio")).volume =
-    Number(getCookie("testimonyVolume")) || 1;
+    Number(localStorage.getItem("testimonyVolume")) || 1;
   changeTestimonyVolume();
   (<HTMLInputElement>document.getElementById("client_bvolume")).value =
-    getCookie("blipVolume") || "1";
+    localStorage.getItem("blipVolume") || "1";
   changeBlipVolume();
 
   (<HTMLInputElement>document.getElementById("ic_chat_name")).value =
-    getCookie("ic_chat_name");
+    localStorage.getItem("ic_chat_name");
   (<HTMLInputElement>document.getElementById("showname")).checked = Boolean(
-    getCookie("showname"),
+    localStorage.getItem("showname"),
   );
   showname_click(null);
 
   (<HTMLInputElement>document.getElementById("client_callwords")).value =
-    getCookie("callwords");
+    localStorage.getItem("callwords");
 };
diff --git a/webAO/client/sender/sendOOC.ts b/webAO/client/sender/sendOOC.ts
index 43c3773b..d1baaa73 100644
--- a/webAO/client/sender/sendOOC.ts
+++ b/webAO/client/sender/sendOOC.ts
@@ -1,13 +1,12 @@
 import { client } from "../../client";
 import { escapeChat } from "../../encoding";
-import setCookie from "../../utils/setCookie";
 import { saveChatlogHandle } from "../../client/saveChatLogHandle";
 /**
  * Sends an out-of-character chat message.
  * @param {string} message the message to send
  */
 export const sendOOC = (message: string) => {
-  setCookie(
+  localStorage.setItem(
     "OOC_name",
     (<HTMLInputElement>document.getElementById("OOC_name")).value,
   );