feat(new tool): Malicious Link Checker

Chekc for malicious links using Google Services

Author: sharevb

src/tools/index.ts

@@ -1,6 +1,7 @@
 import { tool as base64FileConverter } from './base64-file-converter';
 import { tool as base64StringConverter } from './base64-string-converter';
 import { tool as basicAuthGenerator } from './basic-auth-generator';
+import { tool as maliciousLinksTester } from './malicious-links-tester';
 
 import { tool as asciiTextDrawer } from './ascii-text-drawer';
 
@@ -128,6 +129,7 @@ export const toolsByCategory: ToolCategory[] = [
       httpStatusCodes,
       jsonDiff,
       safelinkDecoder,
+      maliciousLinksTester,
     ],
   },
   {

src/tools/malicious-links-checker/index.ts

@@ -0,0 +1,12 @@
+import { ShieldCheck } from '@vicons/tabler';
+import { defineTool } from '../tool';
+
+export const tool = defineTool({
+  name: 'Malicious Links Checker',
+  path: '/malicious-links-checker',
+  description: 'Check an url against Google Safe Browsing service',
+  keywords: ['malicious', 'links', 'checker', 'check', 'safe', 'safe-browsing', 'google'],
+  component: () => import('./malicious-links-checker.vue'),
+  icon: ShieldCheck,
+  createdAt: new Date('2024-05-11'),
+});

src/tools/malicious-links-checker/malicious-links-checker.vue

@@ -0,0 +1,64 @@
+<script setup lang="ts">
+import { request } from 'malicious-link-detector';
+import { useValidation } from '@/composable/validation';
+import { useQueryParam } from '@/composable/queryParams';
+
+/*
+What tool do you want?
+Send Message via Whatsapp Web
+
+Describe the solution you'd like
+I would like to have an input field where I can write a mobile number and a textfield, where I can send a message.
+A button "Send" which will open the follwowing url:
+
+https://web.whatsapp.com/send/?phone=THE_MOBILE_NUMBER&text=THE_MESSAGE
+
+it is important that the number is formatted correctly:
+the "0" at the beginning should be "49" (for germany) and all spaces or characters like "-" should be removed.
+*/
+
+const url = useQueryParam({ name: 'url', defaultValue: '' });
+const urlValidation = useValidation({
+  source: url,
+  rules: [
+    {
+      message: 'Invalid url string',
+      validator: (value) => {
+        try {
+          const _ = (new URL(value));
+          return true;
+        }
+        catch {
+          return false;
+        }
+      },
+    },
+  ],
+});
+const result = computedAsync(async () => {
+  const urlValue = url.value;
+  return await request(urlValue);
+});
+</script>
+
+<template>
+  <div>
+    <c-input-text
+      v-model:value="url"
+      label="Website url"
+      placeholder="Put your website url here..."
+      clearable
+      mb-2
+      :validation="urlValidation"
+    />
+
+    <c-alert v-if="result !== 'Safe'" type="error">
+      Danger! '{{ url }}' website is listed as not safe by Google Safe Browsing: <strong>{{ result }}</strong>
+      <c-alert />
+    </c-alert>
+    <c-alert v-if="result" type="success">
+      This website is safe.
+      <c-alert />
+    </c-alert>
+  </div>
+</template>