web-dev-qa-db-fra.com

Schéma d'URI de données et erreurs Internet Explorer 9

J'ai un problème d'utilisation du schéma d'URL de données RFC 2397 avec les versions IE 6-9. Mon exemple de code ci-dessous fonctionne sans problème avec les versions actuelles de Safari, FF, Opera et Chrome.

data:text/html;base64,PG1ldGEgaHR0cC1lcXVpdj0icmVmcmVzaCIgY29udGVudD0iMDt1cmw9aHR0cDovL2dvb2dsZS5jb20vIj4g

ou

data:text/html,%3Cmeta%20http-equiv%3D%22refresh%22%20content%3D%220%3Burl%3Dhttp%3A//google.com/%22%3E%20

Si le code ci-dessus est collé dans presque tous les navigateurs, à l'exception de IE, il se rend sur google.com. Lors d'une tentative d'utilisation de IE, il échoue avec l'erreur suivante.

La page Web ne peut pas être affichée

Cause la plus probable:

  • Certains contenus ou fichiers sur cette page Web nécessitent un programme que vous n'avez pas installé.

Ce que vous pouvez essayer:

Recherchez en ligne un programme que vous pouvez utiliser pour afficher ce contenu Web. 

Retapez l'adresse.

Lors de l'inspection de la source de page de la page d'erreur IE générée, un lien fait référence à des associations de fichiers et à des protocoles.

Type de protocole: 

Description: inconnu

Windows ne reconnaît pas ce protocole.

Je me rends compte que l’utilisation des données: le protocole n’est probablement pas la solution la plus simple, ni dans la plupart des cas la meilleure, mais je dois l’utiliser pour ce projet particulier. 

J'ai cherché partout une solution et essayé de nombreux exemples avec IE en espérant que c'était ma syntaxe, mais j'ai encore trouvé une solution.

22
DaveCS

Les URI de données ne peuvent pas être utilisés pour la navigation, la création de scripts ou le remplissage d'éléments frame ou iframe dans IE.

Selon http://msdn.Microsoft.com/en-us/library/cc848897%28v=vs.85%29.aspx :

Les URI de données ne sont pris en charge que pour les éléments et/ou .__ suivants. les attributs.

object (images only)
img
input type=image
link
CSS declarations that accept a URL, such as background, backgroundImage, and so on.

Les URI de données peuvent être imbriqués.

Pour des raisons de sécurité, les URI de données sont limités aux fichiers téléchargés Ressources. Les URI de données ne peuvent pas être utilisés pour la navigation, pour les scripts ou. pour peupler des éléments frame ou iframe.

Les URI de données ne peuvent pas dépasser 32 768 caractères.

Les données de la ressource doivent être correctement codées. sinon, une erreur se produit et la ressource n'est pas chargée. Les caractères "#" et "%" doivent être ainsi que des caractères de contrôle, des caractères non-US ASCII et caractères multi-octets.

Pour plus d'informations, voir RFC2397: le schéma d'URL "data".

Disponible à partir de Windows Internet Explorer 8 ou version ultérieure. **

24
DaveCS

Internet Explorer prend en charge URI de données (la ressource est un peu obsolète). Certains problèmes de sécurité l'empêchent toutefois d'autoriser des tentatives malveillantes de redirection des utilisateurs, ou permettent aux pirates de se lancer dans le phishing sans recourir à des scripts tiers ou à des ressources hébergées.

Cela signifie que vous pouvez l'utiliser avec JavaScript:

<script src="data:text/javascript;base64;YWxlcnQoIldvcmtzIik7"></script>

Feuilles de style en cascade (avec ou sans encodage base64):

<link rel="stylesheet" href="data:text/css;base64,Ym9keXtjb2xvcjpncmVlbn0=">
<link rel="stylesheet" href="data:text/css,body%7Bcolor:green%7D">

Ou même des images:

<img src="data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/4QBgRXhpZgAASUkqAAg
AAAACADEBAgAHAAAAJgAAAGmHBAABAAAALgAAAAAAAABQaWNhc2EAAAMAAJAHAAQAAAAwMjIwAqAEAAE
AAAAbAAAAA6AEAAEAAAAbAAAAAAAAAP/bAIQAAwICAwICAwMDAwQDAwQFCAUFBAQFCgcHBggMCgwMCwo
LCw0OEhANDhEOCwsQFhARExQVFRUMDxcYFhQYEhQVFAEDBAQFBAUJBQUJFA0LDRQUFBUUFBQUFBQUDxQ
QFBUUExUVFBQUEBUUFQ4UFBQUEhISDxURFQ8SFRQSEBAQDQ8P/8AAEQgAGwAbAwERAAIRAQMRAf/EABg
AAAMBAQAAAAAAAAAAAAAAAAUHCAIG/8QAKxAAAQMDAwMDAwUAAAAAAAAAAQIDBAUGEQASIQciMQgTFEF
RgRVhcaHD/8QAGQEAAwEBAQAAAAAAAAAAAAAABAUGBwMC/8QALxEAAQMCAgcHBQEAAAAAAAAAAQACAwQ
RBSESMUFRYZHBEyJxobHR4RVDgfDxFP/aAAwDAQACEQMRAD8AGdeKdd3Um670bjz0waNQpzVKpVOWtSE
uqSgKefIztKipQwSOU4wRjuBq6tj52h2YTbA8Nkp6UmMaLzzS1sz0ru1qqNyrkrqWIiMrfjsjctw4HGT
wM/ngaEmxJjBaNqdRYPJpaczr8FTXRY1h7p9dVg1GpSZzNBkobYcec3qfgup9xjefqUqQ4n+ED651RYf
Utla2UjMKBx6hdTvdEw2ac7JR13psz+rytkUqTv8AITq1bVZDNZo6ncCQFYFH9O1vS+lVrOW1bD0REtl
uW8hi45Ty0hSAUkOrKlLyNvA27eBnCdZbUxNv3GjkFudDWvved55k9QpI9S0y7ujfqUk2jZ4bcaetuFP
MSSFyENrW84h1zevcvOEgZzj9hnQ76aAQh0+Wezw1JjR1dVPO5kJuNxJ360Stj1LU/ooqREuuA9Krs4s
LqM2A0lbDSACG0kDlRTlZKUjHJx5xplhjWui7mq+Xkk2PhxqgDrDRfxuUmL89awuO8KrUU202lDz3Z7K
vbSpIASlW3ZwSACR9ydUsc/ZtDBs4qLkw4TPMjjmeCGSurEun2rRqJBvStJq5U6iSiLUZHx0BKRtQ2pT
hJwPBASnggDxqUjDzdxBtx+PlaTpQEhha38DqegCM2PdL6apMrkyHKn1FuIiOuoyCpbiEA57nFLVkcnC
OAST4OgqqMygMLsr6lQUZigvIxlstdv3pdbqsGy7nn1ym3pcEy3am06hwvsKZMYtrYQUZK1pVu2r5SkK
APPGjIJXQQt7Jml/VJ4lCKmre50lj8JYVDopYQmu/GviZJYz2OtQS6lQ+4UlZB/B16+oz7YDzCB/wsH3
fJIx+W8qRKWXFbxIUQrPPCiB/QGmLNQQriS4lODo1Mk1/qBQaJUJcmVSXJrYXEW+v21dw8gHnQNaBHA6
Ros62tOaKV8kjY3OJbuWrXkya/wBV6z8ubMCn1y1OLjSnI61YXwNzaknaMDtzjgccDXKoPZUzdEDZsB9
UFGTJO7SO/wBV0kq3mRIcHzaue4+axLP+uk/bO3DkPZMxE3jzPuv/2Q==">

Cependant, vous ne pouvez pas les utiliser avec window.open ou iframe, car cela autoriserait des opérations très dangereuses, notamment/ Phishing avec des URI de données :

<iframe src="data:text/html;base64,PGJ1dHRvbiBpZD0iX3BheXBhbCI+TG9nIGludG8gUGF5cG
FsPC9idXR0b24+DQo8c2NyaXB0Pg0KICAgIF9wYXlwYWwuYWRkRXZlbnRMaXN0ZW5lcigiY2xpY2siLCB
mdW5jdGlvbiAoKSB7DQogICAgICAgIGFsZXJ0KCJUaGlzIGNvdWxkIGhhdmUgYmVlbiB1Z2x5IGZvciB5
b3UuLi4iKTsNCiAgICB9LCBmYWxzZSk7DQo8L3NjcmlwdD4="></iframe>

Ce dernier exemple aurait très bien pu être une réplique complète de l’écran de connexion Paypal. Au lieu de cela, c'est juste un bouton HTML avec un gestionnaire d'événements lié et à l'écoute des clics. Un hackery similaire pourrait provenir de window.open:

window.open("data:text/html;base64,PHN0cm9uZz5XQVQhPzwvc3Ryb25nPg==", "OHAI");

Internet Explorer 10 prend donc en charge cette fonctionnalité, mais protège l'utilisateur final de ceux qui l'utilisent de manière malveillante. Je suis sûr que Microsoft se fera un plaisir de lever cette restriction quand et si elle détermine un meilleur moyen de protéger sa base d'utilisateurs.

Jusqu'à ce que les choses changent, vous devez trouver un autre moyen d'inclure vos fichiers FLV. En passant, vous ne voudrez peut-être pas partager données réelles comme ceci depuis votre application sur Stack Overflow.

12
Sampson

Selon la réponse de Franco: Exportation de fichier CSV Pour IE

Il suffit de créer un objet Blob avec celui-ci

//Save file
if (isMicrosoftIE()) {
    csvData = decodeURIComponent(csv);

    if(window.navigator.msSaveBlob){
        var blob = new Blob([csvData],{ type: "application/csv;charset=utf-8;"});
        navigator.msSaveBlob(blob, filename);
    }
}
else
{
    csvData = "data:application/csv;charset=utf-8," + encodeURIComponent(csv);
    $(this).attr({
        "href": csvData,
        "target": "_blank",
        "download": filename
    });
}

Et cela fonctionne pour moi!

6
abla

Deux solutions alternatives sont expliquées ici: http://sparecycles.wordpress.com/2012/03/08/inject-content-into-a-new-iframe/

La principale différence que je peux dire est que l'iframe a la même origine que la page d'origine, ce qui n'est peut-être pas souhaitable (je ne suis pas sûr des implications en matière de sécurité, par exemple ce que le référent ou les cookies pourraient être pour les ressources chargées).

Voici un exemple d'utilisation de la technique javascript: scheme: http://jsbin.com/uhenuz/4 (s'il est utilisé avec https, il faudrait faire plus de recherches sur Google et de bons tests pour vérifier qu'un avertissement mixte https/http ne peut jamais arriver up.)

0
robocat

Je suis arrivé ici alors que je cherchais un moyen de détecter les caractéristiques pour la prise en charge des données par les fichiers URI (PDF dans mon cas). L’approche Modernizr consistant à vérifier la prise en charge des images n’était pas suffisante car Internet Explorer 11 et Edge 25 le prennent en charge, mais ne prennent pas en charge les types de fichiers tels que application/pdf. L'approche de Snekse consistant à rechercher l'attribut de téléchargement a fonctionné sur IE mais pas sur Edge. Finalement, j'ai écrit mon propre script de détection de fonctionnalité à l'aide d'un appel AJAX pour tenter d'ouvrir un URI de données et vérifier les erreurs. Voici le script que j'ai utilisé (testé dans IE 11, Edge 25, Firefox 46 et Chrome 49):

checkDataURISupport(function (checkResult) {
    if (checkResult) {
        alert('Files in data URIs are supported.');
    } else {
        alert('Files in data URIs are NOT supported.');
    }
})

function checkDataURISupport(callback) {
    try {
        var request = new XMLHttpRequest();
        request.onload = function reqListener() {
            callback(true);
        };
        request.onerror = function reqListener() {
            callback(false);
        };
        request.open('GET', 'data:application/pdf;base64,cw==');
        request.send();
    } catch (ex) {
        callback(false);
    }
}

Mettre à jour

J'ai réalisé que tout code qui teste l'URI des données est pris en charge par iframe, mais qui essaie également d'ouvrir un URI de données dans une nouvelle fenêtre. Ainsi, la solution mentionnée dans cette SO réponse et liée à dans la mise à jour de la réponse de Snekse est techniquement supérieure et je recommanderais de l’utiliser au lieu du code ci-dessus.

0
Chris