Next.js
Send SMS in Next.js — server-side only
Keep TAYSEND_KEY on the server. Use Route Handlers, Server Actions, or API routes in the App Router — never import sms_live_ keys into client components. This matches how Taysend itself is built.
Route
Route Handler
app/api/sms/send/route.ts
// app/api/sms/send/route.ts
import { NextResponse } from "next/server";
const API_URL = process.env.TAYSEND_API_URL ?? "https://api.taysend.com";
export async function POST(req: Request) {
const { to, message } = await req.json();
const res = await fetch(`${API_URL}/v1/messages`, {
method: "POST",
headers: {
Authorization: `Bearer ${process.env.TAYSEND_KEY}`,
"Idempotency-Key": crypto.randomUUID(),
"Content-Type": "application/json",
},
body: JSON.stringify({
to,
sender_id: process.env.TAYSEND_SENDER_ID ?? "TAYSEND",
message,
type: "transactional",
}),
});
if (!res.ok) {
const err = await res.json().catch(() => ({}));
return NextResponse.json(err, { status: res.status });
}
return NextResponse.json(await res.json());
}OTP
OTP from a Server Action
sendOtp
// Server Action or Route Handler — never call from "use client"
export async function sendOtp(to: string) {
const res = await fetch(`${process.env.TAYSEND_API_URL ?? "https://api.taysend.com"}/v1/verify/send`, {
method: "POST",
headers: {
Authorization: `Bearer ${process.env.TAYSEND_KEY}`,
"Content-Type": "application/json",
},
body: JSON.stringify({ to, locale: "en" }),
});
return res.json();
}Webhooks
Webhooks in Next.js
Add app/api/webhooks/taysend/route.ts. Read the raw body for signature verification (t=, v1=). See webhooks reference.
Env
Environment
- TAYSEND_KEY — server-only, sms_test_ for development
- TAYSEND_API_URL — optional, defaults to https://api.taysend.com
- TAYSEND_SENDER_ID — approved LIVE sender or TAYSEND in TEST
Explore
Related
Each page answers a different question. They are not copies of this one.
Next