From e80ffe0b9736a559b89dacb5f24c5d882f1da058 Mon Sep 17 00:00:00 2001
From: Vladimir <kotopes231@gmail.com>
Date: Wed, 13 Mar 2024 03:35:10 +0200
Subject: [PATCH] make TryIt work with Sanctum's cookie based authentication
 out of the box

---
 resources/views/docs.blade.php | 40 ++++++++++++++++++++++++++++++++++
 1 file changed, 40 insertions(+)
diff --git a/resources/views/docs.blade.php b/resources/views/docs.blade.php
index fbc1ab28..cdf5b978 100644
--- a/resources/views/docs.blade.php
+++ b/resources/views/docs.blade.php
@@ -6,7 +6,47 @@
     <title>{{ config('app.name') }} - API Docs</title>
 
     <script src="https://unpkg.com/@stoplight/elements/web-components.min.js"></script>
+
     <link rel="stylesheet" href="https://unpkg.com/@stoplight/elements/styles.min.css">
+    <script>
+        const originalFetch = window.fetch;
+
+        // intercept TryIt requests and add the XSRF-TOKEN header,
+        // which is necessary for Sanctum cookie-based authentication to work correctly
+        window.fetch = (url, options) => {
+            const CSRF_TOKEN_COOKIE_KEY = "XSRF-TOKEN";
+            const CSRF_TOKEN_HEADER_KEY = "X-XSRF-TOKEN";
+            const getCookieValue = (key) => {
+                const cookie = document.cookie.split(';').find((cookie) => cookie.trim().startsWith(key));
+                return cookie?.split("=")[1];
+            };
+
+            const updateFetchHeaders = (
+                headers,
+                headerKey,
+                headerValue,
+            ) => {
+                if (headers instanceof Headers) {
+                    headers.set(headerKey, headerValue);
+                } else if (Array.isArray(headers)) {
+                    headers.push([headerKey, headerValue]);
+                } else if (headers) {
+                    headers[headerKey] = headerValue;
+                }
+            };
+            const csrfToken = getCookieValue(CSRF_TOKEN_COOKIE_KEY);
+            if (csrfToken) {
+                const { headers = new Headers() } = options || {};
+                updateFetchHeaders(headers, CSRF_TOKEN_HEADER_KEY, unescape(csrfToken));
+                return originalFetch(url, {
+                    ...options,
+                    headers,
+                });
+            }
+
+            return originalFetch(url, options);
+        };
+    </script>
 </head>
 <body style="height: 100vh; overflow-y: hidden">
 <elements-api
