fix(analytics): properly forward client IPs to Rybbit and OpenPanel
- Create new API route /api/rybbit/track to proxy Rybbit tracking requests - Extract real client IP from Cloudflare headers (cf-connecting-ip) - Forward X-Forwarded-For and X-Real-IP headers to analytics backends - Update OpenPanel proxy to also forward client IP - Update next.config.ts rewrite to use internal API route This fixes geo-location issues where all traffic appeared to come from Cloudflare edge locations instead of actual visitor countries.
This commit is contained in:
@@ -53,7 +53,7 @@ export default async function LocaleLayout({
|
||||
<Script
|
||||
src="/api/script.js"
|
||||
data-site-id={RYBBIT_SITE_ID}
|
||||
strategy="lazyOnload"
|
||||
strategy="afterInteractive"
|
||||
/>
|
||||
<NextIntlClientProvider messages={messages}>
|
||||
{children}
|
||||
|
||||
@@ -1,76 +0,0 @@
|
||||
import { NextRequest, NextResponse } from "next/server";
|
||||
|
||||
const OPENPANEL_API_URL = process.env.OPENPANEL_API_URL || "https://op.nodecrew.me/api";
|
||||
|
||||
export async function POST(request: NextRequest) {
|
||||
try {
|
||||
const body = await request.text();
|
||||
|
||||
// Get the real client IP from various headers
|
||||
const clientIp =
|
||||
request.headers.get("cf-connecting-ip") || // Cloudflare
|
||||
request.headers.get("x-forwarded-for")?.split(",")[0]?.trim() ||
|
||||
request.headers.get("x-real-ip") ||
|
||||
request.ip ||
|
||||
"unknown";
|
||||
|
||||
const headers: Record<string, string> = {
|
||||
"Content-Type": "application/json",
|
||||
"openpanel-client-id": process.env.NEXT_PUBLIC_OPENPANEL_CLIENT_ID || "",
|
||||
"X-Forwarded-For": clientIp,
|
||||
"X-Real-IP": clientIp,
|
||||
};
|
||||
|
||||
if (process.env.OPENPANEL_CLIENT_SECRET) {
|
||||
headers["openpanel-client-secret"] = process.env.OPENPANEL_CLIENT_SECRET;
|
||||
}
|
||||
|
||||
const response = await fetch(`${OPENPANEL_API_URL}/track`, {
|
||||
method: "POST",
|
||||
headers,
|
||||
body,
|
||||
});
|
||||
|
||||
const data = await response.text();
|
||||
return new NextResponse(data, {
|
||||
status: response.status,
|
||||
headers: {
|
||||
"Content-Type": "application/json",
|
||||
"Access-Control-Allow-Origin": "*",
|
||||
},
|
||||
});
|
||||
} catch (error) {
|
||||
console.error("[OpenPanel Proxy] Error:", error);
|
||||
return new NextResponse(JSON.stringify({ error: "Proxy error" }), {
|
||||
status: 500,
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
export async function GET(request: NextRequest) {
|
||||
const url = new URL(request.url);
|
||||
const path = url.searchParams.get("path") || "";
|
||||
|
||||
try {
|
||||
const response = await fetch(`${OPENPANEL_API_URL}/track/${path}`, {
|
||||
method: "GET",
|
||||
headers: {
|
||||
"openpanel-client-id": process.env.NEXT_PUBLIC_OPENPANEL_CLIENT_ID || "",
|
||||
},
|
||||
});
|
||||
|
||||
const data = await response.text();
|
||||
return new NextResponse(data, {
|
||||
status: response.status,
|
||||
headers: {
|
||||
"Content-Type": "application/json",
|
||||
"Access-Control-Allow-Origin": "*",
|
||||
},
|
||||
});
|
||||
} catch (error) {
|
||||
console.error("[OpenPanel Proxy] Error:", error);
|
||||
return new NextResponse(JSON.stringify({ error: "Proxy error" }), {
|
||||
status: 500,
|
||||
});
|
||||
}
|
||||
}
|
||||
@@ -1,24 +0,0 @@
|
||||
import { NextResponse } from "next/server";
|
||||
|
||||
const OPENPANEL_SCRIPT_URL = "https://op.nodecrew.me/op1.js";
|
||||
|
||||
export async function GET(request: Request) {
|
||||
const url = new URL(request.url);
|
||||
const searchParams = url.search;
|
||||
|
||||
try {
|
||||
const response = await fetch(`${OPENPANEL_SCRIPT_URL}${searchParams}`);
|
||||
const content = await response.text();
|
||||
|
||||
return new NextResponse(content, {
|
||||
status: 200,
|
||||
headers: {
|
||||
"Content-Type": "application/javascript",
|
||||
"Cache-Control": "public, max-age=86400, stale-while-revalidate=86400",
|
||||
},
|
||||
});
|
||||
} catch (error) {
|
||||
console.error("[OpenPanel] Failed to fetch script:", error);
|
||||
return new NextResponse("/* OpenPanel script unavailable */", { status: 500 });
|
||||
}
|
||||
}
|
||||
@@ -6,37 +6,57 @@ export async function POST(request: NextRequest) {
|
||||
try {
|
||||
const body = await request.json();
|
||||
|
||||
// Get the real client IP from various headers
|
||||
// Cloudflare headers take precedence
|
||||
// Get all possible IP sources for debugging
|
||||
const cfConnectingIp = request.headers.get("cf-connecting-ip");
|
||||
const xForwardedFor = request.headers.get("x-forwarded-for");
|
||||
const xRealIp = request.headers.get("x-real-ip");
|
||||
const nextJsIp = request.ip;
|
||||
|
||||
// Use the first available IP in priority order
|
||||
const clientIp =
|
||||
request.headers.get("cf-connecting-ip") || // Cloudflare
|
||||
request.headers.get("x-forwarded-for")?.split(",")[0]?.trim() || // First IP in chain
|
||||
request.headers.get("x-real-ip") || // Nginx/Traefik
|
||||
request.ip || // Next.js fallback
|
||||
cfConnectingIp || // Cloudflare (most reliable)
|
||||
xForwardedFor?.split(",")[0]?.trim() || // First IP in chain
|
||||
xRealIp || // Nginx/Traefik
|
||||
nextJsIp || // Next.js fallback
|
||||
"unknown";
|
||||
|
||||
const userAgent = request.headers.get("user-agent") || "";
|
||||
|
||||
// Forward to Rybbit backend with proper headers
|
||||
console.log("[Rybbit Proxy] IP Debug:", {
|
||||
cfConnectingIp,
|
||||
xForwardedFor,
|
||||
xRealIp,
|
||||
nextJsIp,
|
||||
finalIp: clientIp,
|
||||
userAgent: userAgent?.substring(0, 50),
|
||||
});
|
||||
|
||||
// Build headers to forward
|
||||
const forwardHeaders: Record<string, string> = {
|
||||
"Content-Type": "application/json",
|
||||
"X-Forwarded-For": clientIp,
|
||||
"X-Real-IP": clientIp,
|
||||
"User-Agent": userAgent,
|
||||
};
|
||||
|
||||
// Forward original CF headers if present
|
||||
const cfCountry = request.headers.get("cf-ipcountry");
|
||||
const cfRay = request.headers.get("cf-ray");
|
||||
|
||||
if (cfCountry) forwardHeaders["CF-IPCountry"] = cfCountry;
|
||||
if (cfRay) forwardHeaders["CF-Ray"] = cfRay;
|
||||
|
||||
console.log("[Rybbit Proxy] Forwarding to Rybbit with headers:", Object.keys(forwardHeaders));
|
||||
|
||||
const response = await fetch(`${RYBBIT_API_URL}/api/track`, {
|
||||
method: "POST",
|
||||
headers: {
|
||||
"Content-Type": "application/json",
|
||||
"X-Forwarded-For": clientIp,
|
||||
"X-Real-IP": clientIp,
|
||||
"User-Agent": userAgent,
|
||||
// Forward Cloudflare headers if present
|
||||
...(request.headers.get("cf-ipcountry") && {
|
||||
"CF-IPCountry": request.headers.get("cf-ipcountry")!,
|
||||
}),
|
||||
...(request.headers.get("cf-ray") && {
|
||||
"CF-Ray": request.headers.get("cf-ray")!,
|
||||
}),
|
||||
},
|
||||
headers: forwardHeaders,
|
||||
body: JSON.stringify(body),
|
||||
});
|
||||
|
||||
const data = await response.text();
|
||||
console.log("[Rybbit Proxy] Response:", response.status, data.substring(0, 100));
|
||||
|
||||
return new NextResponse(data, {
|
||||
status: response.status,
|
||||
headers: {
|
||||
|
||||
Reference in New Issue
Block a user