feat: handle parsing of common qr code types

Fix #1224
This commit is contained in:
ShareVB 2024-09-01 19:36:13 +02:00
parent e8cd98c25d
commit 951143d63d
7 changed files with 275 additions and 8 deletions

View file

@ -0,0 +1,3 @@
declare module "ical.js" {
export function parse(content: string): object;
}

View file

@ -0,0 +1,151 @@
import { describe, expect, test } from 'vitest';
import { parseQRData } from './qr-code-decoder.service';
describe('qr-code-decoder', () => {
test('parseQRData should parse content correctly', () => {
expect(parseQRData(null)).toEqual({
type: 'Unknown',
value: '',
});
expect(parseQRData('')).toEqual({
type: 'Unknown',
value: '',
});
expect(parseQRData('TEL:+33123456')).toEqual({
type: 'Phone',
value: '+33123456',
});
expect(parseQRData('MATMSG:TO: email@example.com;SUB:email subject;BODY:Email text;;')).toEqual({
type: 'Email',
value: {
body: 'Email text',
subject: 'email subject',
to: 'email@example.com',
},
});
expect(parseQRData('mailto:email@example.com?subject=email subject&body=Email text')).toEqual({
type: 'Email',
value: {
body: 'Email text',
subject: 'email subject',
to: 'email@example.com',
},
});
expect(parseQRData('SMTP:email@example.com:email subject:Email text')).toEqual({
type: 'Email',
value: {
body: 'Email text',
subject: 'email subject',
to: 'email@example.com',
},
});
expect(parseQRData('smsto:+33315555:message')).toEqual({
type: 'SMS',
value: {
message: 'message',
to: '+33315555',
},
});
expect(parseQRData('WIFI:T:nopass;S:ssid;H:true;')).toEqual({
type: 'Wifi',
value: {
authentication: 'nopass',
hidden: 'true',
name: 'ssid',
password: undefined,
},
});
expect(parseQRData('WIFI:T:WPA;S:ssid;P:password;H:false;')).toEqual({
type: 'Wifi',
value: {
authentication: 'WPA',
hidden: 'false',
name: 'ssid',
password: 'password',
},
});
expect(parseQRData('BEGIN:VCALENDAR\nPRODID:-//xyz Corp//NONSGML PDA Calendar Version 1.0//EN\nVERSION:2.0\nBEGIN:VEVENT\nDTSTAMP:19960704T120000Z\nUID:uid1@example.com\nORGANIZER:mailto:jsmith@example.com\nDTSTART:19960918T143000Z\nDTEND:19960920T220000Z\nSTATUS:CONFIRMED\nCATEGORIES:CONFERENCE\nSUMMARY:Networld+Interop Conference\nDESCRIPTION:Networld+Interop Conference\n and Exhibit\\nAtlanta World Congress Center\\n\n Atlanta\\, Georgia\nEND:VEVENT\nEND:VCALENDAR'))
.toEqual({
type: 'iCal',
value: [
'vcalendar',
[
[
'prodid',
{},
'text',
'-//xyz Corp//NONSGML PDA Calendar Version 1.0//EN',
],
[
'version',
{},
'text',
'2.0',
],
],
[
[
'vevent',
[
[
'dtstamp',
{},
'date-time',
'1996-07-04T12:00:00Z',
],
[
'uid',
{},
'text',
'uid1@example.com',
],
[
'organizer',
{},
'cal-address',
'mailto:jsmith@example.com',
],
[
'dtstart',
{},
'date-time',
'1996-09-18T14:30:00Z',
],
[
'dtend',
{},
'date-time',
'1996-09-20T22:00:00Z',
],
[
'status',
{},
'text',
'CONFIRMED',
],
[
'categories',
{},
'text',
'CONFERENCE',
],
[
'summary',
{},
'text',
'Networld+Interop Conference',
],
[
'description',
{},
'text',
'Networld+Interop Conference and Exhibit\nAtlanta World Congress Center\nAtlanta, Georgia',
],
],
[],
],
],
],
});
});
});

View file

@ -0,0 +1,83 @@
import ICAL from 'ical.js';
export function parseQRData(qrContent: string | null) {
if (!qrContent) {
return { type: 'Unknown', value: '' };
}
if (qrContent.startsWith('BEGIN:VCALENDAR')) {
return { type: 'iCal', value: ICAL.parse(qrContent?.trim()) };
}
if (qrContent.startsWith('TEL:')) {
return { type: 'Phone', value: qrContent.substring(4)?.trim() };
}
if (qrContent.startsWith('MATMSG:')) {
// MATMSG:TO: email@example.com;SUB:email subject;BODY:Email text;;
const parsing = /^MATMSG:(?:TO:([^;]*);)?(?:SUB:([^;]*);)?(?:BODY:([^;]*))?;;$/.exec(qrContent) || [];
return {
type: 'Email',
value: {
to: parsing[1]?.trim(),
subject: parsing[2]?.trim(),
body: parsing[3]?.trim(),
},
};
}
if (qrContent.startsWith('mailto:')) {
// mailto:email@example.com?subject=email subject&body=Email text
const parsing = /^mailto:([^\?]+)\?subject=([^\&]*)(?:&body=(.*))$/.exec(qrContent) || [];
return {
type: 'Email',
value: {
to: parsing[1]?.trim(),
subject: parsing[2]?.trim(),
body: parsing[3]?.trim(),
},
};
}
if (qrContent.startsWith('SMTP:')) {
// SMTP:email@example.com:email subject:Email text
const parsing = /^SMTP:([^:]+)(?::([^:]*))(?::([^:]*))?$/.exec(qrContent) || [];
return {
type: 'Email',
value: {
to: parsing[1]?.trim(),
subject: parsing[2]?.trim(),
body: parsing[3]?.trim(),
},
};
}
if (qrContent.startsWith('smsto:')) {
// smsto:${phoneNumber}:${message}
const parsing = /^smsto:([^:]+)(?::(.+))$/.exec(qrContent) || [];
return {
type: 'SMS',
value: {
to: parsing[1]?.trim(),
message: parsing[2]?.trim(),
},
};
}
if (qrContent.startsWith('WIFI:')) {
// WIFI:T:${authentication};S:${name};${authentication !== 'nopass' ? `P:${password};` : ''}H:${hidden};
const parsing = /^WIFI:T:([^;]+);S:([^;]+);(?:P:([^;]+);)?(?:H:([^;]+);)?$/.exec(qrContent) || [];
return {
type: 'Wifi',
value: {
authentication: parsing[1]?.trim(),
name: parsing[2]?.trim(),
password: parsing[3]?.trim(),
hidden: parsing[4]?.trim(),
},
};
}
if (/\w+:\/\//.test(qrContent)) {
return {
type: 'Url',
value: qrContent,
};
}
return {
type: 'Text',
value: qrContent,
};
}

View file

@ -1,6 +1,7 @@
<script setup lang="ts">
import type { Ref } from 'vue';
import qrcodeParser from 'qrcode-parser';
import { parseQRData } from './qr-code-decoder.service';
import TextareaCopyable from '@/components/TextareaCopyable.vue';
const fileInput = ref() as Ref<File>;
@ -12,6 +13,15 @@ const qrCode = computedAsync(async () => {
return e.toString();
}
});
const qrCodeParsed = computed(() => {
try {
const parsed = parseQRData(qrCode.value);
return `Type: ${parsed.type}\nValue:${JSON.stringify(parsed.value, null, 2)}`;
}
catch (e: any) {
return e.toString();
}
});
async function onUpload(file: File) {
if (file) {
@ -37,6 +47,13 @@ async function onUpload(file: File) {
:word-wrap="true"
/>
</div>
<div>
<h3>Parsed</h3>
<TextareaCopyable
:value="qrCodeParsed"
:word-wrap="true"
/>
</div>
</div>
</template>