diff --git a/src/tools/base64-file-converter/base64-file-converter.vue b/src/tools/base64-file-converter/base64-file-converter.vue
index 4cdff0f9..7f7ee1a9 100644
--- a/src/tools/base64-file-converter/base64-file-converter.vue
+++ b/src/tools/base64-file-converter/base64-file-converter.vue
@@ -35,6 +35,7 @@
import { useCopy } from '@/composable/copy';
import { useDownloadFileFromBase64 } from '@/composable/downloadBase64';
import { useValidation } from '@/composable/validation';
+import { isValidBase64 } from '@/utils/base64';
import { Upload } from '@vicons/tabler';
import { useBase64 } from '@vueuse/core';
import type { UploadFileInfo } from 'naive-ui';
@@ -47,7 +48,7 @@ const base64InputValidation = useValidation({
rules: [
{
message: 'Invalid base 64 string',
- validator: (value) => window.atob(value.replace(/^data:.*?;base64,/, '')),
+ validator: (value) => isValidBase64(value.trim()),
},
],
});
diff --git a/src/tools/base64-string-converter/base64-string-converter.vue b/src/tools/base64-string-converter/base64-string-converter.vue
index 46ff5e2a..d725117c 100644
--- a/src/tools/base64-string-converter/base64-string-converter.vue
+++ b/src/tools/base64-string-converter/base64-string-converter.vue
@@ -37,24 +37,20 @@
diff --git a/src/tools/basic-auth-generator/basic-auth-generator.vue b/src/tools/basic-auth-generator/basic-auth-generator.vue
index 8769fb0a..975071c3 100644
--- a/src/tools/basic-auth-generator/basic-auth-generator.vue
+++ b/src/tools/basic-auth-generator/basic-auth-generator.vue
@@ -30,11 +30,12 @@
diff --git a/src/tools/svg-placeholder-generator/svg-placeholder-generator.vue b/src/tools/svg-placeholder-generator/svg-placeholder-generator.vue
index 50b3f1c2..299a3fd0 100644
--- a/src/tools/svg-placeholder-generator/svg-placeholder-generator.vue
+++ b/src/tools/svg-placeholder-generator/svg-placeholder-generator.vue
@@ -53,6 +53,7 @@
import TextareaCopyable from '@/components/TextareaCopyable.vue';
import { useCopy } from '@/composable/copy';
import { useDownloadFileFromBase64 } from '@/composable/downloadBase64';
+import { textToBase64 } from '@/utils/base64';
import { computed, ref } from 'vue';
const width = ref(600);
@@ -75,7 +76,7 @@ const svgString = computed(() => {
`.trim();
});
-const base64 = computed(() => 'data:image/svg+xml;base64,' + window.btoa(svgString.value));
+const base64 = computed(() => 'data:image/svg+xml;base64,' + textToBase64(svgString.value));
const { copy: copySVG } = useCopy({ source: svgString });
const { copy: copyBase64 } = useCopy({ source: base64 });
diff --git a/src/utils/base64.test.ts b/src/utils/base64.test.ts
new file mode 100644
index 00000000..0496b797
--- /dev/null
+++ b/src/utils/base64.test.ts
@@ -0,0 +1,69 @@
+import { describe, expect, it } from 'vitest';
+import { base64ToText, isValidBase64, removePotentialDataAndMimePrefix, textToBase64 } from './base64';
+
+describe('base64 utils', () => {
+ describe('textToBase64', () => {
+ it('should convert string into base64', () => {
+ expect(textToBase64('')).to.eql('');
+ expect(textToBase64('a')).to.eql('YQ==');
+ expect(textToBase64('lorem ipsum')).to.eql('bG9yZW0gaXBzdW0=');
+ expect(textToBase64('-1')).to.eql('LTE=');
+ });
+ });
+
+ describe('base64ToText', () => {
+ it('should convert base64 into text', () => {
+ expect(base64ToText('')).to.eql('');
+ expect(base64ToText('YQ==')).to.eql('a');
+ expect(base64ToText('bG9yZW0gaXBzdW0=')).to.eql('lorem ipsum');
+ expect(base64ToText('data:text/plain;base64,bG9yZW0gaXBzdW0=')).to.eql('lorem ipsum');
+ expect(base64ToText('LTE=')).to.eql('-1');
+ });
+
+ it('should throw for incorrect base64 string', () => {
+ expect(() => base64ToText('a')).to.throw('Incorrect base64 string');
+ expect(() => base64ToText(' ')).to.throw('Incorrect base64 string');
+ expect(() => base64ToText('é')).to.throw('Incorrect base64 string');
+ // missing final '='
+ expect(() => base64ToText('bG9yZW0gaXBzdW0')).to.throw('Incorrect base64 string');
+ });
+ });
+
+ describe('isValidBase64', () => {
+ it('should return true for correct base64 string', () => {
+ expect(isValidBase64('')).to.eql(true);
+ expect(isValidBase64('bG9yZW0gaXBzdW0=')).to.eql(true);
+ expect(isValidBase64('LTE=')).to.eql(true);
+ expect(isValidBase64('YQ==')).to.eql(true);
+ expect(isValidBase64('data:text/plain;base64,YQ==')).to.eql(true);
+ });
+
+ it('should return false for incorrect base64 string', () => {
+ expect(isValidBase64('a')).to.eql(false);
+ expect(isValidBase64(' ')).to.eql(false);
+ expect(isValidBase64('é')).to.eql(false);
+ expect(isValidBase64('data:text/plain;notbase64,YQ==')).to.eql(false);
+ // missing final '='
+ expect(isValidBase64('bG9yZW0gaXBzdW0')).to.eql(false);
+ });
+
+ it('should return false for untrimmed correct base64 string', () => {
+ expect(isValidBase64('bG9yZW0gaXBzdW0= ')).to.eql(false);
+ expect(isValidBase64(' LTE=')).to.eql(false);
+ expect(isValidBase64(' YQ== ')).to.eql(false);
+ });
+ });
+
+ describe('removePotentialDataAndMimePrefix', () => {
+ it('should remove data prefix of string', () => {
+ expect(removePotentialDataAndMimePrefix('')).to.eql('');
+ expect(removePotentialDataAndMimePrefix('lorem ipsum')).to.eql('lorem ipsum');
+ expect(removePotentialDataAndMimePrefix('bG9yZW0gaXBzdW0=')).to.eql('bG9yZW0gaXBzdW0=');
+ expect(removePotentialDataAndMimePrefix('data:image/jpeg;base64,lorem')).to.eql('lorem');
+ expect(removePotentialDataAndMimePrefix('data:image/jpeg;notbase64,lorem')).to.eql(
+ 'data:image/jpeg;notbase64,lorem',
+ );
+ expect(removePotentialDataAndMimePrefix('data:unknownmime;base64,lorem')).to.eql('lorem');
+ });
+ });
+});
diff --git a/src/utils/base64.ts b/src/utils/base64.ts
new file mode 100644
index 00000000..c0ef96aa
--- /dev/null
+++ b/src/utils/base64.ts
@@ -0,0 +1,33 @@
+export { textToBase64, base64ToText, isValidBase64, removePotentialDataAndMimePrefix };
+
+function textToBase64(str: string) {
+ return window.btoa(str);
+}
+
+function base64ToText(str: string) {
+ if (!isValidBase64(str)) {
+ throw new Error('Incorrect base64 string');
+ }
+
+ const cleanStr = removePotentialDataAndMimePrefix(str);
+
+ try {
+ return window.atob(cleanStr);
+ } catch (_) {
+ throw new Error('Incorrect base64 string');
+ }
+}
+
+function removePotentialDataAndMimePrefix(str: string) {
+ return str.replace(/^data:.*?;base64,/, '');
+}
+
+function isValidBase64(str: string) {
+ const cleanStr = removePotentialDataAndMimePrefix(str);
+
+ try {
+ return window.btoa(window.atob(cleanStr)) === cleanStr;
+ } catch (err) {
+ return false;
+ }
+}
diff --git a/src/utils/defaults.test.ts b/src/utils/defaults.test.ts
new file mode 100644
index 00000000..b322968c
--- /dev/null
+++ b/src/utils/defaults.test.ts
@@ -0,0 +1,16 @@
+import { describe, expect, it } from 'vitest';
+import { withDefaultOnError } from './defaults';
+
+describe('defaults util', () => {
+ describe('withDefaultOnError', () => {
+ it('should return the callback or the default one if the callback throws', () => {
+ expect(withDefaultOnError(() => 'original', 'default')).to.eql('original');
+ });
+
+ expect(
+ withDefaultOnError(() => {
+ throw '';
+ }, 'default'),
+ ).to.eql('default');
+ });
+});
diff --git a/src/utils/defaults.ts b/src/utils/defaults.ts
new file mode 100644
index 00000000..3d253d54
--- /dev/null
+++ b/src/utils/defaults.ts
@@ -0,0 +1,9 @@
+export { withDefaultOnError };
+
+function withDefaultOnError(cb: () => A, defaultValue: B): A | B {
+ try {
+ return cb();
+ } catch (_) {
+ return defaultValue;
+ }
+}