feat(WEB-132): add middlewares, support for seamless login and improve lang based routes

This commit is contained in:
Michael Zetterberg
2024-04-08 16:08:35 +02:00
parent 8ab5325fc3
commit 7093a0b2dd
31 changed files with 493 additions and 188 deletions

View File

@@ -16,3 +16,4 @@ NEXTAUTH_REDIRECT_PROXY_URL="http://localhost:3000/api/auth"
NEXTAUTH_SECRET=""
NEXTAUTH_URL="http://localhost:3000/api/auth"
REVALIDATE_SECRET=""
WEBVIEW_ENCRYPTION_KEY="MTIzNDU2Nzg5MDEyMzQ1Njc4OTAxMjM0NTY3ODkwMTI="

View File

@@ -1,6 +1,4 @@
import { redirect } from "next/navigation"
import { auth } from "@/auth"
import { auth, signIn } from "@/auth"
import type { LangParams, LayoutArgs } from "@/types/params"
@@ -14,7 +12,10 @@ export default async function ProtectedLayout({
* protected route group is actually protected.
*/
if (!session) {
return redirect(`/${params.lang}/login`)
await signIn("curity", undefined, {
ui_locales: params.lang,
})
return null
}
return <>{children}</>

View File

@@ -1,21 +0,0 @@
import { signIn } from "@/auth"
import { pageNames } from "@/constants/myPages"
import type { LangParams, Params } from "@/types/params"
export default async function Page({ params }: Params<LangParams>) {
async function login() {
"use server"
await signIn("curity", {
redirectTo: `/${params.lang}/${pageNames[params.lang]}`,
})
}
return (
<main>
<form action={login}>
<button type="submit">Sign In</button>
</form>
</main>
)
}

View File

@@ -0,0 +1,47 @@
import { NextRequest, NextResponse } from "next/server"
import { AuthError } from "next-auth"
import { signIn } from "@/auth"
import { badRequest } from "@/server/errors/next"
import type { Lang } from "@/constants/languages"
export async function GET(
request: NextRequest,
context: { params: { lang: Lang } }
) {
const redirectTo =
request.headers.get("x-redirect-to") ||
request.nextUrl.searchParams.get("redirectTo") ||
undefined
try {
/**
* Passing `redirect: false` to `signIn` will return the URL instead of
* automatically redirecting to it inside of `signIn`.
* https://github.com/nextauthjs/next-auth/blob/3c035ec/packages/next-auth/src/lib/actions.ts#L76
*/
const url = await signIn(
"curity",
{
redirectTo,
redirect: false,
},
{
ui_locales: context.params.lang,
}
)
if (url) {
return NextResponse.redirect(url)
}
} catch (error) {
if (error instanceof AuthError) {
console.log({ signInAuthError: error })
} else {
console.log({ signInError: error })
}
}
return badRequest()
}

View File

@@ -8,7 +8,6 @@ import SkipToMainContent from "@/components/SkipToMainContent"
import type { Metadata } from "next"
import type { LangParams, LayoutArgs } from "@/types/params"
import VwoScript from "@/components/Current/NewVWOScript"
export const fetchCache = "default-no-store"
@@ -40,10 +39,6 @@ export default function RootLayout({
id="Cookiebot"
src="https://consent.cookiebot.com/uc.js"
/>
{/* <Script
data-cookieconsent="ignore"
src="/_static/dist/js/head.js?85c84c9e24ae8da3e7af"
/> */}
<Script
data-cookieconsent="ignore"
src="/_static/dist/js/inline.js?00133e5a37de35c51a5d"
@@ -64,11 +59,6 @@ export default function RootLayout({
data-cookieconsent="ignore"
src="/_static/dist/js/ng/main.js?1705409330990"
/>
{/* <Script
data-cookieconsent="ignore"
src="/_static/dist/js/main-ng.js?336b801d6b38eff10884"
strategy="lazyOnload"
/> */}
<Script id="ensure-datalayer">{`
window.datalayer = window.datalayer || {}
`}</Script>

View File

@@ -0,0 +1,17 @@
import type { Metadata } from "next"
import type { LangParams, LayoutArgs } from "@/types/params"
export const metadata: Metadata = {
title: "Webview",
}
export default function RootLayout({
children,
params,
}: React.PropsWithChildren<LayoutArgs<LangParams>>) {
return (
<html lang={params.lang}>
<body>{children}</body>
</html>
)
}

View File

@@ -0,0 +1,15 @@
import type { Metadata } from "next"
export const metadata: Metadata = {
title: "Hello World from Webview",
}
export default function WebViewTestPage() {
return (
<main>
<header>
<h1>Hello From WebView Test Page!</h1>
</header>
</main>
)
}

34
auth.ts
View File

@@ -19,6 +19,12 @@ const customProvider = {
url: `${env.CURITY_ISSUER_USER}/oauth/v2/authorize`,
params: {
scope: ["openid"],
/**
* The `acr_values` param is used to make Curity display the proper login
* page for Scandic. Without the parameter Curity presents some choices
* to the user which we do not want.
*/
acr_values: "acr",
},
},
token: {
@@ -39,10 +45,6 @@ const customProvider = {
} satisfies OIDCConfig<User>
export const config = {
// basePath: "/api/auth",
// pages: {
// signIn: "/auth/login",
// },
providers: [customProvider],
redirectProxyUrl: env.NEXTAUTH_REDIRECT_PROXY_URL,
trustHost: true,
@@ -72,19 +74,27 @@ export const config = {
},
}
}
return session
},
async redirect({ baseUrl, url }) {
console.log("****** REDIRECT *******")
console.log({ baseUrl })
console.log({ url })
console.log("****** END - REDIRECT *******")
// Allows relative callback URLs
if (url.startsWith("/")) {
// Allows relative callback URLs
return `${baseUrl}${url}`
} else if (new URL(url).origin === baseUrl) {
// Allows callback URLs on the same origin
return url
} else {
// Assume absolute URL
try {
const parsedUrl = new URL(url)
if (parsedUrl.hostname.endsWith(".scandichotels.com")) {
// Allows **.scandichotels.com
return url
} else if (parsedUrl.origin === baseUrl) {
// Allows callback URLs on the same origin
return url
}
} catch (e) {
console.error(e)
}
}
return baseUrl
},

View File

@@ -1,18 +0,0 @@
/**
* @file Due to these records being used in next.config.js, and that is required
* to be a js file, we use jsdoc to type these.
*/
/**
* @typedef {import('@/constants/languages').Lang} Lang
*/
/** @type {Record.<Lang, string>} */
export const pageNames = {
da: "mine-sider",
de: "mein-profil",
en: "my-pages",
fi: "minun-sivujani",
no: "mine-sider",
sv: "mina-sidor",
}

View File

@@ -0,0 +1,11 @@
import { myPages, profile } from "./myPages"
/**
* These are routes in code we know requires auth
*
* Some of these are rewritten in next.config.js
*/
export const authRequired = [
...Object.values(myPages),
...Object.values(profile),
]

View File

@@ -0,0 +1,25 @@
/**
* These are routes for login, logout, signup, etc.
*/
/** @type {import('@/types/routes').LangRoute} */
export const login = {
da: "/da/log-pa",
de: "/de/anmeldung",
en: "/en/login",
fi: "/fi/kirjaudu-sisaan",
no: "/no/logg-inn",
sv: "/sv/logga-in",
}
/** @type {import('@/types/routes').LangRoute} */
export const logout = {
da: "/da/log-ud",
de: "/de/ausloggen",
en: "/en/logout",
fi: "/fi/kirjautua-ulos",
no: "/no/logg-ut",
sv: "/sv/logga-ut",
}
export const handleAuth = [...Object.values(login), ...Object.values(logout)]

View File

@@ -0,0 +1,28 @@
/**
* @file Due to these records being used in next.config.js, and that is required
* to be a js file, we use jsdoc to type these.
*/
/**
* These are routes that define code entries for My pages
*/
/** @type {import('@/types/routes').LangRoute} */
export const myPages = {
da: "/da/mine-sider",
de: "/de/mein-profil",
en: "/en/my-pages",
fi: "/fi/minun-sivujani",
no: "/no/mine-sider",
sv: "/sv/mina-sidor",
}
/** @type {import('@/types/routes').LangRoute} */
export const profile = {
da: `${myPages.da}/profil-da`,
de: `${myPages.de}/profile-de`,
en: `${myPages.en}/profile-en`,
fi: `${myPages.fi}/profile-fi`,
no: `${myPages.no}/profile-no`,
sv: `${myPages.sv}/profile-sv`,
}

2
env/server.ts vendored
View File

@@ -22,6 +22,7 @@ export const env = createEnv({
NODE_ENV: z.enum(["development", "test", "production"]),
PRINT_QUERY: z.boolean().default(false),
REVALIDATE_SECRET: z.string(),
WEBVIEW_ENCRYPTION_KEY: z.string(),
},
emptyStringAsUndefined: true,
runtimeEnv: {
@@ -44,5 +45,6 @@ export const env = createEnv({
NODE_ENV: process.env.NODE_ENV,
PRINT_QUERY: process.env.PRINT_QUERY,
REVALIDATE_SECRET: process.env.REVALIDATE_SECRET,
WEBVIEW_ENCRYPTION_KEY: process.env.WEBVIEW_ENCRYPTION_KEY,
},
})

View File

@@ -1,101 +1,28 @@
import { NextRequest, NextResponse } from "next/server"
import { NextMiddleware } from "next/server"
import { auth } from "@/auth"
import * as handleAuth from "./middlewares/handleAuth"
import * as authRequired from "./middlewares/authRequired"
import * as currentWebLogin from "./middlewares/currentWebLogin"
import * as ensureLang from "./middlewares/ensureLang"
import * as cmsContent from "@/middlewares/cmsContent"
import * as webView from "@/middlewares/webView"
import { findLang } from "@/constants/languages"
import { pageNames } from "@/constants/myPages"
export const middleware: NextMiddleware = async (request, event) => {
const middlewares = [
ensureLang,
currentWebLogin,
authRequired,
handleAuth,
webView,
cmsContent,
]
import { protectedRoutes } from "@/routes/protected"
for (let i = 0; i < middlewares.length; ++i) {
const middleware = middlewares[i]
import type { NextAuthRequest } from "next-auth"
export async function publiceMiddleware(request: NextRequest) {
const { nextUrl } = request
const lang = findLang(nextUrl.pathname)
if (nextUrl.pathname.startsWith(`/${lang}/login`)) {
return NextResponse.next()
}
const contentType = "currentContentPage"
const pathNameWithoutLang = nextUrl.pathname.replace(`/${lang}`, "")
const searchParams = new URLSearchParams(request.nextUrl.searchParams)
if (request.nextUrl.pathname.includes("preview")) {
searchParams.set("uri", pathNameWithoutLang.replace("/preview", ""))
return NextResponse.rewrite(
new URL(`/${lang}/preview-current?${searchParams.toString()}`, nextUrl)
)
}
searchParams.set("uri", pathNameWithoutLang)
switch (contentType) {
case "currentContentPage":
return NextResponse.rewrite(
new URL(
`/${lang}/current-content-page?${searchParams.toString()}`,
nextUrl
)
)
}
// Unreachable atm
return NextResponse.next()
}
async function authedMiddlewareFunction(request: NextAuthRequest) {
const { nextUrl } = request
const lang = findLang(nextUrl.pathname)!
const isLoggedIn = !!request.auth
if (isLoggedIn) {
/**
* Temporary hard rewrite to my pages
*/
return NextResponse.rewrite(new URL(`/${lang}/${pageNames[lang]}`, nextUrl))
} else {
/**
* Redirect to Loginpage
* (Loginpage most likely to be removed)
*/
return NextResponse.redirect(new URL(`/${lang}/login`, nextUrl))
}
}
const authedMiddleware = auth(authedMiddlewareFunction)
export async function middleware(request: NextRequest) {
const { nextUrl } = request
const lang = findLang(nextUrl.pathname)
if (!lang) {
return Response.json("Not found!!!", { status: 404 })
}
const isProtectedRoute = protectedRoutes.includes(nextUrl.pathname)
if (isProtectedRoute) {
/**
* AppRouteHandlerFnContext is the context that is passed to the handler as
* the second argument. This is only done for Route handlers (route.js) and
* not for middleware.
*
* Auth.js uses the same pattern for both Route handlers and Middleware,
* the auth()-wrapper:
*
* auth((req) => { ... })
*
* But there is a difference between middleware and route handlers, route
* handlers get passed a context which middleware do not get. Using the
* same function for both works runtime because second argument is just
* undefined for middleware and Auth.js handles this properly. But fails in
* typings as the second argument doesn't exist for middleware.
*
* https://github.com/nextauthjs/next-auth/blob/3c035ec62f2f21d7cab65504ba83fb1a9a13be01/packages/next-auth/src/lib/index.ts#L265
* https://authjs.dev/reference/nextjs
*/
// @ts-expect-error: see above
return authedMiddleware(request)
} else {
return publiceMiddleware(request)
if (middleware.matcher(request)) {
return await middleware.middleware(request, event)
}
}
}

View File

@@ -0,0 +1,53 @@
import { NextResponse } from "next/server"
import { auth } from "@/auth"
import { findLang } from "@/constants/languages"
import { authRequired } from "@/constants/routes/authRequired"
import { login } from "@/constants/routes/handleAuth"
import type { NextMiddleware } from "next/server"
import type { MiddlewareMatcher } from "@/types/middleware"
/**
* AppRouteHandlerFnContext is the context that is passed to the handler as
* the second argument. This is only done for Route handlers (route.js) and
* not for middleware. Middleware`s second argument is `event` of type
* `NextFetchEvent`.
*
* Auth.js uses the same pattern for both Route handlers and Middleware,
* the auth()-wrapper:
*
* auth((req) => { ... })
*
* But there is a difference between middleware and route handlers, route
* handlers get passed a context which middleware do not get (they get a
* NextFetchEvent instead). Using the same function for both works runtime
* because Auth.js handles this properly. But fails in typings as the second
* argument doesn't match for middleware.
*
* We want to avoid using ts-expect-error because that hides other errors
* not related to this typing error and ts-expect-error cannot be scoped either.
*
* So we type assert this export to NextMiddleware. The lesser of all evils.
*
* https://github.com/nextauthjs/next-auth/blob/3c035ec62f2f21d7cab65504ba83fb1a9a13be01/packages/next-auth/src/lib/index.ts#L265
* https://authjs.dev/reference/nextjs
*/
export const middleware = auth(async (request) => {
const { nextUrl } = request
const lang = findLang(nextUrl.pathname)!
const isLoggedIn = !!request.auth
if (isLoggedIn) {
return NextResponse.next()
}
const loginUrl = login[lang]
return NextResponse.redirect(new URL(loginUrl, request.nextUrl))
}) as NextMiddleware // See comment above
export const matcher: MiddlewareMatcher = (request) => {
return authRequired.includes(request.nextUrl.pathname)
}

40
middlewares/cmsContent.ts Normal file
View File

@@ -0,0 +1,40 @@
import { NextResponse } from "next/server"
import { findLang } from "@/constants/languages"
import type { NextMiddleware } from "next/server"
import { MiddlewareMatcher } from "@/types/middleware"
export const middleware: NextMiddleware = async (request) => {
const { nextUrl } = request
const lang = findLang(nextUrl.pathname)
const contentType = "currentContentPage"
const pathNameWithoutLang = nextUrl.pathname.replace(`/${lang}`, "")
const searchParams = new URLSearchParams(request.nextUrl.searchParams)
if (request.nextUrl.pathname.includes("preview")) {
searchParams.set("uri", pathNameWithoutLang.replace("/preview", ""))
return NextResponse.rewrite(
new URL(`/${lang}/preview-current?${searchParams.toString()}`, nextUrl)
)
}
searchParams.set("uri", pathNameWithoutLang)
switch (contentType) {
case "currentContentPage":
return NextResponse.rewrite(
new URL(
`/${lang}/current-content-page?${searchParams.toString()}`,
nextUrl
)
)
default:
return NextResponse.next()
}
}
export const matcher: MiddlewareMatcher = (request) => {
return true
}

View File

@@ -0,0 +1,31 @@
import { NextResponse } from "next/server"
import { findLang } from "@/constants/languages"
import { badRequest } from "@/server/errors/next"
import type { NextMiddleware } from "next/server"
import type { MiddlewareMatcher } from "@/types/middleware"
export const middleware: NextMiddleware = (request) => {
const redirectTo = request.nextUrl.searchParams.get("returnurl")
if (!redirectTo) {
return badRequest()
}
const lang = findLang(request.nextUrl.pathname)!
const headers = new Headers(request.headers)
headers.set("x-redirect-to", redirectTo)
return NextResponse.rewrite(new URL(`/${lang}/login`, request.nextUrl), {
request: {
headers,
},
})
}
export const matcher: MiddlewareMatcher = (request) => {
return request.nextUrl.pathname.endsWith("/updatelogin")
}

15
middlewares/ensureLang.ts Normal file
View File

@@ -0,0 +1,15 @@
import { NextResponse } from "next/server"
import { findLang } from "@/constants/languages"
import type { NextMiddleware } from "next/server"
import type { MiddlewareMatcher } from "@/types/middleware"
export const middleware: NextMiddleware = () => {
return new NextResponse("Not found", { status: 404 })
}
export const matcher: MiddlewareMatcher = (request) => {
return !findLang(request.nextUrl.pathname)
}

15
middlewares/handleAuth.ts Normal file
View File

@@ -0,0 +1,15 @@
import { NextResponse } from "next/server"
import { handleAuth } from "@/constants/routes/handleAuth"
import type { NextMiddleware } from "next/server"
import type { MiddlewareMatcher } from "@/types/middleware"
export const middleware: NextMiddleware = () => {
return NextResponse.next()
}
export const matcher: MiddlewareMatcher = (request) => {
return handleAuth.includes(request.nextUrl.pathname)
}

59
middlewares/webView.ts Normal file
View File

@@ -0,0 +1,59 @@
import { NextResponse, type NextMiddleware } from "next/server"
import { findLang } from "@/constants/languages"
import { env } from "@/env/server"
import { badRequest, internalServerError } from "@/server/errors/next"
import { decryptData } from "@/utils/aes"
import type { MiddlewareMatcher } from "@/types/middleware"
export const middleware: NextMiddleware = async (request) => {
const webviewToken = request.cookies.get("webviewToken")
if (webviewToken) {
// since the token exists, this is a subsequent visit
// we're done, allow it
return NextResponse.next()
}
// Authorization header is required for webviews
// It should be base64 encoded
const authorization = request.headers.get("Authorization")!
if (!authorization) {
return badRequest()
}
// Initialization vector header is required for webviews
// It should be base64 encoded
const initializationVector = request.headers.get("X-AES-IV")!
if (!initializationVector) {
return badRequest()
}
try {
const decryptedData = await decryptData(
env.WEBVIEW_ENCRYPTION_KEY,
initializationVector,
authorization
)
// Pass the webview token via cookie to the page
return NextResponse.next({
headers: {
"Set-Cookie": `webviewToken=${decryptedData}; Secure; HttpOnly;`,
},
})
} catch (e) {
if (e instanceof Error) {
console.error(`${e.name}: ${e.message}`)
}
return badRequest()
}
}
export const matcher: MiddlewareMatcher = (request) => {
const { nextUrl } = request
const lang = findLang(nextUrl.pathname)
const pathNameWithoutLang = nextUrl.pathname.replace(`/${lang}`, "")
return pathNameWithoutLang.startsWith("/webview/")
}

View File

@@ -1,12 +1,15 @@
import createJiti from "jiti"
import { pageNames } from "./constants/myPages.js"
const jiti = createJiti(new URL(import.meta.url).pathname)
import { login } from "./constants/routes/handleAuth.js"
import { myPages, profile } from "./constants/routes/myPages.js"
const jiti = createJiti(new URL(import.meta.url).pathname)
jiti("./env/server")
jiti("./env/client")
/** @type {import('next').NextConfig} */
const nextConfig = {
poweredByHeader: false,
eslint: { ignoreDuringBuilds: true },
images: {
remotePatterns: [
@@ -46,11 +49,23 @@ const nextConfig = {
rewrites() {
return {
beforeFiles: [
{ source: `/da/${pageNames.da}`, destination: "/da/my-pages" },
{ source: `/de/${pageNames.de}`, destination: "/de/my-pages" },
{ source: `/fi/${pageNames.fi}`, destination: "/fi/my-pages" },
{ source: `/no/${pageNames.no}`, destination: "/no/my-pages" },
{ source: `/sv/${pageNames.sv}`, destination: "/sv/my-pages" },
{ source: login.da, destination: "/da/login" },
{ source: login.de, destination: "/de/login" },
{ source: login.fi, destination: "/fi/login" },
{ source: login.no, destination: "/no/login" },
{ source: login.sv, destination: "/sv/login" },
{ source: myPages.da, destination: "/da/my-pages" },
{ source: myPages.de, destination: "/de/my-pages" },
{ source: myPages.fi, destination: "/fi/my-pages" },
{ source: myPages.no, destination: "/no/my-pages" },
{ source: myPages.sv, destination: "/sv/my-pages" },
{ source: profile.da, destination: "/da/my-pages/profile" },
{ source: profile.de, destination: "/de/my-pages/profile" },
{ source: profile.fi, destination: "/fi/my-pages/profile" },
{ source: profile.no, destination: "/no/my-pages/profile" },
{ source: profile.sv, destination: "/sv/my-pages/profile" },
],
}
},

View File

@@ -5,7 +5,8 @@
"type": "module",
"scripts": {
"build": "next build",
"dev": "rm -rf .next && next dev",
"predev": "rm -rf .next",
"dev": "next dev",
"lint": "next lint && tsc",
"prepare": "husky install",
"start": "node .next/standalone/server.js",

View File

@@ -1,10 +0,0 @@
import { pageNames } from "@/constants/myPages"
import type { Lang } from "@/constants/languages"
/* Authenticated routes */
export const protectedRoutes: string[] = [
...Object.keys(pageNames).map(
(locale) => `/${locale}/${pageNames[locale as Lang]}`
),
]

13
server/errors/next.ts Normal file
View File

@@ -0,0 +1,13 @@
import { NextResponse } from "next/server"
export function badRequest() {
return new NextResponse("Bad request", {
status: 400,
})
}
export function internalServerError() {
return new NextResponse("Internal Server Error", {
status: 500,
})
}

View File

@@ -1,4 +1,4 @@
import { badRequestError, internalServerError } from "@/server/errors"
import { badRequestError, internalServerError } from "@/server/errors/trpc"
import { protectedProcedure, router } from "@/server/trpc"
import { getUserSchema } from "./output"

View File

@@ -2,7 +2,7 @@ import { initTRPC } from "@trpc/server"
import { env } from "@/env/server"
import { transformer } from "./transformer"
import { unauthorizedError } from "./errors"
import { unauthorizedError } from "./errors/trpc"
import type { Context } from "./context"
import type { Meta } from "@/types/trpc/meta"

9
types/auth.d.ts vendored
View File

@@ -1,5 +1,4 @@
import "next-auth"
import type { NextRequest } from "next/server"
// Module augmentation
// https://authjs.dev/getting-started/typescript#popular-interfaces-to-augment
@@ -22,14 +21,6 @@ declare module "next-auth" {
* Returned by `useSession`, `auth`, contains information about the active session.
*/
interface Session {}
/**
* NextAuthRequest isn't exported by next-auth so we declare a copy
* of how they do it to support or switch in middleware.ts
*/
interface NextAuthRequest extends NextRequest {
auth: Session | null
}
}
declare module "next-auth/jwt" {

3
types/middleware.ts Normal file
View File

@@ -0,0 +1,3 @@
import type { NextRequest } from "next/server"
export type MiddlewareMatcher = (request: NextRequest) => boolean

3
types/routes.ts Normal file
View File

@@ -0,0 +1,3 @@
import { Lang } from "@/constants/languages"
export type LangRoute = Record<Lang, string>

41
utils/aes.ts Normal file
View File

@@ -0,0 +1,41 @@
function base64ToUint8Array(base64String: string) {
const binaryString = atob(base64String)
const byteArray = new Uint8Array(binaryString.length)
for (let i = 0; i < binaryString.length; i++) {
byteArray[i] = binaryString.charCodeAt(i)
}
return byteArray
}
function utf8ToUint8Array(utf8String: string) {
return new TextEncoder().encode(utf8String)
}
function uint8ArrayToUtf8(uint8Array: Uint8Array) {
return new TextDecoder().decode(uint8Array)
}
export async function decryptData(
keyBase64: string,
ivBase64: string,
encryptedDataBase64: string
): Promise<string> {
const keyBuffer = await crypto.subtle.importKey(
"raw",
base64ToUint8Array(keyBase64),
"AES-CBC",
false,
["decrypt"]
)
const encryptedDataBuffer = base64ToUint8Array(encryptedDataBase64)
const ivBuffer = base64ToUint8Array(ivBase64)
const decryptedDataBuffer = await crypto.subtle.decrypt(
{ name: "AES-CBC", iv: ivBuffer },
keyBuffer,
encryptedDataBuffer
)
const decryptedData = uint8ArrayToUtf8(new Uint8Array(decryptedDataBuffer))
return decryptedData
}