colinshen Comments - Answer Overflow

colinshen

Explore posts from servers

•Created by colinshen on 4/26/2024 in #support

Render a new router and redirect in action of opened component doesn't redirect in the opened window

I made a mistake in the above example. SomeComponent calls createAsync instead of createAction(its not a post action). I found the solution, I should not use the redirect in the server function ,just return the url and use location.replace with the new url. Thanks!!

6 replies

SSolidJS

•Created by colinshen on 4/26/2024 in #support

Render a new router and redirect in action of opened component doesn't redirect in the opened window

Is this the browser default behavior? I thought I render a new router in side the window and a new router context was created.

6 replies

SSolidJS

•Created by colinshen on 4/15/2024 in #support

Authentication in both component and middleware

Thanks! I need to pass the login to make it work. Do you think middleware is enough for authentication, not using an auth component or context?

6 replies

SSolidJS

•Created by colinshen on 4/15/2024 in #support

Authentication in both component and middleware

2. In protected component, I can easily redirect in server functions. Doing it again in component with Navigate is definitely not necessary. Should I just return null in the function?

6 replies

SSolidJS

•Created by colinshen on 4/15/2024 in #support

Authentication in both component and middleware

middleware

export default async function authMiddleware(event: FetchEvent) {
    const sessionId =
        getCookie(event.nativeEvent, lucia.sessionCookieName) ?? null;
    if (!sessionId) {
        event.locals.user = null;
        event.locals.session = null;
        return;
    }
    // null when not found in database, expired
    // fresh = true when half of expiration
    const { session, user } = await lucia.validateSession(sessionId);
    if (session && session.fresh) {
        const sessionCookie = lucia.createSessionCookie(session.id);
        setCookie(
            event.nativeEvent,
            sessionCookie.name,
            sessionCookie.value,
            sessionCookie.attributes,
        );
    }
    if (!session) {
        const sessionCookie = lucia.createBlankSessionCookie();
        setCookie(
            event.nativeEvent,
            sessionCookie.name,
            sessionCookie.value,
            sessionCookie.attributes,
        );
    }
    event.locals.user = user;
    event.locals.session = session;
}

export default async function authMiddleware(event: FetchEvent) {
    const sessionId =
        getCookie(event.nativeEvent, lucia.sessionCookieName) ?? null;
    if (!sessionId) {
        event.locals.user = null;
        event.locals.session = null;
        return;
    }
    // null when not found in database, expired
    // fresh = true when half of expiration
    const { session, user } = await lucia.validateSession(sessionId);
    if (session && session.fresh) {
        const sessionCookie = lucia.createSessionCookie(session.id);
        setCookie(
            event.nativeEvent,
            sessionCookie.name,
            sessionCookie.value,
            sessionCookie.attributes,
        );
    }
    if (!session) {
        const sessionCookie = lucia.createBlankSessionCookie();
        setCookie(
            event.nativeEvent,
            sessionCookie.name,
            sessionCookie.value,
            sessionCookie.attributes,
        );
    }
    event.locals.user = user;
    event.locals.session = session;
}

protected component

const getUser = cache(async () => {
    "use server";
    const event = getRequestEvent();
    const user = event?.locals.user;
    if (user) {
        return user;
    } else {
        // return null
        throw redirect("/login");
    }
}, "get-user");
export const ProtectedRoute = (props: ParentProps) => {
    const user = createAsync(() => getUser());
    if (user()) {
        return props.children;
    } else {
        return <Navigate href="/login" />;
    }
};

const getUser = cache(async () => {
    "use server";
    const event = getRequestEvent();
    const user = event?.locals.user;
    if (user) {
        return user;
    } else {
        // return null
        throw redirect("/login");
    }
}, "get-user");
export const ProtectedRoute = (props: ParentProps) => {
    const user = createAsync(() => getUser());
    if (user()) {
        return props.children;
    } else {
        return <Navigate href="/login" />;
    }
};

Problems： 1. If session or user is null, middleware should return a redirect to login page, but redirect function or sendRedirect(from vinxi) cause too many redirect error. If the middleware logic is correct, how to redirect in middleware?

6 replies

SSolidJS

•Created by colinshen on 2/6/2024 in #support

confused about primitives(useEffect,on,createComputed)

I see. I will try your solution.

11 replies

SSolidJS

•Created by colinshen on 2/6/2024 in #support

confused about primitives(useEffect,on,createComputed)

also, value => setSearchParams(param, value) is not type setter. useSearchParams is not reactive..

11 replies

SSolidJS