From 9bea6a0fb54591c66688bf5ecb0225cd3673f810 Mon Sep 17 00:00:00 2001 From: Satont Date: Mon, 18 Sep 2023 17:29:38 +0300 Subject: [PATCH] fix: correctly encode and decode base64 on frontend --- frontend/dashboard/src/api/registry/overlays.ts | 10 +++++++++- frontend/overlays/src/pages/overlaysRegistry.tsx | 10 ++++++---- 2 files changed, 15 insertions(+), 5 deletions(-) diff --git a/frontend/dashboard/src/api/registry/overlays.ts b/frontend/dashboard/src/api/registry/overlays.ts index fa5333de6..98099240e 100644 --- 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 index 6d36c1744..a6a344526 100644 --- 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 = () => {