URGENT: Keep getting random 404 errors on page load. When refreshing page loads normally

[artur-foodamigosi]

Hello Community,

I need urgent help with my projects that keep getting random 404 errors. The 404 errors have a very negative impact on the seo of my websites.

I am running a project build with nextjs 14, that is connected with 100+ domains.

When visiting the individual sites, i receive at random times 404 responses. When reloading the sites, everything loads.

Here are some logs that i get:

Here is a snipped of my next.config.js:

/** @type {import('next').NextConfig} */
const nextConfig = {
    images: {
        remotePatterns: [
            {
                protocol: 'http',
                hostname: 'localhost',
            },
            {
                protocol: 'https',
                hostname: 'd30hkkk8vkn602.cloudfront.net',
            },
            {
                protocol: 'https',
                hostname: 'dtwaeonhht2im.cloudfront.net',
            },
            {
                protocol: 'https',
                hostname: 'd3l18bqyuff3oz.cloudfront.net',
            },
            {
                protocol: 'https',
                hostname: 'lh3.googleusercontent.com',
            },
        ],
    },
    webpack(config) {
        config.module.rules.push({
            test: /\.(woff|woff2|eot|ttf|otf)$/i,
            type: 'asset/resource',
            generator: {
                filename: 'static/fonts/[name][ext]',
            },
        });
        return config;
    },
    async rewrites() {
        return [
            {
                source: '/media/:path*',
                destination: `${process.env.NEXT_PUBLIC_CDN_BASE_URL}/:path*`,
            },
        ];
    },
    async redirects() {
        return [
            {
                source: '/leave-a-review',
                destination: 'https://reviews.mavensdeli.com',
                permanent: false,
                basePath: false,
            },
        ];
    },
};

module.exports = nextConfig;

// Injected content via Sentry wizard below

const { withSentryConfig } = require('@sentry/nextjs');

module.exports = withSentryConfig(
    module.exports,
    {
        // For all available options, see:
        // https://github.com/getsentry/sentry-webpack-plugin#options

        // Suppresses source map uploading logs during build
        silent: true,
        org: '***',
        project: ***',
    },
    {
        // For all available options, see:
        // https://docs.sentry.io/platforms/javascript/guides/nextjs/manual-setup/

        // Upload a larger set of source maps for prettier stack traces (increases build time)
        widenClientFileUpload: true,

        // Transpiles SDK to be compatible with IE11 (increases bundle size)
        transpileClientSDK: true,

        // Uncomment to route browser requests to Sentry through a Next.js rewrite to circumvent ad-blockers.
        // This can increase your server load as well as your hosting bill.
        // Note: Check that the configured route will not match with your Next.js middleware, otherwise reporting of client-
        // side errors will fail.
        // tunnelRoute: "/monitoring",

        // Hides source maps from generated client bundles
        hideSourceMaps: true,

        // Automatically tree-shake Sentry logger statements to reduce bundle size
        disableLogger: true,

        // Enables automatic instrumentation of Vercel Cron Monitors.
        // See the following for more information:
        // https://docs.sentry.io/product/crons/
        // https://vercel.com/docs/cron-jobs
        automaticVercelMonitors: true,
    },
);

I changed the primary function region to Frankfurt, since most of my sites are located in Europe:

I would really apreciate any kind of help. I also created a ticket in vercel support center but nobody is responding.

[pawlean (Pauline P. Narvas)]

Hi, @artur-foodamigosi!

We wrote this community post about debugging 404 errors, might be helpful:

Debugging 404 Errors

Sometimes things don’t go as expected when deploying a website. If you see a 404 on your site, that means the page or resource couldn’t be found. There are many possible causes, and the absence of something can be tricky debug if you don’t know where to look. Here are some things you can do to find the cause and fix it. Debugging Tips Check the error code If you see a mostly white screen with 404: NOT_FOUND along with a Code and and ID then you can click the blue info box below the error deta…

[artur-foodamigosi]

Dear @pawlean , thank you very much for responding to me.

I do not get any errors during deployment and I also do not see the 404 page after deployment.

I never see DEPLOYMENT_NOT_FOUND.

Think about this scenario: You are deploying a project using vercel, the deployment is successfull, you can visit the domains that are connected to the projects. No errors. Sometimes howower, when revisting or visting the website for the first time, I receive randomly 404 responses. When reloading the requested page, it loads. Also, all my api requests that are done using fetching data server side, resolve in 200.