OneSpan Sign Developer: Cookie tiers et proxy inversé

Lors de l'intégration de La session de concepteur ou d'une cérémonie de signature dans un iFrame, ces sessions intégrées nécessitent des cookies tiers activés sur votre navigateur. Et si ce n'est pas le cas, vous pourriez voir des erreurs dans la console du navigateur vous disant que "X-Frame-Options" sont réglés sur "sameorigin". 

Dans la plupart des cas, ce problème devrait être atténué en activant des cookies tiers dans les paramètres du navigateur. Cependant, il pourrait y avoir des scénarios exceptionnels qui vous interdisent de le faire. Par exemple, il est possible que votre stratégie d'entreprise n'autorise pas les cookies tiers, et l'utilisateur ne peut pas modifier ce paramètre sur son navigateur sans l'approbation de l'informatique.

Ce blog démontrera une solution potentielle impliquant l'ajout d'un serveur proxy vénéneux. Nous allons brièvement explorer cette solution et fournir une démo rapide qui vous permet de tester les résultats à votre dispositif de développement local.

Forward Proxy vs Reverse Proxy (Référence: Quora)

Vous aurez besoin de:

• Un ordinateur portable Windows 10 pour agir comme un serveur de démonstration

   

• Apache 2 installé sur le serveur. Vous pouvez simplement utiliser le serveur Apache HTTP de XAMPP. Lisez ce blog pour apprendre à installer XAMPP.

   

Les sections suivantes sont toutes basées sur la configuration Apache. Pour d'autres serveurs Web, tels que IIS et Nginx, des paramètres similaires fonctionneront également.

STEP1: Ajouter des modules Apache

Dans le fichier httpd.conf, chargez les trois modules ci-dessous.

Module de proxy_module modules de proxy_module de LoadModule/mod_proxy.so
Module de proxy_http_module modules de proxy_http_module de loadModule/mod_proxy_http.so
Module de ssl_module modules de ssl_module de loadModule/mod_ssl.so

STEP2: Configurer proxy inversé

<virtualhost>	
	SSLEngine sur
	SSLCertificateFile "conf/ssl.crt/server.crt"
	SSLCertificateKeyFile "conf/ssl.key/server.key"

	SSLproxyEngine sur
	SSLproxyVerify aucun 
	SSLProxyCheckPeerCN off
	SSLProxyCheckPeerName off
	SSLProxyCheckPeerExpire off
	ProxyPreserveHost Sur

	ProxyPass /oss http://localhost:8080/
    ProxyPassReverse /oss http://localhost:8080/

	ProxyPass / https://sandbox.esignlive.com/
    ProxyPassReverse / https://sandbox.esignlive.com/
</virtualhost>

Parce que nous travaillons avec des connexions SSL, nous devons définir la voie de la certification et la clé du serveur. Une certification autosignée suffit pour cette démo.

Grâce à cette configuration, nous avons OneSpan Sign service en cours d'exécution derrière le proxy inverse à l'itinéraire racine et exposé notre propre application (localhost:8080) à l'itinéraire de "/oss".

STEP3: Préparez votre propre application

Depuis les paramètres ci-dessus, vous pouvez voir que nous allons déployer notre application au port localhost 8080 et exposer cette application à "https://localhost/oss". Il suffit de définir XAMPP à l'écoute du port local 8080 et de mettre directement une page HTML statique nommée "iframe.html" contenant un iFrame sous le dossier htdocs.

Trouvez la page HTML dans ce Partage de Code et remplacez le lien iFrame par le vôtre.

Plus important encore, modifiez le domaine du lien en fonction de votre configuration proxy inversée. Dans notre cas, il devrait être "localhost".

Bien sûr, vous pouvez exposer votre application à différents ports et construire l'application de la manière la plus pratique pour vous.

STEP4: Résultat du test

Après avoir désactivé des cookies tiers dans votre navigateur, nous commençons Apache Server et naviguons vers notre page HTML statique à https://localhost/oss/iframe.html.

Cela résoudra le problème et la page doit se charger correctement maintenant. Essayez-le par vous-même, et n'hésitez pas à faire un post sur notre communauté pour un soutien supplémentaire.

Si vous avez des questions concernant ce blog ou toute autre chose concernant l'intégration de OneSpan Sign dans votre application, visitez les Forums communautairesdes développeurs . Vos commentaires sont importants pour nous!