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

Question

У меня проблема с использованием схемы 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 есть ссылка, которая ссылается на ассоциации файлов и протоколы.

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

Описание: UnKnown

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

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

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

Answer 1

URI данных нельзя использовать для навигации, создания сценариев или для заполнения элементов фрейма или фрейма в 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 данных нельзя использовать для навигации , для создания сценариев или для заполнения элементов фрейма или фрейма.

URI данных не могут быть длиннее 32 768 символов.1019 * Данные ресурса должны быть правильно закодированы;в противном случае возникает ошибка и ресурс не загружается.Символы «#» и «%» должны быть закодированы, а также управляющие символы, не-US символы ASCII и многобайтовые символы.

Для получения дополнительной информации см. RFC2397: Схема URL «data».

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

Answer 2

Для меня поиск 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 идля всех остальных браузеров мы используем стандартную ссылку Data URI.Вы можете увидеть полный текст для более подробной информации.Наконечник шляпы Эндрю Блондо для направления .

---

ОБНОВЛЕНИЕ

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

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

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

UPDATE 2

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

Answer 3

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

Это означает, что вы можете использовать его с JavaScript:1005 *

<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, так как они допускают некоторые очень опасные вещи, включая Фишинг с использованием URI данных :

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

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

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

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

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

Answer 4

Согласно ответу Франко здесь: Экспорт файла 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
    });
}

И у меня это работает!

Answer 5

Я попал сюда, когда искал способ определения функции поддержки данных и файлов (в моем случае это PDF-файлы). Подход Modernizr к проверке поддержки изображений был недостаточно хорош, поскольку Internet Explorer 11 и Edge 25 поддерживают это, но не поддерживают такие типы файлов, как application / pdf. Подход Снексе к проверке атрибута загрузки работал в 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 данных в новом окне. Таким образом, решение, упомянутое в этом ответе SO и связанное с ним в обновлении ответа Снексе, технически лучше, и я бы рекомендовал использовать его вместо приведенного выше кода.

Answer 6

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

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

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