SPA Device Profiling
A traditional website reloads the document during navigation, so the Signifyd device profiling script runs automatically on every page where it is installed. A single-page application changes views without a full page load. To capture those virtual navigations, call the Signifyd browser API when your router changes routes. This guide covers the steps that are specific to single-page applications. Complete the session ID, deployment and API matching steps in Device Profiling before continuing.
Install the script
Include the profiling script once in the shared application page. When data-order-session-id is present, the script profiles the initial page automatically.
<script
defer
type="text/javascript"
id="script-tag-api"
data-order-session-id="YOUR-SESSION-ID-HERE"
src="https://cdn-scripts.signifyd.com/api/script-tag.js"
></script>The script exposes window.signifyd after it loads. Before invoking a method, confirm that the object and method are available.
Profile virtual route changes
Call pageView() after each virtual route change that should be included in device profiling:
function profileRouteChange() {
if (window.signifyd && typeof window.signifyd.pageView === 'function') {
window.signifyd.pageView()
}
}Connect this function to the point where your router confirms that navigation has completed. Do not call it for the application's first render when the script tag already contains data-order-session-id; the script profiles that initial page automatically.
Use the same session ID for every pageView() in one customer journey. Calling pageView() does not create or change the session ID.
Available methods
pageView()
Profiles the current virtual page using the active session ID. Call it after each relevant route change.
window.signifyd.pageView()reset({sessionId})
Changes the active session ID and profiles the current page immediately. Use it only when a new customer session begins, such as after a completed purchase.
window.signifyd.reset({
sessionId: 'NEW-SESSION-ID'
})Do not call pageView() immediately after reset() because reset() already starts profiling.
init({sessionId})
Registers a session ID without profiling. This is useful when the session ID was not available in the initial script tag.
window.signifyd.init({
sessionId: 'CURRENT-SESSION-ID'
})
window.signifyd.pageView()Wait until the script has loaded before calling init(). When the script tag already contains data-order-session-id, calling init() is not required.
Handle rapid navigation
Only one profiling operation can run at a time. If another pageView() or reset() call occurs while profiling is still running, the new call is ignored. It does not throw an exception. The script logs an error and dispatches sigScriptError instead.
If your application changes routes several times in quick succession, debounce the profiling hook so it runs after the route has settled.
document.addEventListener('sigScriptError', (event) => {
console.warn('Signifyd device profiling:', event.detail)
})Validate the integration
Use browser developer tools to test a complete SPA journey:
- Confirm that
window.signifydcontainsinit,pageViewandreset. - Confirm that the initial page sends a profiling request when
data-order-session-idis present. - Navigate between virtual routes and confirm that each configured route sends another profiling request.
- Confirm that all route profiles in the same journey use the same session ID.
- Start a new session with
reset()and confirm that the next profile uses the new session ID. - Confirm that normal navigation does not produce
sigScriptErrorevents.
In the Network panel, filter for fp-web. A successful direct integration sends profiling requests to dp.signifyd.com/fp-web. If you use First-Party Proxying, the requests use the first-party endpoint configured by your organization instead.
Common issues
window.signifyd is undefined
window.signifyd is undefinedThe script has not loaded or was blocked. Confirm that script-tag.js loaded successfully and that your Content Security Policy permits the required Signifyd resources.
No session ID is registered
Provide data-order-session-id in the script tag or call init({sessionId}) before the first pageView().
Route changes do not appear
Confirm that the router invokes pageView() after navigation and that profiling is not repeatedly called while a previous operation is still running.
The wrong session is used
Retain one session ID throughout the customer journey. Call reset() only when a new session begins, and send the same active session ID in the related Signifyd API requests.
Updated 20 days ago