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.

Suite...

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

J.P.

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

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/fr/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

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

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.

Merci

(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

.

@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/

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

Choisir les "galons"

https://emilia-g.websitex5.me/tous-les-tissages.php

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

les patrons sont dispo ;) 

Grrrrr.....

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

plus de produits dispo !!!!!!

KolAsim essaie d'aider

...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

.

@KolAsim

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

(It > Fr) ... OK ... merci ... maintenant j'ai pu vérifier ...
...mais malheureusement mon code ne peut pas fonctionner, désolé...
... 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

.

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

... OK ... ciao ...

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

.

Hello KolAsim,

Oublions Incomedia comme hébergement. Il n'y a aucun réglage possible...
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

@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 !

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>

... 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...

.

... peut-être que je n'ai pas compris quels résultats vous étiez censé obtenir, 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......

.

ciao

.

Hello,

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

A bientôt !

Ketty