fix: correctly encode and decode base64 on frontend

twirapp · Sep 18, 2023 · 9bea6a0 · 9bea6a0
1 parent 6572685
commit 9bea6a0
Show file tree

Hide file tree

Showing 2 changed files with 15 additions and 5 deletions.
diff --git a/frontend/dashboard/src/api/registry/overlays.ts b/frontend/dashboard/src/api/registry/overlays.ts
@@ -2,6 +2,14 @@ import { useMutation } from '@tanstack/vue-query';
 
 import { protectedApiClient } from '@/api/twirp';
 
+function fromBinary(binary: string) {
+	const bytes = new Uint8Array(binary.length);
+	for (let i = 0; i < bytes.length; i++) {
+		bytes[i] = binary.charCodeAt(i);
+	}
+	return String.fromCharCode(...new Uint16Array(bytes.buffer));
+}
+
 export const useOverlaysParseHtml = () => useMutation({
 	mutationFn: async (htmlString: string) => {
 		if (!htmlString) {
@@ -11,6 +19,6 @@ export const useOverlaysParseHtml = () => useMutation({
 			html: btoa(htmlString),
 		});
 
-		return atob(req.response.html);
+		return fromBinary(req.response.html);
 	},
 });
diff --git a/frontend/overlays/src/pages/overlaysRegistry.tsx b/frontend/overlays/src/pages/overlaysRegistry.tsx
@@ -32,10 +32,12 @@ export interface LayerSettings {
 	htmlOverlayJs: string
 }
 
-function fromBase64(str: string) {
-	return decodeURIComponent(atob(str).split('').map(function(c) {
-		return '%' + ('00' + c.charCodeAt(0).toString(16)).slice(-2);
-	}).join(''));
+function fromBase64(binary: string) {
+	const bytes = new Uint8Array(binary.length);
+	for (let i = 0; i < bytes.length; i++) {
+		bytes[i] = binary.charCodeAt(i);
+	}
+	return String.fromCharCode(...new Uint16Array(bytes.buffer));
 }
 
 export const OverlaysRegistry: React.FC = () => {