Skip to main content
Solved

Integration of Klaviyo to nextjs 14

  • August 30, 2024
  • 3 replies
  • 577 views

Forum|alt.badge.img

Hi There,

I will have a form to display in my UI. Submitting the form will trigger an api call to the server in which am making a POST reques to klaviyo

This way 
 

import { NextRequest, NextResponse } from "next/server";

export async function POST(request: NextRequest) {
  try {
    const { email, firstName, lastName } = await request.json();


    const klaviyoApiUrl = `https://a.klaviyo.com/api/v2/list/${process.env.LIST_ID}/members`;
    const res = await fetch(klaviyoApiUrl, {
      method: "POST",
      headers: {
        "Content-Type": "application/json",
        Authorization: `Klaviyo-API-Key ${process.env.KLAVIYO_PRIVATE_API_KEY}`,
      },
      body: JSON.stringify({
        profiles: [
          {
            email: email,
            first_name: firstName,
            last: lastName,
          },
        ],
      }),
    });

    const data = await res.json();
    if (!res.ok) {
      console.error("Klaviyo API Error:", data);
      throw new Error(data.message || "Failed to subscribe to Klaviyo");
    }

    return NextResponse.json({ success: true });
  } catch (error: any) {
    console.error("Subscription Error:", error);
    return NextResponse.json({ success: false, error: error.message }, { status: 500 });
  }
}

I m keep getting 
 

Klaviyo API Error: { message: 'The API key specified is invalid.' }
Subscription Error: Error: The API key specified is invalid.

While I tried old API key and created new API private key with full access. Both result the same.

Any help would be appreciated.

Thank you

Best answer by saulblum

Actually, to follow up on my earlier note, this isn’t how you authenticate with the old v2 APIs — you pass the key in an api_key query parameter in the URL.

View original
Did this topic or the replies in the thread help you find an answer to your question?

3 replies

Forum|alt.badge.img+7
  • Klaviyo Employee
  • 169 replies
  • September 16, 2024

Hi! Before debugging the API key, note you’re using a deprecated v2 API call that may no longer work.

The corresponding call for what you’re trying to do is at https://developers.klaviyo.com/en/reference/spawn_bulk_profile_import_job

You can choose a list to which to add the profiles:

Try updating the code to use this endpoint and see if you still get a key error.


Forum|alt.badge.img+31
  • Partner
  • 252 replies
  • September 17, 2024

Hello @Elyes 

 

First check if you are getting KLAVIYO_PRIVATE_API_KEY from your env file.

 

Secondly, Try to enclose Authorization header in double quotes

like this

headers: { 
"Content-Type": "application/json", 
“Authorization”: `Klaviyo-API-Key ${process.env.KLAVIYO_PRIVATE_API_KEY}`
 },

 


Forum|alt.badge.img+7
  • Klaviyo Employee
  • 169 replies
  • Answer
  • September 17, 2024

Actually, to follow up on my earlier note, this isn’t how you authenticate with the old v2 APIs — you pass the key in an api_key query parameter in the URL.