Induji Technical Team
Content Strategy
For over a decade, B2B marketing pipelines have been built on a fragile foundation: client-side JavaScript pixels. We tracked form fills, demo requests, and whitepaper downloads by firing a snippet of code in the user's browser. This data, however imperfect, was the fuel for our Google Ads campaigns. That foundation is now crumbling.
The confluence of Apple's Intelligent Tracking Prevention (ITP), browser-native ad blockers, privacy regulations like GDPR and the DPDP Act, and Google's own phase-out of third-party cookies has created a perfect storm of signal loss. For B2B companies with long sales cycles and high-value conversions, this isn't a minor inconvenience; it's an existential threat to data-driven marketing. When you can't accurately attribute a multi-million dollar deal back to the campaigns that sourced it, your entire growth engine operates in the dark.
The solution is not a new client-side workaround. The solution is a fundamental architectural shift: moving conversion tracking from the untrusted, chaotic environment of the client's browser to the secure, controlled environment of your own server. This guide provides a detailed technical blueprint for architecting a server-side Google Ads Enhanced Conversions pipeline using the modern capabilities of Next.js 15.
Migrating to a server-side pipeline isn't just about replacing one piece of code with another. It's a strategic move to reclaim control over your most valuable asset: your first-party data.
Let's be explicit about the failure points of traditional tracking:
For B2B, where a single missed conversion could represent tens of thousands in pipeline value, this level of unreliability is unacceptable.
A server-side architecture is built on durability, security, and accuracy.
Next.js 15, with its mature App Router and powerful Server Actions, is uniquely suited for building this type of data pipeline. It allows us to co-locate the front-end form with the server-side logic that processes and transmits the conversion data, creating a clean, maintainable, and highly efficient system.
Here is a step-by-step breakdown of the architecture.
The journey begins with your lead capture form—a "Request a Demo" or "Contact Sales" page. Instead of using a client-side onSubmit handler to trigger a GTM event, we'll use a Next.js Server Action.
A Server Action is a function that you define on the server but can be called directly from a client component, like a form. This simplifies the architecture immensely.
app/request-demo/page.tsx:
// app/request-demo/page.tsx
import { submitDemoRequest } from './actions';
export default function RequestDemoPage() {
return (
<form action={submitDemoRequest}>
<label htmlFor="email">Email</label>
<input type="email" id="email" name="email" required />
<label htmlFor="firstName">First Name</label>
<input type="text" id="firstName" name="firstName" />
<label htmlFor="lastName">Last Name</label>
<input type="text" id="lastName" name="lastName" />
{/* This will be populated client-side */}
<input type="hidden" id="gclid" name="gclid" />
<button type="submit">Request Demo</button>
</form>
);
}
The magic happens in the action={submitDemoRequest} attribute. This tells Next.js to execute the submitDemoRequest function on the server when the form is submitted.
Inside our Server Action, we receive the raw form data. Before we send it to Google, we must perform two critical operations: normalization and hashing. This ensures the data matches what Google has on its end and protects user privacy.
app/request-demo/actions.ts:
// app/request-demo/actions.ts
'use server';
import { createHash } from 'crypto';
function normalizeAndHash(value: string | undefined | null): string | undefined {
if (!value) return undefined;
// Google's recommended normalization: trim whitespace, lowercase.
const normalized = value.trim().toLowerCase();
// One-way hash using SHA-256.
return createHash('sha256').update(normalized).digest('hex');
}
export async function submitDemoRequest(formData: FormData) {
const rawData = {
email: formData.get('email') as string,
firstName: formData.get('firstName') as string,
lastName: formData.get('lastName') as string,
gclid: formData.get('gclid') as string,
};
// 1. Process the lead internally (e.g., save to CRM)
// await saveLeadToCrm(rawData);
// 2. Prepare data for Google Ads
const enhancedConversionData = {
hashedEmail: normalizeAndHash(rawData.email),
hashedFirstName: normalizeAndHash(rawData.firstName),
hashedLastName: normalizeAndHash(rawData.lastName),
// Address fields can also be included if collected
};
// ... next step: transmit data
}
This normalizeAndHash function is the core of our privacy-compliant implementation. We are never storing or transmitting raw PII to the ad platform.
The GCLID is the crucial piece of information that links the conversion back to a specific ad click. It's passed as a URL parameter by Google Ads. We need to capture it and include it in our server-side payload.
The best approach is to read it from the URL on the client side and inject it into our form.
app/request-demo/client-component.tsx (a new component to handle client-side logic):
'use client';
import { useSearchParams } from 'next/navigation';
import { useEffect } from 'react';
// This component reads the GCLID and populates the hidden field
export function GclidManager() {
const searchParams = useSearchParams();
useEffect(() => {
const gclid = searchParams.get('gclid');
if (gclid) {
// Set the value of the hidden input field
const gclidInput = document.getElementById('gclid') as HTMLInputElement;
if (gclidInput) {
gclidInput.value = gclid;
}
// Optional: Store in a first-party cookie for longer attribution windows
document.cookie = `gclid=${gclid}; path=/; max-age=7776000`; // 90 days
}
}, [searchParams]);
return null; // This component doesn't render anything
}
You would then include <GclidManager /> inside your page component, likely wrapped in a <Suspense> boundary.
With the hashed PII and the GCLID, we are ready to send the data to Google. The most robust method is a direct server-to-server API call to the Google Ads API. This gives you maximum control and avoids dependencies on platforms like server-side GTM.
We'll complete our Server Action by making a fetch request.
app/request-demo/actions.ts (continued):
// ... (inside submitDemoRequest function)
const conversionData = {
// We'll use the "Enhanced conversions for leads" flow
conversions: [
{
gclid: rawData.gclid,
conversionAction: `customers/${process.env.GOOGLE_ADS_CUSTOMER_ID}/conversionActions/${process.env.GOOGLE_ADS_CONVERSION_ACTION_ID}`,
conversionDateTime: new Date().toISOString().replace('Z', '+00:00'), // Format required by API
conversionValue: 1, // Or a dynamic value based on lead score
currencyCode: 'USD',
userIdentifiers: [
{ hashedEmail: enhancedConversionData.hashedEmail },
// You can add more identifiers here
],
},
],
};
try {
const response = await fetch(
`https://googleads.googleapis.com/v16/customers/${process.env.GOOGLE_ADS_CUSTOMER_ID}:uploadClickConversions`,
{
method: 'POST',
headers: {
'Content-Type': 'application/json',
'developer-token': process.env.GOOGLE_ADS_DEVELOPER_TOKEN,
'login-customer-id': process.env.GOOGLE_ADS_LOGIN_CUSTOMER_ID,
'Authorization': `Bearer ${process.env.GOOGLE_ADS_OAUTH_TOKEN}`,
},
body: JSON.stringify(conversionData),
}
);
const result = await response.json();
if (result.error) {
console.error('Google Ads API Error:', result.error.message);
// Implement retry logic or alerting here
} else {
console.log('Successfully sent conversion to Google Ads.');
}
} catch (error) {
console.error('Failed to send conversion:', error);
}
// Redirect the user to a thank you page
// redirect('/thank-you');
}
Note: Managing OAuth tokens for the Google Ads API is a complex topic involving refresh tokens. For production systems, you'll need a secure service to manage this lifecycle.
A production-grade pipeline requires more than just application code. It demands a robust DevOps strategy.
Never hard-code API keys, developer tokens, or customer IDs.
.env.local, which is git-ignored by default in Next.js.What happens if the Google Ads API is temporarily down when a lead submits a form? With the current code, that conversion data is lost forever. A professional-grade system introduces a queue.
Instead of calling the Google Ads API directly from the Server Action, the action's only job is to push the conversion payload into a durable queue (like Vercel KV, Upstash Redis, or AWS SQS). A separate, independent process (e.g., a cron job or a background worker) reads from this queue and attempts to send the data to Google. If it fails, the message remains in the queue to be retried later. This makes your pipeline resilient to downstream failures.
You must have visibility into your pipeline's health.
Implementing this architecture is a significant technical effort, but the business payoff is transformative.
Google's Smart Bidding strategies (like tCPA and tROAS) are incredibly powerful, but they are entirely dependent on the quality and volume of the data you feed them. By providing a near-100% accurate stream of conversion data, you are giving the algorithm a crystal-clear picture of which clicks, keywords, audiences, and creatives are actually driving valuable leads.
This allows the system to:
This pipeline allows you to evolve beyond simple lead counting. Because the conversion event happens on your server, you can enrich it with data from your CRM.
Imagine this flow:
Now, you can set your Google Ads campaign to optimize for "Qualified Leads," directly aligning your ad spend with your sales pipeline and maximizing true ROI, not just front-end form fills.
Q: Can't I just use server-side Google Tag Manager (sGTM) for this? A: Yes, sGTM is a valid alternative. It acts as a proxy between your server and various marketing tags. However, it introduces another layer of complexity and potential point of failure. The direct API approach described here offers maximum control, transparency, and performance, integrating the logic directly into your application stack, which is often preferred by engineering and DevOps teams.
Q: What's the difference between Enhanced Conversions for Web and Enhanced Conversions for Leads? A: "Enhanced Conversions for Web" still relies on the client-side pixel to send the conversion signal, but you supplement it with hashed PII. It's a step up, but still vulnerable to ad blockers. "Enhanced Conversions for Leads" (the method detailed in this guide) sends the entire conversion event, including the GCLID and hashed PII, from the server. It is far more durable and is the recommended approach for high-value B2B leads.
Q: How do I handle user consent under DPDP/GDPR with this server-side setup? A: The requirement for consent does not change. You must still collect valid user consent on your website before collecting and processing their personal data. The server-side architecture ensures that if consent is given, the data is transmitted securely and reliably. You should pass a consent status signal along with the form data to your server and only trigger the API call if consent is affirmative.
Q: What are the common pitfalls during implementation? A: The most common issues are incorrect PII normalization/hashing (Google can't match the data), failure to correctly capture and pass the GCLID, and improper management of API authentication (e.g., expired OAuth tokens). Thorough logging and testing in the Google Ads UI's conversion diagnostics panel are critical.
The era of easy, browser-based ad tracking is over. The future of B2B digital marketing belongs to companies that can build robust, privacy-centric, and highly accurate data pipelines. This is no longer just a marketing challenge; it is a core engineering and DevOps imperative.
At Induji Technologies, we specialize in architecting and implementing these complex, high-ROI data systems. We combine deep expertise in modern web frameworks like Next.js with a strategic understanding of the B2B marketing landscape to build solutions that provide a durable competitive advantage.
Don't let signal loss dictate your marketing success. Request a quote today to discuss how we can build a server-side conversion pipeline tailored to your technology stack and business goals.
A senior-level technical guide for CTOs and DevOps engineers on building a high-integrity B2B lead generation pipeline using Next.js 15 Server Actions, Meta's Conversion API, and a private blockchain for verifiable lead data.
Induji Technical Team
A senior engineer's guide to architecting a scalable, high-performance B2B SaaS application using a unified monorepo strategy with Next.js 15 and React Native, reducing TCO and accelerating development.
Induji Technical Team
Partner with Induji Technologies to leverage cutting-edge solutions tailored to your unique challenges. Let's build something extraordinary together.