Je voulais juste créer une petite chose qui combine Winform avec HTML5. Je me suis soudainement intéressé et j'ai voulu y intégrer une version Web de WeChat.
D'accord, dès que l'idée surgit, agissez. L'effet final est le suivant :
Dès le début, j'avais prévu d'intégrer une iframe dans la page et de pointer vers https://wx.qq.com, ce qui serait OK, mais j'étais encore trop naïf et la version Web de WeChat sauterait automatiquement. Le résultat est le suivant :
J'ai donc cherché en ligne un moyen d'empêcher les sauts iframe, qui consiste à ajouter les deux attributs security=restrictedsandbox= à la balise iframe. Le premier est une fonction d'IE qui interdit js, et le second est une fonction de HTML5.
Utilisez sandbox=allow-scripts allow-same-origin allow-popups pour éviter les sauts. Cependant... le résultat est le suivant :
Ensuite, j'ai découvert que ce saut consiste en fait à accéder à la page de saut après avoir fermé la page d'origine. Vous pouvez donc utiliser l'événement de fermeture de page onbeforeunload pour empêcher le saut. Ajoutez donc le code suivant à la page :
document.body.onbeforeunload = function (event) { var rel = asdfawfewf; if (!window.event) { event.returnValue = rel } else { window.event.returnValue = rel;Ensuite, j'ai trouvé que le résultat est toujours comme ceci :
Quelle est la raison ? Pas de réponse à l'incident ? Ou le saut dans la version Web de WeChat est-il trop génial ? Ignorer simplement cet incident ? J'ai donc créé un nouveau code HTML vierge et ajouté l'événement séparément pour vérification.
<!DOCTYPE html> <html lang=en xmlns=http://www.w3.org/1999/xhtml> <head> <meta charset=utf-8 /> <title></title> </head> < body></body> <script>document.body.onbeforeunload = function (event) { var rel = asdfawfewf; if (!window.event) { event.returnValue = rel; } autre { window.event.returnValue = rel; } };Le résultat est réalisable :
Mais après avoir intégré l'iframe dans la page, elle saute directement. Vous pouvez essayer le code suivant.
<!DOCTYPE html> <html lang=en xmlns=http://www.w3.org/1999/xhtml> <head> <meta charset=utf-8 /> <title></title> </head> < body> <iframe src=https://wx.qq.com/ frameborder=0 style=position: absolu;border: navajowhite;left: 0;height: calc(100% - 30px);width:100%> </iframe> </body> <script> document.body.onbeforeunload = function (event) { var rel = asdfawfewf; if (!window.event) { event.returnValue = rel; sinon { window.event.returnValue = rel; } };Quand j'étais à court d'idées, je n'arrêtais pas de l'allumer et de l'éteindre pour voir si cette méthode fonctionnait. Soudain, j'ai découvert que si la page est fermée peu de temps après son ouverture, l'événement onbeforeunload ne sera pas déclenché. Après avoir attendu quelques secondes puis fermé la page, l'événement sera déclenché et une invite apparaîtra. .
Venez essayer l'affectation différée iframe à src (JQuery est cité ici).
<!DOCTYPE html> <html lang=en xmlns=http://www.w3.org/1999/xhtml> <head> <meta charset=utf-8 /> <title></title> <script src=scripts /jquery-2.2.3.js></script> </head> <body> <iframe id=iframe frameborder=0 style=position : absolu;border : navajowhite;left: 0;height: calc(100% - 30px);width:100%> </iframe> </body> <script> $(function () { setTimeout(function () { iframe.src = https : //wx.qq.com/; },5000 }); document.body.onbeforeunload = fonction (événement) { var rel = asdfawfewf; if (!window.event) { event.returnValue = rel; autre { window.event.returnValue = rel;Le résultat est effectivement réussi. Une invite apparaîtra si vous souhaitez quitter cette page. Il n’y a pas de saut en avant sur le succès. L'image ci-dessous est une photo de mon produit fini.
Vous avez terminé. Vous pouvez discuter et transférer des fichiers normalement, mais vous ne pouvez pas prendre de captures d'écran.
L'inconvénient est que vous devez cliquer sur le bouton d'annulation contextuel pour terminer la connexion, et cela doit être fait deux fois. La première fois pour ouvrir la page et la deuxième fois après avoir scanné le code QR, la page sautera à nouveau. . Il n'existe actuellement aucun moyen de résoudre ce problème. J'espère que les amis qui ont un moyen de résoudre ce problème pourront me donner quelques suggestions ~~ L'éditeur vous répondra à temps. Je voudrais également vous remercier tous pour votre soutien. Site Web VeVb Wulin !