Intégrer votre formulaire d'application

Résumé des exigences d'intégration :

• Fournir une URL d'application qui peut être rendue dans un iFrame.
• Mettre à jour votre politique de sécurité de contenu (CSP).
• Implémenter des signaux d'événements d'application en temps réel.
• Intégrer une solution de suivi des conversions.

Rendre l'application dans un iFrame

Rokt gère un plugin wrapper qui intègre le formulaire d'application dans un iframe pour permettre des applications directement sur une page partenaire. Ce plugin sert de proxy pour la communication avec le Web SDK ainsi que la page partenaire. Le plugin d'application de carte de crédit est hébergé sur le domaine du fournisseur et doit être une application web standard utilisant le framework de votre choix. Pour chaque carte de crédit ou produit, vous devez fournir une URL de formulaire d'application. L'interaction entre la page d'application de carte de crédit et le plugin Rokt est activée via la transmission de messages basée sur le navigateur. Le plugin de carte de crédit de Rokt est réactif et redimensionnera et centrera l'application de carte de crédit pour s'adapter aux écrans des utilisateurs ainsi que créer des dégradés d'arrière-plan.

Pour résumer, le plugin fournisseur Rokt (iFrame) :

• Sert de proxy pour la communication avec le Web SDK ainsi que la page parente.
• Est hébergé sur votre domaine et doit être une application web standard.
• Doit inclure l'URL de la page d'application dans les champs de données pour chaque carte de crédit unique que vous proposerez via Rokt.

L'interaction entre la page d'application de carte de crédit et le plugin Rokt sera activée via la transmission de messages basée sur le navigateur. Les détails spécifiques de l'implémentation avec des exemples de code sont inclus ci-dessous.

Considérations sur la politique de sécurité du contenu

Veuillez confirmer que la politique de sécurité du contenu (CSP) de votre formulaire de demande de carte de crédit permet l'hébergement via le domaine de Rokt : https://apps.rokt.com. Sinon, le plugin de Rokt ne pourra pas héberger le formulaire de demande. Rokt charge l'URL du formulaire fourni en tant qu'iframe d'origine croisée -- ce qui signifie que Rokt ne peut interagir avec la page que par le biais des autorisations explicites données par le CSP de la page. Dans la définition du CSP, nous vous recommandons de lister explicitement https://apps.rokt.com dans la section frame-ancestors. Cela garantit que seul le domaine Rokt est autorisé à intégrer le formulaire de demande. Ce faisant, vous êtes protégé contre l'injection de scripts tiers sur votre page web.

Décisions d'application en temps réel

Le processus de demande de carte de crédit doit communiquer les décisions d'application (comme approuvé instantanément, en attente ou refusé) avec Rokt en temps réel via l'API du plugin, cela garantit que nous affichons un contenu de placement pertinent. Pour toute décision en attente qui est résolue ultérieurement, vous devez communiquer ces résultats à Rokt via l'Event API ou un autre mécanisme de livraison de données. Plus de détails sont disponibles dans la section suivi des conversions de ce document.

Rokt fournit un mécanisme permettant aux fournisseurs de cartes d'envoyer des signaux d'événements pour représenter les interactions des utilisateurs avec le navigateur. Ces signaux permettent à Rokt de répondre aux interactions des utilisateurs et de déclencher des changements d'état sur le placement (par exemple, afficher un message de succès lorsque les clients terminent la demande). Ils fournissent également des données d'événements importantes pour le reporting et la détection des anomalies. Rokt n'a aucune visibilité sur le contenu du formulaire de demande ou les interactions des clients avec votre formulaire. Par conséquent, nous comptons sur le formulaire de demande pour nous envoyer des informations sur le statut à la fenêtre parente afin de permettre le rapport sur la progression et le succès de la demande, ainsi que de surveiller quand ils ont terminé ou quitté le formulaire afin de réduire la fenêtre.

Signal	Description
Application Initiated	Le formulaire de demande a été chargé et est prêt pour l'interaction utilisateur.
Application Closed	L'utilisateur ferme la demande.
Application Approved	La demande de l'utilisateur est approuvée instantanément en temps réel.
Application Pending	La demande de l'utilisateur est en attente de révision par le fournisseur.

Envoi de messages de statut

Rokt ne peut pas accéder à aucun contenu dans votre formulaire d'application et c'est pourquoi il est important que votre application communique avec Rokt pour nous informer du statut de la demande du client.

Au cours du cycle de vie de votre flux d'application, Rokt s'attend à recevoir trois messages : « Initiated » « Approved » ou « Pending » « Closed »

Les messages sont envoyés via PostMessage à la fenêtre Rokt, par exemple :

roktWindow.postMessage({ type: 'initiated' }, ‘https://your.domain.com’);

IMPORTANT

• Pour des raisons de sécurité, nous recommandons de fournir un targetOrigin spécifique pour chaque postMessage, évitez d'utiliser *. Rokt ignorera tout message qui ne provient pas de votre domaine.
• Pour des raisons de sécurité, Rokt n'enverra aucun message à votre application, par conséquent votre application ne doit pas écouter d'événements « message ».
• Votre application sera ouverte par Rokt. La référence de la fenêtre Rokt se trouve dans window.opener. Néanmoins, il est possible que l'opener ne soit pas fourni, dans ce cas, vous devez revenir à window.parent.

const roktWindow = window.opener || window.parent; roktWindow.postMessage(...);

Messages

Message d'initiation

Rokt s'attendra à un message initiated dès que votre application est chargée. Les données du message sont { type: 'initiated' }

IMPORTANT

Il est très important pour Rokt de recevoir ce message pour savoir que votre formulaire d'application a été rendu. L'absence de ce message sera considérée comme une anomalie et entraînera une enquête de la part de Rokt.

Message de statut de progression

Rokt s'attendra à un message pending ou approved, selon le résultat de l'application.

Pending doit être envoyé si l'utilisateur complète votre application, mais que vous ne pouvez pas approuver cette application immédiatement. Les données du message pending sont { type: ‘pending’}.

Approved ne doit être envoyé que si vous êtes en mesure d'approuver instantanément l'application de l'utilisateur pour votre produit. Les données du message approved sont { type: ‘approved’ }.

IMPORTANT

Le message de changement de statut ne doit être envoyé que si l'utilisateur soumet le formulaire d'application. Ne pas envoyer de signal pending ou approved si le client quitte sans soumettre le formulaire.

Message de fermeture

Rokt s'attendra à un message close chaque fois que l'utilisateur ferme le formulaire d'application, que l'application ait été complétée ou non. Rokt déchargera votre fenêtre dès qu'un message close sera reçu. Les données du message close sont { type: ‘close’ }

info

Les utilisateurs peuvent fermer le formulaire d'application en interagissant avec l'un des boutons du formulaire. Si votre formulaire n'a pas de bouton "fermer" et que vous vous fiez au bouton "X" dans l'iFrame du plugin Rokt pour fermer votre application, alors vous n'êtes pas tenu d'envoyer ce signal.

Exemples d'implémentation

Cet exemple d'implémentation peut être utilisé directement dans votre application :

const roktIntegration =  (function(origin) {
  const targetOrigin = origin || window.location.origin;
  const roktWindow = window.opener || window.parent;
  
  return {
    initiated() {
      roktWindow.postMessage({ type: 'initiated' }, targetOrigin);
    },
    close() {
      roktWindow.postMessage({ type: 'close' }, targetOrigin);
    },
    approved() {
      roktWindow.postMessage({ type: 'approved' }, targetOrigin);
    },
    pending() {
      roktWindow.postMessage({ type: 'pending' }, targetOrigin);
    },
  };
})(/* votre domaine de page ici */);

// Après le chargement ou dès que votre application est prête / interactive
roktIntegration.initiated();

// ,,, l'utilisateur complète votre application
// Si l'application a été approuvée par votre système
roktIntegration.approved();
// Si l'application a été refusée ou est en attente d'une analyse plus approfondie
roktIntegration.pending();

// Avant de terminer l'application
roktIntegration.close(); // Le message de fermeture fermera votre fenêtre pour vous.

Alternativement, vous pouvez implémenter ce qui suit :

// Après le chargement ou dès que votre application est prête / interactive
(window.opener || window.parent).postMessage({ type: 'initiated' }, /* votre domaine de page ou */ window.location.origin);

// ,,, l'utilisateur complète votre application
// Si l'application a été approuvée par votre système
(window.opener || window.parent).postMessage({ type: 'approved' }, /* votre domaine de page ou */ window.location.origin);

// Si l'application a été refusée ou est en attente d'une analyse plus approfondie
(window.opener || window.parent).postMessage({ type: 'pending' }, /* votre domaine de page ou */ window.location.origin);

// Avant de terminer l'application
(window.opener || window.parent).postMessage({ type: 'close' }, /* votre domaine de page ou */ window.location.origin); // Le message de fermeture fermera votre fenêtre pour vous.

Suivi des conversions

Les annonceurs et les fournisseurs sont tenus d'intégrer une solution de suivi des conversions. Configurer le rapport de conversion automatique vous aide à mesurer l'impact de vos campagnes sur votre entreprise. Rokt offre plusieurs façons d'intégrer vos données de conversion. Pour une précision optimale, nous recommandons d'utiliser le Rokt Web SDK ou l'Event API. Les instructions pour chaque méthode sont listées ci-dessous :

• Web SDK
• Event API

Bien que cela ne soit pas recommandé, vous pouvez alternativement fournir des données de conversion via un téléchargement de fichier manuel. Les données de conversion retardées ne doivent être utilisées que lorsqu'aucune autre solution de suivi des conversions n'est possible, car cela a des implications significatives pour nos modèles de prédiction (c'est-à-dire la pertinence), restreint l'accès aux outils intelligents et perturbe les capacités de reporting et d'analyse.

Approbations en attente

Le Web SDK ne suivra que les applications qui peuvent être approuvées en temps réel lorsque le client soumet l'application. Les applications en attente qui nécessitent un examen supplémentaire avant qu'une décision d'approbation puisse être prise doivent toujours être fournies à Rokt afin que nous puissions capturer toutes les conversions attribuées à Rokt. Pour intégrer les données d'approbation en attente, nous recommandons d'utiliser l'Event API. En utilisant l'Event API, votre serveur backend peut se connecter en toute sécurité à celui de Rokt, transmettant les données de conversion une fois qu'une décision a été prise concernant le succès d'une demande de carte de crédit.

Suivez ces instructions sur la façon d'intégrer l'Event API.

remarque

Pour attribuer correctement les conversions, vous devez inclure l'un des éléments suivants : email (email), email haché SHA-256 (emailsha256), ou Rokt Tracking ID (passbackconversiontrackingid) dans objectData afin que Rokt puisse identifier le client. Le Rokt Tracking ID est l'identifiant préféré pour la plupart des institutions de services financiers qui font de la publicité avec Rokt.