You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
So, I am getting this error while building docker-image of my Next.Js project,
I am using "docker compose up" for image generation & getting a type error,
`
Linting and checking validity of types ...
67.78 Collecting page data ...
69.05 TypeError: Cannot read properties of undefined (reading 'startsWith')
69.05 at new I (/app/.next/server/chunks/837.js:1:67492)
69.05 at new C (/app/.next/server/chunks/837.js:1:63902)
69.05 at 98080 (/app/.next/server/app/api/webhooks/clerk/route.js:1:2683)
69.05 at t (/app/.next/server/webpack-runtime.js:1:128)
69.05 at a (/app/.next/server/app/api/webhooks/clerk/route.js:1:742423)
69.05 at /app/.next/server/app/api/webhooks/clerk/route.js:1:742462
69.05 at t.X (/app/.next/server/webpack-runtime.js:1:1206)
69.05 at /app/.next/server/app/api/webhooks/clerk/route.js:1:742436
69.05 at Object. (/app/.next/server/app/api/webhooks/clerk/route.js:1:742490)
69.05 at Module._compile (node:internal/modules/cjs/loader:1376:14)
69.06
69.06 > Build error occurred
69.06 Error: Failed to collect page data for /api/webhooks/clerk
69.06 at /app/node_modules/next/dist/build/utils.js:1220:15
69.06 at process.processTicksAndRejections (node:internal/process/task_queues:95:5) {
69.06 type: 'Error'
69.06 }
failed to solve: process "/bin/sh -c npm run build" did not complete successfully: exit code: 1
`
ChatGpt says, It's a type error is being initiated from my clerk webhook endpoint file: route.ts
here is my webhook endpoint route.ts:
`
import { Webhook } from "svix";
import { headers } from "next/headers";
import { type WebhookEvent } from "@clerk/nextjs/server";
import { db } from "@/lib/db";
import { NextRequest, NextResponse } from "next/server";
import { resetIngresses } from "@/actions/ingress";
export async function POST(req: NextRequest) {
// You can find this in the Clerk Dashboard -> Webhooks -> choose the webhook
const WEBHOOK_SECRET = process.env.CLERK_WEBHOOK_SECRET;
if (!WEBHOOK_SECRET) {
throw new Error(
"Please add CLERK_WEBHOOK_SECRET from Clerk Dashboard to .env or .env.local"
);
}
// Get the headers
const headerPayload = headers();
const svix_id = headerPayload.get("svix-id");
const svix_timestamp = headerPayload.get("svix-timestamp");
const svix_signature = headerPayload.get("svix-signature");
// If there are no headers, error out
if (!svix_id || !svix_timestamp || !svix_signature) {
return new NextResponse("Error occured -- no svix headers", {
status: 400,
});
}
// Get the body
const payload = await req.json();
const body = JSON.stringify(payload);
// Create a new Svix instance with your secret.
const wh = new Webhook(WEBHOOK_SECRET);
let evt: WebhookEvent;
// Verify the payload with the headers
try {
evt = wh.verify(body, {
"svix-id": svix_id,
"svix-timestamp": svix_timestamp,
"svix-signature": svix_signature,
}) as WebhookEvent;
} catch (err) {
console.error("Error verifying webhook:", err);
return new NextResponse("Error occured", {
status: 400,
});
}
// Get the ID and type
const { id } = evt.data;
const eventType = evt.type;
console.log(Webhook with and ID of ${id} and type of ${eventType});
// console.log("Webhook body:", body);
reacted with thumbs up emoji reacted with thumbs down emoji reacted with laugh emoji reacted with hooray emoji reacted with confused emoji reacted with heart emoji reacted with rocket emoji reacted with eyes emoji
-
So, I am getting this error while building docker-image of my Next.Js project,
I am using "docker compose up" for image generation & getting a type error,
`
Linting and checking validity of types ...
67.78 Collecting page data ...
69.05 TypeError: Cannot read properties of undefined (reading 'startsWith')
69.05 at new I (/app/.next/server/chunks/837.js:1:67492)
69.05 at new C (/app/.next/server/chunks/837.js:1:63902)
69.05 at 98080 (/app/.next/server/app/api/webhooks/clerk/route.js:1:2683)
69.05 at t (/app/.next/server/webpack-runtime.js:1:128)
69.05 at a (/app/.next/server/app/api/webhooks/clerk/route.js:1:742423)
69.05 at /app/.next/server/app/api/webhooks/clerk/route.js:1:742462
69.05 at t.X (/app/.next/server/webpack-runtime.js:1:1206)
69.05 at /app/.next/server/app/api/webhooks/clerk/route.js:1:742436
69.05 at Object. (/app/.next/server/app/api/webhooks/clerk/route.js:1:742490)
69.05 at Module._compile (node:internal/modules/cjs/loader:1376:14)
69.06
69.06 > Build error occurred
69.06 Error: Failed to collect page data for /api/webhooks/clerk
69.06 at /app/node_modules/next/dist/build/utils.js:1220:15
69.06 at process.processTicksAndRejections (node:internal/process/task_queues:95:5) {
69.06 type: 'Error'
69.06 }
failed to solve: process "/bin/sh -c npm run build" did not complete successfully: exit code: 1
`
ChatGpt says, It's a type error is being initiated from my clerk webhook endpoint file: route.ts
here is my webhook endpoint route.ts:
`
import { Webhook } from "svix";
import { headers } from "next/headers";
import { type WebhookEvent } from "@clerk/nextjs/server";
import { db } from "@/lib/db";
import { NextRequest, NextResponse } from "next/server";
import { resetIngresses } from "@/actions/ingress";
export async function POST(req: NextRequest) {
// You can find this in the Clerk Dashboard -> Webhooks -> choose the webhook
const WEBHOOK_SECRET = process.env.CLERK_WEBHOOK_SECRET;
if (!WEBHOOK_SECRET) {
throw new Error(
"Please add CLERK_WEBHOOK_SECRET from Clerk Dashboard to .env or .env.local"
);
}
// Get the headers
const headerPayload = headers();
const svix_id = headerPayload.get("svix-id");
const svix_timestamp = headerPayload.get("svix-timestamp");
const svix_signature = headerPayload.get("svix-signature");
// If there are no headers, error out
if (!svix_id || !svix_timestamp || !svix_signature) {
return new NextResponse("Error occured -- no svix headers", {
status: 400,
});
}
// Get the body
const payload = await req.json();
const body = JSON.stringify(payload);
// Create a new Svix instance with your secret.
const wh = new Webhook(WEBHOOK_SECRET);
let evt: WebhookEvent;
// Verify the payload with the headers
try {
evt = wh.verify(body, {
"svix-id": svix_id,
"svix-timestamp": svix_timestamp,
"svix-signature": svix_signature,
}) as WebhookEvent;
} catch (err) {
console.error("Error verifying webhook:", err);
return new NextResponse("Error occured", {
status: 400,
});
}
// Get the ID and type
const { id } = evt.data;
const eventType = evt.type;
console.log(
Webhook with and ID of ${id} and type of ${eventType}
);// console.log("Webhook body:", body);
if (eventType === "user.created") {
await db.user.create({
data: {
username: payload.data.username,
name: payload.data.first_name + " " + payload.data.last_name,
email: payload.data.email_addresses[0].email_address,
externalUserId: payload.data.id,
imageUrl: payload.data.image_url,
stream: {
create: {
name:
${payload.data.username}'s stream
,},
},
},
});
}
if (eventType === "user.updated") {
await db.user.update({
where: { externalUserId: payload.data.id },
data: {
username: payload.data.username,
name: payload.data.first_name + " " + payload.data.last_name,
email: payload.data.email_addresses[0].email_address,
imageUrl: payload.data.image_url,
},
});
}
if (eventType === "user.deleted") {
await resetIngresses(payload.data.id);
}
return new NextResponse("", { status: 200 });
}
`
I am not sure, that this error caused by clerk or Next.js
Therefore, sharing it here, so someone can explain/resolve it,
Beta Was this translation helpful? Give feedback.
All reactions