web-dev-qa-db-fra.com

Utiliser Javascript pour remplacer ou désactiver la balise meta refresh

J'ai un site Web sur lequel j'essaie d'utiliser Ajax pour mettre à jour des éléments de la page sans les recharger. Cependant, il y a de bonnes chances que beaucoup de mes utilisateurs utilisent des navigateurs mobiles qui ne prennent pas en charge Javascript. J'essaie donc de concevoir la page avec des balises Meta refresh, qui ne fonctionnent en quelque sorte que pour les utilisateurs sans Javascript. Y a-t-il un moyen de faire ça?

J'ai essayé de placer la balise dans un élément noscript, mais mon navigateur de téléphone portable primitif ne l'a pas reconnu. Je pense peut-être créer un cookie pour nous rappeler si le navigateur de l'utilisateur prend en charge le langage javascript ou si une version de la page fonctionne sans javascript et essaie d'utiliser Javascript pour rediriger l'utilisateur vers une version plus sophistiquée. est une façon plus élégante de le faire. Quelqu'un a-t-il une idée?

javascripthtmlajaxmeta-tags
20
Elias Zamaria

J'ai trouvé que la balise noscript fonctionne assez bien pour cela. Par exemple, vous pouvez placer ceci juste après que vous fermez l’élément head:

<noscript>
    <meta http-equiv="refresh" content="5;URL=http://www.example.com">
</noscript>

Il n'est pas nécessaire de supprimer la balise META avec script, puisqu'un navigateur prenant en charge les scripts ignore tout ce qui se trouve à l'intérieur de l'élément noscript.

10
Shaun

Vous ne pouvez pas remplacer la balise META refresh par JavaScript.

Cependant, vous pouvez le faire

Supposons que votre page est à ->

http://example.net/mike.html Mettez le code suivant ici->

<script type="text/javascript">
window.location = 'http://example.net/mike/for_Those_With_JavaScript_Enabled.html';
</script>
10
Hrishi

Malheureusement, la réponse de @ bluesmoon , la manipulation du DOM ne fonctionne plus.

La solution consiste à récupérer le balisage d'origine, à rechercher et remplacer l'élément meta refresh, puis à écrire le nouveau document avec le balisage remplacé.

Je ne sais pas comment récupérer le balisage d'origine à l'aide de JavaScript, à l'exception de l'envoi d'une demande supplémentaire à l'aide de XMLHttpRequest.

Dans Opera, voici ce que j'utilise:

Disable meta refresh 1.00.js:

// ==UserScript==
// @name Disable meta refresh
// @version 1.00
// @description Disables meta refresh.
// @namespace https://stackoverflow.com/questions/3252743/using-javascript-to-override-or-disable-meta-refresh-tag/13656851#13656851
// @copyright 2012
// @author XP1
// @homepage https://github.com/XP1/
// @license Apache License, Version 2.0; http://www.Apache.org/licenses/LICENSE-2.0
// @include http*://example.com/*
// @include http*://*.example.com/*
// ==/UserScript==

/*
 * Copyright 2012 XP1
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 *     http://www.Apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */

/*jslint browser: true, vars: true, maxerr: 50, indent: 4 */
(function (window, XMLHttpRequest) {
    "use strict";

    if (window.self !== window.top) {
        return;
    }

    window.stop();

    var uri = window.location.href;

    var request = new XMLHttpRequest();
    request.open("GET", uri, false);
    request.send(null);

    if (!(request.readyState === 4 && request.status === 200)) {
        return;
    }

    var markup = request.responseText;
    markup = markup.replace(/<meta http-equiv="refresh".*\/?>/gi, "");

    var document = window.document;
    document.open();
    document.write(markup);
    document.close();
}(this, this.XMLHttpRequest));

Opera possède également une fonctionnalité intégrée qui désactive les actualisations méta. Pas besoin de JavaScript.

  • Cliquez avec le bouton droit sur la page Web> Modifier les préférences du site ...> Réseau> Désactiver "Activer la redirection automatique"> OK.
6
XP1

Les balises META sont terribles dans ce cas. Qu'en est-il des moteurs de recherche ??

Ce que vous devriez faire est de faire quelque chose comme je l’ai esquisséici. Vos liens doivent pointer vers des sites de travail complets comme s’il s’agissait d’une page Web 2.0. Ensuite, avec les gestionnaires d’événements (onclick), vous améliorez l’expérience utilisateur en utilisant ajax.

Ainsi, les utilisateurs d'ajax n'iront pas vers des liens, le lien est plutôt traité lorsque l'utilisateur clique dessus et envoie une demande ajax à la même URL, mais avec un paramètre ajax GET.

Maintenant, côté serveur, vous devez pouvoir générer le site complet par une méthode quelconque. S'il s'agit d'une demande ajax, vous envoyez le contenu associé. Si ce n'est pas une requête ajax, vous générez le site complet avec la partie associée embedded .

Votre site sera convivial pour le référencement , disponible pour les utilisateurs mobiles, et progressivement amélioré pour les utilisateurs de navigateurs et de plateformes modernes. Enfin, les liens de hachage générés par ajax seront utilisables, même en tant que liens.

Awesomeness . :)

3
gblazex

Supprimez simplement la balise meta avec javascript:

<meta http-equiv="refresh" content="2;http://new-url/" id="meta-refresh">

<script type="text/javascript">
var mr = document.getElementById("meta-refresh");
mr.parentNode.removeChild(mr);
</script>

J'ai réglé le délai d'actualisation à 2 secondes ci-dessus, à titre d'exemple. Vous pourriez probablement vous en tirer avec 1 seconde également, mais ne le définissez pas à 0 car le javascript n'aura aucune chance de s'exécuter dans ce cas. 0 est également gênant car il réduit la convivialité du bouton arrière.

Edit 2012-10-23 Cela ne semble plus fonctionner. Le nœud est toujours supprimé, mais il semble que les navigateurs analysent et conservent en mémoire toutes les balises méta, de quelque manière que ce soit.

3
bluesmoon

Cela a fonctionné pour moi merveilleux! (essayé en chrome)

window.stop();
3
Amresh

Je conviens que la méta-actualisation n’est pas la bonne voie à suivre ici En plus du lien des galambalazs, recherchez "amélioration progressive".

Cependant, dans l’esprit de répondre à la question, vous pouvez essayer ce qui suit. C'est non testé, peut ne pas fonctionner dans tous les navigateurs, mais devrait aller dans la bonne direction:

var i, refAttr;
var metaTags = document.getElementsByTagName('meta');
for i in metaTags {
    if( (refAttr = metaTags[i].getAttribute("http-equiv")) && (refAttr == 'refresh') ) {
        metaTags[i].parentNode.removeChild(metaTags[i]);
    }
}

Reste à savoir si sa suppression empêcherait le navigateur de se rafraîchir à temps.

1
Jhong

Ceci est un exemple de ce que j'utilise et cela fonctionne parfaitement (surtout sur Firefox)!

<html><head>
<meta http-equiv="content-type" content="text/html;charset=utf-8">
<title>Redirecting</title>
</head>
<body onload="location.replace('http://www.live.comeseetv.com'+document.location.hash)">
<a href="http://www.live.comeseetv.com">Redirecting you to http://www.live.comeseetv.com</a>
</body></html>
0
Mr Lindsay George