Extracted gateway for requests

2026-01-18 00:30:29 +02:00
parent 2c021db505
commit 53aed96a05
6 changed files with 68 additions and 17 deletions
@@ -10,6 +10,7 @@
  },
  "dependencies": {
    "@astrojs/vue": "^5.1.3",
+    "@nanostores/vue": "^1.0.1",
    "astro": "^5.16.6",
    "nanostores": "^1.1.0",
    "vue": "^3.5.26"
@@ -11,6 +11,9 @@ importers:
      '@astrojs/vue':
        specifier: ^5.1.3
        version: 5.1.3(@types/node@25.0.3)(astro@5.16.6(@types/node@25.0.3)(rollup@4.54.0)(typescript@5.9.3))(rollup@4.54.0)(vue@3.5.26(typescript@5.9.3))
+      '@nanostores/vue':
+        specifier: ^1.0.1
+        version: 1.0.1(@nanostores/logger@1.0.0(nanostores@1.1.0))(nanostores@1.1.0)(vue@3.5.26(typescript@5.9.3))
      astro:
        specifier: ^5.16.6
        version: 5.16.6(@types/node@25.0.3)(rollup@4.54.0)(typescript@5.9.3)
@@ -516,6 +519,20 @@ packages:
    peerDependencies:
      nanostores: ^0.10.0 || ^0.11.0 || ^1.0.0

+  '@nanostores/vue@1.0.1':
+    resolution: {integrity: sha512-0VwubMTMvEdWQhVN4BAvDZ+vHQH3O1G9BaOfgrjfF4erqBsWScoK/zyaBeRfFjptNOb25947EFPHBZwEf9JcMg==}
+    engines: {node: ^20.0.0 || >=22.0.0}
+    peerDependencies:
+      '@nanostores/logger': ^0.4.0 || ^1.0.0
+      '@vue/devtools-api': '>=7.6.2'
+      nanostores: ^0.11.3 || ^1.0.0
+      vue: '>=3.3.1'
+    peerDependenciesMeta:
+      '@nanostores/logger':
+        optional: true
+      '@vue/devtools-api':
+        optional: true
+
  '@oslojs/encoding@1.1.0':
    resolution: {integrity: sha512-70wQhgYmndg4GCPxPPxPGevRKqTIJ2Nh4OkiMWmDAVYsTQ+Ta7Sq+rPevXyXGdzr30/qZBnyOalCszoMxlyldQ==}

@@ -2499,6 +2516,13 @@ snapshots:
    dependencies:
      nanostores: 1.1.0

+  '@nanostores/vue@1.0.1(@nanostores/logger@1.0.0(nanostores@1.1.0))(nanostores@1.1.0)(vue@3.5.26(typescript@5.9.3))':
+    dependencies:
+      nanostores: 1.1.0
+      vue: 3.5.26(typescript@5.9.3)
+    optionalDependencies:
+      '@nanostores/logger': 1.0.0(nanostores@1.1.0)
+
  '@oslojs/encoding@1.1.0': {}

  '@polka/url@1.0.0-next.29': {}
@@ -1,18 +1,17 @@
 <script setup>
 import {ref} from "vue";
 import {$user} from "./stores/user.js";
+import * as gateway from "./lib/gateway.js";

 const formData = ref({username: '', password: ''})

 async function formSubmit() {
-  const url = `${import.meta.env.PUBLIC_SERVER_URL}/login`
-  const response = await fetch(
-      url,
+  const response = await gateway.request(
+      '/login',
      {
        method: 'POST',
-        mode: 'cors',
-        body: JSON.stringify(formData.value),
-        headers: {'Content-Type': 'application/json'}
+        cors: true,
+        body: JSON.stringify(formData.value)
      }
  )
  if(response.status === 200) {
@@ -0,0 +1,27 @@
+export async function request(path, options) {
+    options ||= {}
+    if(path.startsWith('/')) {
+        path = path.slice(1)
+    }
+
+    let url = new URL(path, import.meta.env.PUBLIC_SERVER_URL)
+    let searchParams = new URLSearchParams(options.searchParams)
+    searchParams.forEach((v, k) => url.searchParams.append(k, v))
+
+    const safeFetch = (options.method === 'GET') || (options.method === 'HEAD')
+    const authorization = (options.token) ? `Bearer ${options.token}` : null
+
+    const fetchInit = {
+        method: options.method || 'GET',
+        body: options.body,
+        mode: options.cors ? 'cors' : undefined,
+        credentials: options.cors ? 'include' : undefined,
+        headers: {
+            'Content-Type': options.contentType ||
+                (safeFetch ? null : 'application/json'),
+            'Authorization': authorization
+        }
+    }
+
+    return await fetch(url, fetchInit)
+}
@@ -11,11 +11,20 @@ const {title} = Astro.props
 		<meta name="viewport" content="width=device-width" />
 		<link rel="icon" type="image/svg+xml" href="/favicon.svg" />
 		<meta name="generator" content={Astro.generator} />
-		<title>Subtle Storm</title>
+		<title>Neon Vertigo</title>
 		<script src="../components/scripts/user_store.js"></script>
 	</head>
 	<body>
 		<h1>{title}</h1>
 		<slot />
+
+		{import.meta.env.DEV &&
+			<script>
+				import { logger } from '@nanostores/logger'
+				import {$user} from "../components/stores/user";
+
+				let _destroy = logger({user: $user})
+				</script>
+		}
 	</body>
 </html>
@@ -5,13 +5,4 @@ import LoginForm from '../components/LoginForm.vue';

 <Layout title="Login">
    <LoginForm client:load />
-</Layout>
-
-{import.meta.env.DEV &&
-    <script>
-        import { logger } from '@nanostores/logger'
-        import {$user} from "../components/stores/user";
-
-        let _destroy = logger({user: $user})
-        </script>
-}
+</Layout>