WebSite X5Help Center

 
Emilia G.
Emilia G.
User

Intégration Mondial Relay  fr

Autor: Emilia G.
Visitado 320, Followers 1, Compartido 0  

Bonjour à tous,

Je me retrouve face à un dilemme. Je n'arrive pas à faire fonctionner le widget mondial relay comme je le souhaiterai.

Avec l'aide d'Axel (encore merci) j'ai pu intégrer le widget afin que les clients puissent choisir leur point relais. Il s'avère que normalement losrqu'on clique sur l'adresse, le remplissage du champs se fait automatiquement. Hors, après moultes vérifications et stratagèmes, ça ne fonctionne pas. pourtant l'ID du champ a bien été indiqué dans le fichier HTLM, tout semble correct.

voici le chemin du widget

https://www.pikouik.com/mondialrelay/mondialrelay-ex4.html

et le débug :

https://www.pikouik.com/mondialrelay/debugmondialrelay.html

lorsqu'on clique sur l'adresse, le champ en dessous est sensé se remplir automatiquement :

J'ai ces erreurs qui apparaîssent :

Est-ce que vous avez déjà été confronté à ce problème ? J'ai un serveur Apache, est-ce que ce serait celui-ci qui bloque le schmilblick ?

Merci, bonne soirée !

Ketty

Publicado en
26 RESPUESTAS - 1 CORRECTO
JiPeR 48
JiPeR 48
Moderator

Hello Ketty,

En attendant l'avis d'Axel...   ;o)

J'ai voulu faire un test sur le site, mais tous les produits sont inscrits en "non disponible", donc mission impossible (je n'ai pas fait toute la liste des produits, mais une grande partie). 

Il faudrait regarder depuis ton panneau d'administration en ligne si tout est au vert (PASS) :

https://www.pikouik.com/admin/login.php

Egalement contrôler le PHP activé sur le serveur, les dernières versions du logiciel nécessitent un PHP en 8.1/8.2.

@Suivre,

J.P.

Leer más
Publicado en de JiPeR 48
JiPeR 48
JiPeR 48
Moderator

Suite...

J'ai trouvé deux pages avec des produits disponibles sur les 9 pages de la boutique. Normal ou pas ? 

J.P.

Leer más
Publicado en de JiPeR 48
Emilia G.
Emilia G.
User
Autor

Bonjour JiPeR 48,

Le souci ne se trouve pas dans le fait qu'il il à que quelques produits dans la boutique de pikouik.com, c'est tout à fait normal, pour l'instant...

Le souci se trouve dans l'intégration du plugin de Mondial Relais qui ne fonctionne pas correctement. Si tu fais une simulation pour ajouter un des patrons au panier tu verras qu'il y a un problème

Merci

Ketty

Leer más
Publicado en de Emilia G.
Axel  
Axel  
User
Usuario del mes FR

Hello à tous,

KolAsim, experts, autres utilisateurs merci de votre aide.

C'est effectivement moi qui aide Ketty sur ce sujet en lui fournissant le code que j'ai mis en place pour cette utilisation.

Le but de ce code est de choisir un point mondial relay dans le widget de Mondial Relay et que les coordonnées de ce point relay soient AUTOMATIQUEMENTcopiées dans le champ que WSX5 a crée en ajoutant notre code pour Mondial Relay.

Ici sur ma demo tout fonctionne bien:
https://wsx5demo.afsoftware.fr/boutik.php

Il suffit d'aller juste avant le paiement pour choisir le mode de livraison. Je vous laisse regarder.

Stephane que j'ai aidé aussi avec le même code n'a aucun problème ! Le post est ici:
https://helpcenter.websitex5.com/es/post/263777

Mon site de demo est en v2023.3.11... et c'est OK
Ketty fonctionne avec la v2024.1.6 mais cela ne marche pas.
J'ai rapidement essayé d'exporter mon site de demo en v2024.1.6.... et c'est OK !!!!!

Face aux problèmes j'ai donc mis en place une solution de debug rapide en exécutant du code natif HTML sans passer par Website en pensant que WSX5 était la cause.
Bien sûr ce code fonctionne bien sur mon site de demo et il fonctionne aussi sur le site de Ketty....

Mais comme je ne recontre moi aucun problème en v2023 ou v2024, il est très probable que cela soit donc un réglage à faire chez l'hébergeur.

Pour comprendre le fonctionnement en mode debug (2 fichiers html pure)

debugmondiarelay.html ---> iframe pour appeler mondialrelay-ex4.html et simple affichage du champ de test --->avec mondialrelay-ex4.html appel du widget en JS et copie du point relay choisi dans la champ de la page parent soit debugmondialrelay.html

Le fichier debugmondial.relay.tml est le suivant accessible ici:
https://www.pikouik.com/mondialrelay/debugmondialrelay.html


Il appelle dans une iframe, la page mondialrelay-ex4.html qui ensuite appel un script JS pour afficher le widget MOdial Relay. Le choix du point relay par clique sera ensuite automatiquement copié dans le champ de la page page parent soir debugmondialrelay.html.


Le contenu de debugmondialrelay.html est le suivant:

<br><br><hr class=line-form ><u><b>Mondial Relay</b> (exemple 4)</u>: <br><br><b>Choisir</b> votre point relais. <br><iframe width="750" height="300" src="mondialrelay-ex4.html"></iframe>
<br>
<input type='text' id='000000006' >

Et cela affiche le widget et l'adresse choisit dans le champ !

La copie du champ choisit se fait par la commande suivante entre la page fille mondialrelay-ex4.htmlvers la page parent debugmondialrelay.html

parent.document.getElementById('000000006').value = pointrelay;

Ici l'ID du champ '000000006' est importante, et nous maitrisons la façon de retrouver cet ID, qui ici n'est pas la cause du probkème.

Donc jusqu' ici tout fonctionne parafaitement en mode pure HTML avec 2 fichiers.

Maintenant passons à l'intégration avec WSX5

Nous copions le code suivant danss la partie 'Details Client' de la section eCommerce pour ajouter un choix de livraison.

<script> $('#000000006').val(''); </script><br><br><hr class=line-form ><u><b>Mondial Relay</b> (exemple 4)</u>: <br><br><b>Choisir</b> votre point relais qui sera automatiquement copié et indiqué ci dessous <br><iframe width="750" height="300" src="https://wsx5demo.afsoftware.fr/afs-demo/mondialrelay/mondialrelay-ex4.html"></iframe>

Ce code se trouve donc ici.

et affiche correctement le widget

En isérant notre code dans WSX5 le champ est ici automatiquement crée par WSX5... C'ets celui ci que nous voulons utiliser pour faire l'auto completion.

Mais chez Ketty et son hébergeur le champ ne se remplit pas.....!!!!!!! Le fichier mondialrelay-ex4.html est exactement le même que celui utilisé ne mode debug

Et effectivement avec un Chrome inspect nous affichons les erreurs suivantes

Cela ressemble donc fortement à un blocage fait par le provider sur la partie iframe & cross-origin car en effet le fichier mondialrelay-ex4.html fait lui appel à 3 liens externes au site web d'origine.... Donc par sécurité cela doit être bloqué chez le provider !!

Les 3 liens appelés sont.

<script type="text/javascript"
src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>

<script src="https://unpkg.com/leaflet/dist/leaflet.js"></script>

<script src="https://widget.mondialrelay.com/parcelshop-picker/jquery.plugin.mondialrelay.parcelshoppicker.min.js"></script>

Ci joint un lien sur ce type d'erreur et des explications.

https://www.apachelounge.com/viewtopic.php?t=7599

Moi je pense qu'il faudrait ajouter les 3 liens appelés dans mondialrelay4.html dans le fichier httpd.conf du serveur Web Apache chez le provider.

La commande serait :

Header set X-Frame-Options "ALLOW-FROM https://www.zyx.xyz"

Voilà le maximum de détails que je peux donner étant moi moi à l'origine de l'intégration de ce code... Mais je sèche pour aider Ketty à faire la bonne demande à son provider.

Ci joint les 2 fichier en html pure et le guide d'intégration si vous voulez essayer de votre côté.

Merci à tous pour votre aide et conseils.

Axel

Leer más
Publicado en de Axel  
Axel  
Axel  
User
Usuario del mes FR

Hello Stéphane B,

Si tu lis ce post peux tu nous dire le nom de ton provider stp.
Que je sache chez toi l'intégration s'est faite sans problème ?

Axel

Leer más
Publicado en de Axel  
Axel  
Axel  
User
Usuario del mes FR

Hello Incomedia,

Après export du site sur votre hébergement l'erreur est exactement la même !!!

https://emilia-g.websitex5.me/

Peut être que vous pouvez avoir la main pour comprendre ce qui se passe et trouver les règles à faire sur le serveur Web ....

Si cela fonctionne chez d'autres providers alors il y a forcément une solution.winksmile

Merci

Leer más
Publicado en de Axel  
 ‪ KolAsim ‪ ‪
 ‪ KolAsim ‪ ‪
Moderator
Axel  
Hello à tous, KolAsim, experts, autres utilisateurs merci de votre aide. ... ... ... ... ... 

(It > Fr)  ... Je ne sais pas si je comprends, mais cette page "debugmondialrelay.html"  est sans bibliothèque jQuery JS...
... afin d'éventuellement évaluer, publier le vrai LIEN de la page en ligne du projet, entièrement fonctionnel et contenant les champs IFRAME et INPUT sur lesquels rapporter les données externes...
...si je vois ce lien, je reviendrai ici...

.

ciao

.

Leer más
Publicado en de  ‪ KolAsim ‪ ‪
Axel  
Axel  
User
Usuario del mes FR

@KolAsim

il faut faire un achat et avant le paiement choisir la livraison

et c'est la que le probleme apparait !!!

https://emilia-g.websitex5.me/

Leer más
Publicado en de Axel  
 ‪ KolAsim ‪ ‪
 ‪ KolAsim ‪ ‪
Moderator

... Je ne vois aucun produit disponible...

Leer más
Publicado en de  ‪ KolAsim ‪ ‪
 ‪ KolAsim ‪ ‪
 ‪ KolAsim ‪ ‪
Moderator

● Ce produit n'est pas disponible. ...!...

Leer más
Publicado en de  ‪ KolAsim ‪ ‪
Emilia G.
Emilia G.
User
Autor
 ‪ KolAsim ‪ ‪
● Ce produit n'est pas disponible. ...!...

les patrons sont dispo ;) 

Leer más
Publicado en de Emilia G.
Axel  
Axel  
User
Usuario del mes FR

Grrrrr.....

hello Ketty il faut mettre a jour les produits Galons pour faire des tests wink

plus de produits dispo !!!!!!

KolAsim essaie d'aider kiss

Leer más
Publicado en de Axel  
 ‪ KolAsim ‪ ‪
 ‪ KolAsim ‪ ‪
Moderator

...maintenant je vois 3 produits verts, ...mais il n'y a pas d'option pour accéder gratuitement au formulaire de contact #step1...
... Je reviendrai ici un autre jour, si je vois des utilisateurs valides et des laissez-passer pour y accéder...
.
Bonjour; salut

.

Leer más
Publicado en de  ‪ KolAsim ‪ ‪
Emilia G.
Emilia G.
User
Autor

@KolAsim

c'est tout bon j'ai enlevé l'inscription obligatoire et mis quelques produits suplémentaires en stock

Leer más
Publicado en de Emilia G.
 ‪ KolAsim ‪ ‪
 ‪ KolAsim ‪ ‪
Moderator

(It > Fr) ... OK ... merci ... maintenant j'ai pu vérifier ...
...mais malheureusement mon code ne peut pas fonctionner, désolé...foot-in-mouth
... peut-être que la raison pourrait être que l'IFRAME n'est pas physiquement présent dans la source de la page, mais peut-être qu'il est créé dynamiquement par du code tiers...
... si au lieu de l'IFRAME actuel vous pouvez insérer le code IFRAME directement dans la page, j'essaierai de réévaluer...
... par exemple, j'ai remarqué que si sur la page "debugmondialrelay.html"  vous mettez la bibliothèque is jQuery, mon code pourrait très probablement fonctionner, mais évidemment tout doit être vérifié...

.

ciao

.

Leer más
Publicado en de  ‪ KolAsim ‪ ‪
Axel  
Axel  
User
Usuario del mes FR

Hello KolAsim,

merci pour ton aide. Mais tout fonctionne bien chez mon provider et un autre

oncherche une solution cote provider et pas  cote client !

Axel

Leer más
Publicado en de Axel  
 ‪ KolAsim ‪ ‪
 ‪ KolAsim ‪ ‪
Moderator

... OK ... ciao ...

Leer más
Publicado en de  ‪ KolAsim ‪ ‪
 ‪ KolAsim ‪ ‪
 ‪ KolAsim ‪ ‪
Moderator
Axel  
Hello KolAsim, merci pour ton aide. Mais tout fonctionne bien chez mon provider et un autre ... ... ... ... ... 

ciao, ... ...peut-être parce que tout est sur votre serveur...
... comme déjà dit précédemment, dans la page d'exemple "debugmondialrelay.html"   précédente, mon code peut fonctionner dans un environnement jQuery, et cela peut arriver car le contenu de l'iframe est sur le même serveur ; en fait:
> page invité > https://www.pikouik.com/mondialrelay/debugmondialrelay.html
> page iframe > https://www.pikouik.com/mondialrelay/mondialrelay-ex4.html
...
... à la place, l'iframe du module panier "emilia-g.websitex5.me" se trouve sur un serveur différent de la racine ; en fait
> page invité > https://emilia-g.websitex5.me/cart/index.html#step1
> page iframe > https://pikouik.com/mondialrelay/mondialrelay-ex4.html  ... >  ... (!!!)
...
... Je pense que si la même structure était respectée au sein d'un même serveur, les problèmes pourraient être résolus...

... vérifie aussi  >  www ...!...

.

ciao

.

Leer más
Publicado en de  ‪ KolAsim ‪ ‪
Axel  
Axel  
User
Usuario del mes FR

Hello KolAsim,

Oublions Incomedia comme hébergement. Il n'y a aucun réglage possible... wink
Grrrrrr.....

Restons sur le site de Pikouik qui est celui du travail initial.

Bon, sur Pikouik mes 2 fichiers fonctionnent très bien sans probleme.

> page invité > https://www.pikouik.com/mondialrelay/debugmondialrelay.html
> page iframe > https://www.pikouik.com/mondialrelay/mondialrelay-ex4.html

tu appelle https://www.pikouik.com/mondialrelay/debugmondialrelay.html

et en choisisant une ville avec le widget cela permet de copier l'adresse d'un relais dans le champ automatiquement.

il n'y a AUCUNE ERREUR avec Inspect...
Les 2 fichiers sont sur le  même domaine.

Maintenant le code de debugmondialrelay est utilisé dans le module du panier en utilisant uniquement cette ligne.

<br><br><hr class=line-form ><u><b>Mondial Relay</b> (exemple 4)</u>: <br><br><b>Choisir</b> votre point relais. <br><iframe width="750" height="300" src="mondialrelay-ex4.html"></iframe>

qui est donc toujours sur le même serveur Pikouik

Ensuite on utiliser le même fichier mondialrelay-ex4.html qui lui aussi est toujours sur le serveur Pikouik

Tu dis ...." ... Je pense que si la même structure était respectée au sein d'un même serveur, les problèmes pourraient être résolus..."

Mais je pense que dans l'environnement les 2 fichiers sont OK .... Le code est juste inséré dans WSX5... et là cela ne marche plus !

Après investigation sur Google je pense qu'il s'agit d'un réglage sur le serveur pour éviter les attaques de type CORS. Mais on peut changer le réglage avec le fichier .htaccess (si disponible et modifiable) avec la ligne:

Header always append X-Frame-Options ALLOW-FROM https://example.com/


POURQUOI cela ne fonctionne PAS avec WSX5 ???????!!!!! mais OK en HTML PURE...

Mais peut être as tu du code à ajouter sur un de mes 2 fichiers pour que cela soit pris en compte coté browser soit le côté client .

Merci encore pour ton aide

Axel

Leer más
Publicado en de Axel  
Axel  
Axel  
User
Usuario del mes FR

@KolAsim,

Pour info avons testé cela dans mondialrelay-ex4.html

<head>

<meta http-equiv="X-Frame-Options" content="DENY">
<!-- ou encore -->

<meta
http-equiv="Content-Security-Policy"
content="frame-src 'none';"
/>

ne marchent pas !

Leer más
Publicado en de Axel  
Axel  
Axel  
User
Usuario del mes FR

Oups  ERROR

En intégrant le code dans le panier de WSX5 j'ai écrit

Maintenant le code de debugmondialrelay est utilisé dans le module du panier en utilisant uniquement cette ligne.

<br><br><hr class=line-form ><u><b>Mondial Relay</b> (exemple 4)</u>: <br><br><b>Choisir</b> votre point relais. <br><iframe width="750" height="300" src="mondialrelay-ex4.html"></iframe>

Il faut indiquer le chemin pour intégrer ce code dans le module du panier de WSX5

<br><br><hr class=line-form ><u><b>Mondial Relay</b> (exemple 4)</u>: <br><br><b>Choisir</b> votre point relais. <br><iframe width="750" height="300" src="mondialrelay/mondialrelay-ex4.html"></iframe>

Leer más
Publicado en de Axel  
 ‪ KolAsim ‪ ‪
 ‪ KolAsim ‪ ‪
Moderator

... OK... peut-être que maintenant nous nous comprenons sans confusion...
...maintenant, le fichier iframe que j'ai demandé se trouve sur le même serveur que ce CART :
www.pikouik.com/cart/
...dans ce cas mon invention peut fonctionner...
... si c'est ce que vous voyez ici qui vous intéresse, ... faites-le-moi savoir...

.

Leer más
Publicado en de  ‪ KolAsim ‪ ‪
Axel  
Axel  
User
Usuario del mes FR

Hello KolAsim

Encore un fois MERCIIIIIIIIIIIIIIIIII pour ton aide sur ce problème.kisskiss

Dommage que les experts soient moins présents. undecided

Entre temps dans l'après midi j'ai trouvé la solution. foot-in-mouth
Il faut juste renseigner dans le script qui appelle la page dans l'iframe mettre le chemin complet avec les WWW. par exemple https:///WWW.monsiteweb.fr et pas seulment https://monsiteweb.fr

Et là tout fonctionne sans rien changer chez le provider.... Personnellement je ne sais pas pourquoi cela bloque avec WSX5, alors qu'en mode pure HTML cela fonctionne.

Etrange .....

Je laisse Ketty dire que tout est OK, car elle a beacoup travaillé sur le problème avec moi... Mais désormais son site web avance vite & bien... wink

Alors si tout es OK Ketty, cloturera aussi ce post....

Merci à tous & toutes
A Bientôt

Axel

Leer más
Publicado en de Axel  
 ‪ KolAsim ‪ ‪
 ‪ KolAsim ‪ ‪
Moderator

... peut-être que je n'ai pas compris quels résultats vous étiez censé obtenirfoot-in-mouth, car dans ce CART ce que j'ai simulé dans mon STAMP n'arrive pas :
https://www.pikouik.com/cart/#step1
....en tout cas bonne continuation...wink...

.

ciao

.

Leer más
Publicado en de  ‪ KolAsim ‪ ‪
Emilia G.
Emilia G.
User
Autor

Hello,

Je confirme que tout fonctionne parfaitement bien, encore un grand merci à tous !

A bientôt !

Ketty

Leer más
Publicado en de Emilia G.