[RESOLVED] Netlify Function Deployment Issue: Background Function Returns 404

Netlify Function Deployment Issue: Background Function Returns 404

Problem Description

I’m experiencing an issue with my Netlify background function deployment. When my application tries to call the background function, it consistently returns a 404 Not Found error. I’ve followed the documentation for setting up background functions and confirmed that the function works locally with netlify dev.

Project Details

  • Framework: Next.js 15 app router
  • Function Type: Background function (for long-running data processing)
  • Deployment Method: Continuous deployment from GitHub

Function Structure

  • Function location: /netlify/functions/process-meeting-background.ts
  • The function is properly named with the -background suffix
  • I’ve configured it in netlify.toml as a background function

What I’ve tried

  1. I’ve configured the netlify.toml file with specific included_files and external_node_modules:
[build]
  command = "npm run build"
  publish = ".next"

[functions]
  directory = "netlify/functions"
  node_bundler = "esbuild"
  external_node_modules = [
    "@prisma/client", 
    "langchain", 
    "@langchain/textsplitters",
    "p-limit"
  ]

# Specific configuration for the process-meeting-background function
[functions.process-meeting-background]
  background = true
  included_files = [
    # Include all necessary source files from lib directory
    "src/lib/**",
    
    # Include database connection and models
    "src/server/db.ts",
    "src/server/db/**",
    
    # Include Prisma schema and generated files
    "prisma/schema.prisma",
    "node_modules/.prisma/**",
    
    # Include configuration files
    "package.json",
    ".env",
    ".env.production"
  ]
  1. Changed dynamic imports to static imports in the function file to avoid bundling issues.

  2. Double-checked my function URL construction in the client code:

const backgroundFunctionUrl = "/.netlify/functions/process-meeting-background";
const url = new URL(backgroundFunctionUrl, process.env.NEXT_PUBLIC_APP_URL);

Error Logs

Here’s the error I’m seeing in the Netlify logs:

Mar 18, 12:46:25 PM: b742d06a INFO   Triggering background function at: https://insightseek.vip/.netlify/functions/process-meeting-backgroundMar 18, 12:46:26 PM: 5c88ba87 Duration: 610 ms	Memory Usage: 257 MBMar 18, 12:46:26 PM: b742d06a ERROR  Background function error: 404 Not FoundMar 18, 12:46:26 PM: b742d06a ERROR  Response body: <!DOCTYPE html><html lang="en" class="__variable_3a0388"><head><meta charSet="utf-8"/><meta name

Build Logs

I did encounter a warning during a previous deployment: “request body too large” when trying to upload the function, which I attempted to fix by being more selective with included_files and external_node_modules.

Questions

  1. Why is my function returning a 404 when it should be deployed?
  2. Is there an issue with how I’m configuring my background function in the netlify.toml file?
  3. Could there be an issue with the bundling process that’s preventing my function from being correctly deployed?
  4. Are there specific settings that might be blocking the function from being accessible?

Any guidance on troubleshooting this issue would be greatly appreciated. I’ve been trying to resolve this for a while and can’t figure out why the function can’t be reached despite following the documentation.

Hi everyone,

I wanted to follow up on my previous post about the 404 errors I encountered when calling my background function. I’ve found a solution that works well, and I wanted to share it in case anyone else runs into similar issues.

The Solution

The key insight was to move all functionality directly into the Netlify function rather than having a Next.js API route that forwards to the background function.

Here’s what I did:

  1. Removed the Next.js API route that was trying to call the background function
  2. Moved all the processing logic directly into the Netlify function
  3. Configured the path in the Netlify function to match the original API endpoint
  4. Updated the client code to call this endpoint directly

Implementation Details

My Netlify function now looks like this (simplified):

// In netlify/functions/process-meeting-background.ts
import { db } from "@/server/db";
import type { Config } from "@netlify/functions";
// ...other imports

export default async (request: Request) => {
  try {
    // Parse request body
    const body = await request.json();
    const { audio_url, projectId, meetingId } = body;
    
    // Initial processing
    await db.meeting.update({
      where: { id: meetingId },
      data: { status: "PROCESSING" },
    });
    
    // Start transcription
    const transcriptData = await startMeetingTranscription(audio_url);
    
    // Update database
    await db.meeting.update({
      where: { id: meetingId },
      data: { externalId: transcriptData.id },
    });
    
    // Return response immediately
    const response = new Response(
      JSON.stringify({
        meetingId,
        transcriptionId: transcriptData.id,
        status: "processing",
      }),
      { status: 202, headers: { "Content-Type": "application/json" } }
    );
    
    // This ensures the response is sent before we continue processing
    await response.clone().text();
    
    // Continue with long-running processing in the background
    // ... rest of the processing code ...
    
    return response;
  } catch (error) {
    // Error handling
  }
};

// Configure the function to use the same path as the original API route
export const config: Config = {
  path: "/api/process-meeting",
};

I found that all the additional configurations I was trying to add (like function configurations, redirects, etc.) were causing more problems than it solved. The default Netlify settings worked perfectly once I simplified my approach.

[build]
  command = "pnpm build"
  publish = ".next"

The client code calls /api/process-meeting directly, which gets routed to the Netlify function.

I hope this helps anyone else struggling with similar issues!

1 Like