Схема URI данных и ошибки Internet Explorer 9

у меня проблема с использованием схемы url-адресов данных RFC 2397 с версиями IE 6-9. Мой пример кода ниже работает без проблем при использовании текущих версий Safari, FF, Opera и Chrome.

data:text/html;base64,PG1ldGEgaHR0cC1lcXVpdj0icmVmcmVzaCIgY29udGVudD0iMDt1cmw9aHR0cDovL2dvb2dsZS5jb20vIj4g

или

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

если вышеуказанный код вставлен почти в любой браузер, исключая IE, он будет перемещаться к google.com, при попытке с IE он терпит неудачу со следующей ошибкой.

страница не может быть отображена

скорее всего причина:

  • для некоторых материалов или файлов на этой веб-странице требуется программа, которую вы не установили.

что вы можете попробовать:

поиск в интернете для программу можно использовать для просмотра этого веб-контента.

ввести адрес еще раз.

при проверке источника страницы сгенерированной страницы ошибки IE существует ссылка, которая ссылается на ассоциации файлов и протоколы.

Протокол Типа:

Описание: Неизвестный

Windows не распознает этот протокол.

Я понимаю, что использование data: protocol, вероятно, не самый прямой или в большинстве случаев лучший вариант, но я должен использовать его для этого конкретного проекта.

Я искал повсюду решение и пробовал много примеров с IE, надеясь, что это мой синтаксис, но все же нашел решение.

6 ответов


URI данных нельзя использовать для навигации, сценариев или для заполнения элементов фрейма или iframe в IE.

согласно http://msdn.microsoft.com/en-us/library/cc848897%28v=vs.85%29.aspx:

URI данных поддерживаются только для следующих элементов и / или атрибуты.

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

URI данных могут быть вложенными.

по соображениям безопасности URI данных ограничены для загрузки ресурсы. URI данных нельзя использовать для навигации, для написания сценариев, или для заполнения элементов frame или iframe.

URI данных не могут быть больше 32 768 символов.

данные должны быть закодированы таким образом; в противном случае возникает ошибка и ресурс не загружается. Символы " # " и " % " должны быть закодированных, а также управляющие символы, символы ASCII, и многобайтные знаки.

дополнительные информация, см. RFC2397: схема URL" data".

доступно с Windows Internet Explorer 8 или более поздней версии.**


для меня, найти document.execCommand был спасителем жизни. Он использует iFrame как и некоторые другие примеры, но execCommand делает Save As функции последовательной.

вот пример

var getCsvFileForIE = function(target) {
  var csvData = target.attributes["data-csv"].value;
  if (navigator.appName === "Microsoft Internet Explorer") {
    csvData = decodeURIComponent(csvData);

    var iframe = document.getElementById('csvDownloadFrame');
    iframe = iframe.contentWindow || iframe.contentDocument;

    csvData = 'sep=,\r\n' + csvData;

    iframe.document.open("text/html", "replace");
    iframe.document.write(csvData);
    iframe.document.close();
    iframe.focus();
    iframe.document.execCommand('SaveAs', true, 'data.csv');
  } else {
    if (console && console.log) {
      console.log('Trying to call getCsvFileForIE with non IE browser.');
    }
  }
};

мы делаем это для IE и для всех других браузеров мы используем стандартную ссылку URI данных. Вы можете увидеть вся суть для получения более подробной информации. Наконечник шляпы Эндрю Блондо для направление.


обновление

лучший способ определить, поддерживает ли браузер URI данных

supportsDataUri = 'download' in document.createElement('a');

также кажется, что IE все еще сталкивается с проблемами. Для IE10+ вам может потребоваться использовать msSaveOrOpenBlob и для IE8 / 9 вам все равно нужно сделать execCommand на iFrame.

обновление 2

есть вопрос Modernizr для обнаружения схемы uri данных. Он ссылки еще один такой ответ. Не забудьте также проверить их.


Internet Explorer поддерживает Данные URIs (ресурс немного устарел). Он имеет некоторые соображения безопасности, хотя которые мешают ему разрешать вредоносные попытки перенаправления пользователей или иным образом позволяют хакерам заниматься фишингом, не требуя сторонних скриптов или размещенных ресурсов.

это означает, что вы можете использовать его с помощью JavaScript:

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

Каскадные Таблицы Стилей (с base64 или без него кодировка):

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

или даже изображения:

<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==">

вы не можете, однако, использовать их с window.open или iframe, поскольку это позволит некоторые очень опасные вещи, в том числе фишинг с данными URIs:

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

этот последний пример вполне мог быть полной копией экрана входа в систему. Вместо этого это просто кнопка HTML с привязкой обработчика событий и прослушиванием кликов. Подобный hackery может прийти через window.open:

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

таким образом, Internet Explorer 10 поддерживает эту функцию, но он защищает конечного пользователя от тех, кто будет использовать его злонамеренно. Я уверен, что Microsoft с радостью снимет это ограничение, когда и если они определят лучший способ защитить свою пользовательскую базу.

пока все не изменится, вам нужно найти другой способ включить ваши FLV-файлы. На боковой ноте вы можете не захотеть делиться фактические данные как это из вашего приложения в стеке Переполнение.


согласно ответу Франко здесь:экспорт файлов CSV для IE

просто создайте объект Blob с ним

//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
    });
}

и это работает для меня!


здесь объясняются два альтернативных решения: http://sparecycles.wordpress.com/2012/03/08/inject-content-into-a-new-iframe/

основное различие, которое я могу сказать, заключается в том, что iframe имеет то же происхождение, что и исходная страница, что может быть нежелательно (я не уверен в последствиях для безопасности, например, что реферер или куки могут быть для загруженных ресурсов).

пример использования метода javascript: scheme приведен здесь: http://jsbin.com/uhenuz/4 (Если используется с https, потребуется дополнительное googling и хорошее тестирование, чтобы проверить, что смешанное предупреждение https/http никогда не появится.)


Я попал сюда, когда искал способ обнаружения функции для поддержки uri данных файлов (PDF в моем случае). Подход Modernizr к проверке поддержки изображений был недостаточно хорош, поскольку Internet Explorer 11 и Edge 25 поддерживают это, но не поддерживают типы файлов, такие как application/pdf. Подход Snekse к проверке атрибута загрузки работал на IE, но не на Edge. В конце концов, я написал свой собственный скрипт обнаружения функций, используя вызов AJAX, чтобы попытаться открыть URI данных и проверить ошибки. Это скрипт, который я использовал (протестирован в IE 11, Edge 25, Firefox 46 и 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);
    }
}

обновление

Я понял, что любой код, который тестирует для URI данных, является поддержкой iframe, также тестирует поддержку открытия URI данных в новом окне. Таким образом, решение, упомянутое в это так ответ и связанный с обновлением ответа Snekse технически превосходит, и я бы рекомендовал использовать его вместо вышеуказанного кода.