Charger un fichier 3D en xhtml dans une page Wordpress

**Arsouin** · 15/02/2022, 00h16

Bonjour à tous,... au secours, je tourne en rond depuis 2 jours!

Je cherche à afficher un fichier XHTML dans une page Wordpress, il s'agit d'un modèle 3D.
Lorsque je l'ouvre directement dans Firefox ou Edge, il fonctionne parfaitement.

J'ai donc positionné le fichier sur mon serveur et je l’insère dans une page Wordpress avec le script suivant :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
  <script>
        function includeHTMLSnippet() {
  
            // Traverse the collection of
            // all HTML elements
            id = document.getElementsByTagName("*");
            for (i = 0; i < id.length; i++) {
                element = id[i];
  
                // Search for elements with
                // specific attributes
                file = element.getAttribute(
                    "GFG-include-html-snippet");
  
                if (file) {
  
                    // Create an HTTP request with the 
                    // attribute value as the file name
                    xmlRequest = new XMLHttpRequest();
                    xmlRequest.onreadystatechange = function () {
                        if (this.readyState == 4) {
                            if (this.status == 200) { 
                                element.innerHTML = this.responseText; 
                            }
                              
                            if (this.status == 404) { 
                                element.innerHTML = "Page not found.";
                            }
                              
                            // Delete the attribute and
                            // call this function again
                            element.removeAttribute(
                                "GFG-include-html-snippet");
  
                            includeHTMLSnippet();
                        }
                    }
                    xmlRequest.open("GET", file, true);
                    xmlRequest.send();
                    return; // Exit function.
                }
            }
        };
    </script>
 
    <div GFG-include-html-snippet="http://arsouinmarine.com/wp-content/uploads/2022/02/Double-vitrage.xhtml"></div>
 
    <script>
        includeHTMLSnippet();
    </script>

Et j'ai désigné les librairies suivantes dans le head :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
  <head>
    <meta http-equiv='Content-Type' content='text/html;charset=utf-8'></meta>
    <link rel='stylesheet' type='text/css' href='http://www.x3dom.org/x3dom/release/x3dom.css'></link>
    <script type='text/javascript' src='http://www.x3dom.org/x3dom/release/x3dom.js'></script>
  </head>

Et j'ai aussi essayé de les mettre en fichiers sur mon serveur, idem...

Voila le problème : tout s'affiche correctement sous Edge, malgré ces messages dont il ne tient pas compte :

Mixed Content: The page at 'https://arsouinmarine.com/essai-panoramas' was loaded over HTTPS, but requested an insecure stylesheet 'http://www.x3dom.org/download/x3dom.css'. This request has been blocked; the content must be served over HTTPS.
xmlRequest.onreadystatechange @ essai-panoramas:758
essai-panoramas:1

Mixed Content: The page at 'https://arsouinmarine.com/essai-panoramas' was loaded over HTTPS, but requested an insecure stylesheet 'http://www.x3dom.org/download/x3dom.css'. This request has been blocked; the content must be served over HTTPS.

Mais avec Firefox, il n'affiche que les boutons de contrôle mais pas le modèle 3D,avec ce message :

Blocage du chargement du contenu mixte actif (mixed active content) « http://www.x3dom.org/download/x3dom.css »

La ligne du script où ça bloque est element.innerHTML = this.responseText;.

Donc, Firefox bloque les contenus mixtes, alors que Edge ne fait qu'informer.

Y-a-t-il une autre méthode pour insérer ce fichier ? ou pour contourner le blocage ?

Merci d'avance

Jean-Pierre

**NoSmoking** · 15/02/2022, 12h25

Bonjour et bienvenue sur DVP.

Le message est clair il te faut faire tes appels/inclusions avec le même protocole en l’occurrence https:.

**Arsouin** · 15/02/2022, 14h39

Bonjour et merci pour cette piste..

J'ai fait autrement : abandonné le Js pour le php, grâce au plugin "Include me"

Il permet d'inclure du code PHP par un shortcode : includeme file="phpecho3d.php" value="Double-vitrage.xhtml".

Le fichier phpecho3d.php doit être dans le répertoire /wp-content/include-me

mon fichier phpecho3d.php :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
<?php
$fichier = file_get_contents("url ou répertoire où se trouve votre fichier à inclure" . $attrs['value'] ) ;
echo $fichier ;
?>

Merci

Charger un fichier 3D en xhtml dans une page Wordpress

HTML

Discussions similaires

Partager

Partager