Zero Conversions From Facebook In App Traffic, Multiple Workarounds

#programming #help #react #javascript

*Help Needed: Zero Form Conversions from Facebook In-App Browser Despite Multiple Fixes
*
The Problem

We have a static site hosted on Netlify(pursueyourpink.com) with a simple email subscription form.
The form works perfectly when tested from desktop Chrome, Safari, mobile Safari, and via curl. GA4 confirms hundreds of form submissions but none are making it to Mailchimp. This is still happening despite multiple workaround attempts.

What We've Tried (Chronologically)

Original setup: Mailchimp JSONP embed (standard Mailchimp form). Zero conversions from Facebook traffic.
Diagnosis:Facebook in-app browser blocks cross-origin requests. The JSONP script injection to list-manage.com was being silently blocked.
Fix #1 — Netlify Function proxy:** Replaced JSONP with a Netlify serverless function. Form now POSTs to /.netlify/functions/subscribe (same origin). Function talks to Mailchimp API server-to-server. Works perfectly from desktop/mobile browsers and curl. Still zero conversions from Facebook traffic.
Fix #2 — localStorage recovery:** Added auto-save of email to localStorage as user types. On next visit, if a saved email exists, it auto-submits. No recoveries observed.

5.Fix #3 — Native HTML form fallback:** Added action="/.netlify/functions/subscribe" method="POST" and name="email" to the form. If JavaScript is completely blocked, the form still submits natively via standard HTTP POST. Function handles both JSON and form-encoded content types. Confirmed working via curl with application/x-www-form-urlencoded. Still waiting on real-world results.

Fix #4 — Inline form on homepage:** Added the email form directly on the homepage hero section (in addition to the /join page) to eliminate the extra click. Just deployed.

What We Know

The Netlify Function works (confirmed via curl, both JSON and form-encoded)
The form HTML is correct (action, method, name attributes all present)
JavaScript form handler works in all standard browsers
93% of traffic comes from Facebook in-app browser
GA4 confirms form submissions
Netlify Function logs show zero invocations from real visitors
Cookie consent banner is present (GA only fires after consent)

Questions for the Community

Is the Facebook in-app browser blocking ALL JavaScript execution** on the page, not just cross-origin requests? If e.preventDefault() fires but fetch() silently fails, the native fallback would never trigger because the default action was already prevented.
Should we remove e.preventDefault() entirely and let the native form POST handle everything? The downside is the user briefly sees the function's JSON response or gets redirected, but at least it would work.
Is there a known issue with Netlify Functions not being invoked from the Facebook in-app browser, even for same-origin requests?
Would a redirect-based approach work better? Instead of fetch, use window.location.href to navigate to a subscribe URL with the email as a query parameter.

5.Has anyone successfully solved Mailchimp subscription from Facebook in-app browser traffic? What approach worked?