AWS SDK Lambda - Invoke AWS Lambda functions from Next.js with typed payloads and error handling

npm install @aws-sdk/client-lambda

// lib/lambda.ts
import { LambdaClient } from "@aws-sdk/client-lambda";
 
export const lambdaClient = new LambdaClient({
  region: process.env.AWS_REGION!,
  credentials: {
    accessKeyId: process.env.AWS_ACCESS_KEY_ID!,
    secretAccessKey: process.env.AWS_SECRET_ACCESS_KEY!,
  },
});

// lib/invoke-lambda.ts
import { InvokeCommand } from "@aws-sdk/client-lambda";
import { lambdaClient } from "./lambda";
 
export async function invokeLambda<TInput, TOutput>(
  functionName: string,
  payload: TInput
): Promise<TOutput> {
  const command = new InvokeCommand({
    FunctionName: functionName,
    Payload: new TextEncoder().encode(JSON.stringify(payload)),
  });
 
  const response = await lambdaClient.send(command);
 
  if (response.FunctionError) {
    const errorPayload = JSON.parse(
      new TextDecoder().decode(response.Payload)
    );
    throw new Error(
      `Lambda error: ${errorPayload.errorMessage ?? response.FunctionError}`
    );
  }
 
  return JSON.parse(new TextDecoder().decode(response.Payload)) as TOutput;
}

// app/components/ImageProcessor.tsx
"use client";
import { useState } from "react";
import { processImage } from "../actions/image-actions";
 
export default function ImageProcessor() {
  const [result, setResult] = useState<{
    thumbnailUrl: string;
    dimensions: { width: number; height: number };
  } | null>(null);
  const [loading, setLoading] = useState(false);
  const [error, setError] = useState<string | null>(null);
 
  async function handleProcess(formData: FormData) {
    setLoading(true);
    setError(null);
    try {
      const data = await processImage(formData);
      setResult(data);
    } catch (err) {
      setError(err instanceof Error ? err.message : "Processing failed");
    } finally {
      setLoading(false);
    }
  }
 
  return (
    <div className="max-w-md mx-auto p-6 space-y-4">
      <form action={handleProcess}>
        <input name="imageUrl" placeholder="Image URL" required className="w-full border rounded px-3 py-2" />
        <input name="width" type="number" placeholder="Target width" defaultValue={200} className="w-full border rounded px-3 py-2 mt-2" />
        <button
          type="submit"
          disabled={loading}
          className="mt-3 bg-blue-600 text-white px-4 py-2 rounded disabled:opacity-50"
        >
          {loading ? "Processing..." : "Process Image"}
        </button>
      </form>
      {error && <p className="text-red-600">{error}</p>}
      {result && (
        <div>
          <p>Thumbnail: {result.dimensions.width}x{result.dimensions.height}</p>
          <img src={result.thumbnailUrl} alt="Processed thumbnail" className="border rounded" />
        </div>
      )}
    </div>
  );
}

// app/actions/image-actions.ts
"use server";
import { invokeLambda } from "@/lib/invoke-lambda";
 
interface ProcessImageInput {
  imageUrl: string;
  targetWidth: number;
}
 
interface ProcessImageOutput {
  thumbnailUrl: string;
  dimensions: { width: number; height: number };
}
 
export async function processImage(formData: FormData) {
  const imageUrl = formData.get("imageUrl") as string;
  const targetWidth = Number(formData.get("width")) || 200;
 
  const result = await invokeLambda<ProcessImageInput, ProcessImageOutput>(
    "image-processor",
    { imageUrl, targetWidth }
  );
 
  return result;
}

import { InvokeCommand, InvocationType } from "@aws-sdk/client-lambda";
 
const command = new InvokeCommand({
  FunctionName: "email-sender",
  InvocationType: InvocationType.Event, // async, returns 202 immediately
  Payload: new TextEncoder().encode(
    JSON.stringify({ to: "user@example.com", subject: "Welcome!" })
  ),
});
 
await lambdaClient.send(command); // Returns immediately, no response payload

const command = new InvokeCommand({
  FunctionName: "my-function",
  InvocationType: InvocationType.DryRun,
  Payload: new TextEncoder().encode(JSON.stringify({ test: true })),
});
 
// Returns 204 if valid, throws if permissions are wrong
await lambdaClient.send(command);

import { ListFunctionsCommand } from "@aws-sdk/client-lambda";
 
const command = new ListFunctionsCommand({ MaxItems: 50 });
const response = await lambdaClient.send(command);
 
const functions = response.Functions?.map((fn) => ({
  name: fn.FunctionName,
  runtime: fn.Runtime,
  memory: fn.MemorySize,
  lastModified: fn.LastModified,
}));

const command = new InvokeCommand({
  FunctionName: "my-function",
  Qualifier: "production", // alias name or version number
  Payload: new TextEncoder().encode(JSON.stringify(payload)),
});

import type { InvokeCommandOutput } from "@aws-sdk/client-lambda";
 
function decodePayload<T>(response: InvokeCommandOutput): T | null {
  if (!response.Payload) return null;
  return JSON.parse(new TextDecoder().decode(response.Payload)) as T;
}