Next.js Discord

Discord Forum

Failed to Collect Page Data During Build

Unanswered
beanbeanjuice posted this in #help-forum
Open in Discord
I am able to run npm run build fine, but the moment I try to build the docker image it fails. This is the error I get.

 => ERROR [builder 6/6] RUN npm run build                                                                                             35.0s
------
 > [builder 6/6] RUN npm run build:
0.501
0.501 > unauthorizedkitty.art@1.4.3 build
0.501 > next build
0.501
1.159 Attention: Next.js now collects completely anonymous telemetry regarding usage.
1.159 This information is used to shape Next.js' roadmap and prioritize features.
1.159 You can learn more, including how to opt-out if you'd not like to participate in this anonymous program, by visiting the following URL:
1.159 https://nextjs.org/telemetry
1.159
1.267    ▲ Next.js 15.1.5
1.267
1.282    Creating an optimized production build ...
29.87  ✓ Compiled successfully
29.87    Skipping linting
29.87    Checking validity of types ...
34.22    Collecting page data ...
34.80 Error: Unsupported protocol "null in URL: "undefined"
34.80     at new eb (.next/server/app/(api)/api/analytics/route.js:4:2695)
34.80     at new ev (.next/server/app/(api)/api/analytics/route.js:4:9119)
34.80     at new eO (.next/server/app/(api)/api/analytics/route.js:16:308)
34.80     at 70000 (.next/server/app/(api)/api/analytics/route.js:16:620)
34.80     at t (.next/server/webpack-runtime.js:1:143)
34.80     at r (.next/server/app/(api)/api/analytics/route.js:16:28992)
34.80     at <unknown> (.next/server/app/(api)/api/analytics/route.js:16:29019)
34.80     at t.X (.next/server/webpack-runtime.js:1:1285)
34.80     at <unknown> (.next/server/app/(api)/api/analytics/route.js:16:29005)
34.80     at Object.<anonymous> (.next/server/app/(api)/api/analytics/route.js:16:29045)
34.80
34.81 > Build error occurred
34.81 [Error: Failed to collect page data for /api/analytics] {
34.81   type: 'Error'
34.81 }
------
Dockerfile:27


This is my /api/analytics/route.js

import {NextResponse} from "next/server";
import {analytics} from "./Analytics.ts";

const ipToCountryCode = new Map();

async function getCountry(req) {
    const ip = req.headers.get('x-forwarded-for')?.split(',')[0] || '0.0.0.0'; // Get the first IP in case of proxy chains

    console.log(`Checking IP: ${ip}`);  // TODO: DEBUG

    if (ipToCountryCode.has(ip)) {
        return ipToCountryCode.get(ip);
    }

    const res = await fetch(`https://ipinfo.io/${ip}/json`);
    const data = await res.json();

    const country = data.country || 'US';  // Default to 'US' if country is not found
    ipToCountryCode.set(ip, country);
    return country;
}

function isBot(userAgent) {
    const botKeywords = [
        'bot', 'crawl', 'slurp', 'spider', 'WhatsApp', 'TelegramBot', 'Slackbot',
        'Viber', 'Discordbot', 'SkypeUriPreview'
    ];

    if (botKeywords.some(keyword => userAgent.toLowerCase().includes(keyword.toLowerCase()))) {
        console.log(`Bot (${userAgent}) detected. Not counting page views.`);
        return true;
    }

    return false;
}

async function addPageView(req) {
    const page = (await req.json()).page;

    if (!isBot(req.headers.get('user-agent') || '')) {
        getCountry(req).then(async (country) => {
            try {
                await analytics.track('pageview', {
                    page: page,
                    country: country
                });
            } catch (_) { }
        });
    }

    return NextResponse.json({}, {
        status: 200,
    });
}

export const POST = (req) => {
    return addPageView(req);
}


Why would it fail during the Docker build but not when running npm run build without it?

2 Replies

import {NextResponse} from "next/server";
import {analytics} from "./Analytics.ts";

const ipToCountryCode = new Map();

async function getCountry(req) {
    const ip = req.headers.get('x-forwarded-for')?.split(',')[0] || '0.0.0.0'; // Get the first IP in case of proxy chains

    console.log(`Checking IP: ${ip}`);  // TODO: DEBUG

    if (ipToCountryCode.has(ip)) {
        return ipToCountryCode.get(ip);
    }

    const res = await fetch(`https://ipinfo.io/${ip}/json`);
    const data = await res.json();

    const country = data.country || 'US';  // Default to 'US' if country is not found
    ipToCountryCode.set(ip, country);
    return country;
}

function isBot(userAgent) {
    const botKeywords = [
        'bot', 'crawl', 'slurp', 'spider', 'WhatsApp', 'TelegramBot', 'Slackbot',
        'Viber', 'Discordbot', 'SkypeUriPreview'
    ];

    if (botKeywords.some(keyword => userAgent.toLowerCase().includes(keyword.toLowerCase()))) {
        console.log(`Bot (${userAgent}) detected. Not counting page views.`);
        return true;
    }

    return false;
}

async function addPageView(req) {
    const page = (await req.json()).page;

    if (!isBot(req.headers.get('user-agent') || '')) {
        getCountry(req).then(async (country) => {
            // try {
            //     await analytics.track('pageview', {
            //         page: page,
            //         country: country
            //     });
            // } catch (_) { }
        });
    }

    return NextResponse.json({}, {
        status: 200,
    });
}

export const POST = (req) => {
    return addPageView(req);
}


Error occurs specifically when I uncomment the 2nd line.

import {analytics} from "./Analytics.ts";
Okay new thing, simply converting the file to a typescript file made it sot he import doesn't fail, but uncommenting the middle section makes it fail.