SolidJSS
SolidJS•3y ago•
6 replies
미기

SolidStart error on redirect

Hello, I'm a newcomer to SolidJS and SolidStart. I am trying to redirect from one page to another, but it gives me an error while I do return redirect("/inquiry/" + form.get("personalCode"));. The site loads well if I refresh the page or go to the page directly.

The Error
Internal Server Error (Make sure your app is wrapped in a <Router />)

This error happened inside a server function and you didn't handle it. So the client will receive an Internal Server Error. You can catch the error and throw a ServerError that makes sense for your UI. In production, the user will have no idea what the error is: 

Error: Make sure your app is wrapped in a <Router />
    at Module.invariant (/Users/mingeon/Algorix/evis-solid/node_modules/@solidjs/router/dist/utils.js:33:15)
    at useRouter (/Users/mingeon/Algorix/evis-solid/node_modules/@solidjs/router/dist/routing.js:18:47)
    at useRoute (/Users/mingeon/Algorix/evis-solid/node_modules/@solidjs/router/dist/routing.js:21:90)
    at Module.useParams (/Users/mingeon/Algorix/evis-solid/node_modules/@solidjs/router/dist/routing.js:54:25)
    at Object.$$serverHandler0 (/Users/mingeon/Algorix/evis-solid/src/routes/inquiry/[code].tsx:30:47)
    at execute (/Users/mingeon/Algorix/evis-solid/node_modules/solid-start/server/server-functions/server.ts:189:37)
    at Object.fn (/Users/mingeon/Algorix/evis-solid/node_modules/solid-start/server/server-functions/server.ts:201:12)
    at Module.handleServerRequest (/Users/mingeon/Algorix/evis-solid/node_modules/solid-start/server/server-functions/server.ts:164:34)
    at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
    at async eval (/Users/mingeon/Algorix/evis-solid/node_modules/solid-start/server/middleware.ts:39:30)
    at async eval (/Users/mingeon/Algorix/evis-solid/node_modules/solid-start/api/middleware.ts:40:12)
    at async eval (/Users/mingeon/Algorix/evis-solid/node_modules/solid-start/entry-server/StartServer.tsx:45:12)
    at async devFetch (file:///Users/mingeon/Algorix/evis-solid/node_modules/solid-start/dev/server.js:111:12)
    at async startHandler (file:///Users/mingeon/Algorix/evis-solid/node_modules/solid-start/dev/server.js:134:20)


personal_code.tsx(origin)
import { Show } from "solid-js";
import { createRouteAction, redirect } from "solid-start";

export default function PersonalCode() {
    const [loading, { Form }] = createRouteAction(async (form: FormData) => {
        if (!form.get("personalCode")) {
            throw "개인번호를 입력해주세요.";
        }
        return redirect("/inquiry/" + form.get("personalCode")); 
    });
    return (
        <main class="bg-gray-100">
            <div class="min-h-screen flex items-center justify-center">
                <div class="bg-white rounded-lg p-10 shadow-md">
                    <h1 class="text-3xl font-bold mb-6">EVIS: 고사장 조회 시스템</h1>
                    <Form>
                        <label class="block mb-2">조회용 개인번호</label>
                        <input name="personalCode" class="block w-full mb-4 p-2 border border-gray-300 rounded" type="text" disabled={loading.pending}/>
                        <button class="w-full py-3 px-6 text-center font-semibold text-white rounded-lg bg-blue-500" type="submit" disabled={loading.pending}>
                            조회하기
                        </button>
                        <Show when={loading.error}>
                            <p class="text-red-500 mt-4 text-sm">{loading.error}</p>
                        </Show>
                    </Form>
                </div>
            </div>
        </main>
    )
}

(continuing below)
Was this page helpful?