haerinn
How to ideally protecting routes with Layout
I was using Solid Start with auth js, everything fine.
But when i look the server log, it was called twice.
What i expect the server fn will call once and use cache for the rest.
Here's my code:
But if this common behavior, it is unnecessary?
[login]-> [getSession & wrap in server fn with key]-> [call in layout]-> [also call in page]-> [called twice]
[login]-> [getSession & wrap in server fn with key]-> [call in layout]-> [also call in page]-> [called twice]
// server.ts
export const authorize = query(async ()=> {
"use server"
const req = getRequestEvent()?.request // solid/web
const sesh = await getSession(req, authOptions) // auth-js
// this called twice
console.log(sesh)
if(!sesh) throw redirect("/login")
return sesh
},"sesh")
export const getPosts = query(async ()=> {
"use server"
await authorize()
const someQuery = await db.query()
return someQuery
}, "posts")
export const getPostById = query(async (id: string)=> {
"use server"
await authorize()
const someQuery = await db.query(id)
return someQuery
}, "post-by-id")
// server.ts
export const authorize = query(async ()=> {
"use server"
const req = getRequestEvent()?.request // solid/web
const sesh = await getSession(req, authOptions) // auth-js
// this called twice
console.log(sesh)
if(!sesh) throw redirect("/login")
return sesh
},"sesh")
export const getPosts = query(async ()=> {
"use server"
await authorize()
const someQuery = await db.query()
return someQuery
}, "posts")
export const getPostById = query(async (id: string)=> {
"use server"
await authorize()
const someQuery = await db.query(id)
return someQuery
}, "post-by-id")
// some-layout.tsx
export route = {
preload: ()=> {
authorize()
}
}
// this called once
export default function Layout(){
const sesh = createAsync(()=> authorize())
}
// some-layout.tsx
export route = {
preload: ()=> {
authorize()
}
}
// this called once
export default function Layout(){
const sesh = createAsync(()=> authorize())
}
// some-layout/random-post.tsx
export route = {
preload: ({ location })=> {
const id = ...
getPostById(id)
getPosts()
}
}
// this called once
export default function PostPage(props){
const posts = createAsync(()=> getPosts())
const post = createAsync(()=> getPostById(props.etc.id))
}
// some-layout/random-post.tsx
export route = {
preload: ({ location })=> {
const id = ...
getPostById(id)
getPosts()
}
}
// this called once
export default function PostPage(props){
const posts = createAsync(()=> getPosts())
const post = createAsync(()=> getPostById(props.etc.id))
}
4 replies