Hello, everyone.
I need to integrate ThreatMetrix with the Shopify-based onboarding flow in a way that stays fully compliant with Shopify’s restrictions and the bank’s KYC requirements.
Because Shopify doesn’t allow direct JavaScript or API access inside its checkout, the integration will use an external secure backend that handles all communication with ThreatMetrix APIs.
The Shopify frontend will only collect the ThreatMetrix session ID and send it to that backend, which will handle the API logic and pass the results to your bank system.
How can I do it?
Topic summary
A developer needs to integrate ThreatMetrix fraud detection API with a Shopify store while complying with Shopify’s checkout restrictions and banking KYC requirements.
Proposed Architecture:
- Use an external secure backend to handle ThreatMetrix API communication
- Shopify frontend collects only the ThreatMetrix session ID
- Backend processes the session data and forwards results to the bank system
Implementation Approach:
A responder provided JavaScript code to be inserted in the theme.liquid file (before the closing </body> tag). The script:
- Loads the ThreatMetrix fingerprinting tag
- Captures the session ID
- Sends it to a backend endpoint via fetch API
- Includes cart token and page context in the payload
Key Clarification:
The original poster expressed concern about JavaScript restrictions in Shopify’s checkout page. The responder clarified the code targets the theme.liquid file (general theme template), not the checkout page itself.
Current Status:
The discussion remains open, with the responder offering to provide hands-on implementation assistance via private message if the developer shares store access credentials.
Nice — this is a great plan (and totally sensible: keep the checkout clean, put risk logic on a secure backend). Below I’ll give a practical, compliance-minded architecture you can implement now, plus copy-pasteable code sketches (front end + backend) and a checklist of what to watch for (Shopify restrictions, privacy/consent, TLS, bank/KYC needs).
Here is the snippet below that you can use it.
<!-- snippet to add to cart.liquid or theme.liquid (before </body>) -->
<script>
(function() {
// Replace <ORG_ID> with your ThreatMetrix organisation id (no secret).
// Replace /apps/your-app/tmx-session with your backend endpoint.
var orgId = '<ORG_ID>';
var backendEndpoint = '/apps/your-app/tmx-session'; // your app URL (app proxy or direct)
function sendSessionToBackend(sessionId) {
if (!sessionId) return;
// Minimal payload: session id + cart token or customer identifier
var payload = {
tmx_session: sessionId,
cart_token: window.Shopify && ShopifyAnalytics && ShopifyAnalytics.meta && ShopifyAnalytics.meta.page ?
ShopifyAnalytics.meta.page.cart_token : null,
page: window.location.pathname
};
fetch(backendEndpoint, {
method: 'POST',
headers: {'Content-Type': 'application/json'},
credentials: 'include',
body: JSON.stringify(payload)
}).catch(function(err){ console.warn('TMX backend post error', err); });
}
// Insert ThreatMetrix tag
var s = document.createElement('script');
s.async = true;
s.src = 'https://h-api.online-metrix.net/fp/tags.js?org_id=' + encodeURIComponent(orgId);
s.onload = function() {
try {
// ThreatMetrix exposes a function to get the session id — common pattern:
// window.threatmetrixSessionId or online_metrix_get_session_id — check your TMX docs.
// Many integrations put the session id into a callback or global var:
var sessionId = window._tmx_session_id || (window.OnlineMetaX && window.OnlineMetaX.getSession && window.OnlineMetaX.getSession());
// If the library calls a callback, hook that up here (implementation varies).
sendSessionToBackend(sessionId);
} catch (e) { console.warn('TMX session read failed', e); }
};
document.head.appendChild(s);
})();
</script>
You can put the above code in the above of body tag in theme.liquid file.
Let me know if you still have any Questions.
Thanks
could you explain more details?
In the Shopify, we can’t insert javascript code in the shopify checkout page.
Am talking about in the theme.liquid file not in checkout.
If you not able to do so then can you share your store url and the collab code so that I can send you request for accessing the store and do the requested changes.
You can share this in the p/m.
Thanks