web-dev-qa-db-ja.com

データURIリンク<a href = "data：Microsoft Edgeでは機能しません

この単純なコードは、Microsoft Edgeを除くすべての場所で完全に機能します。

<a href="data:text/plain;charset=utf-8,Test">link</a>

[JSFiddle]

Microsoft Edgeで「奇妙なことに、Microsoftはこのページを見つけることができません」というエラーが表示されます。

enter image description here

Mozillaのドキュメント の例も同じ結果にはなりません。

Edgeコンソールからの出力は次のとおりです。

このエラーは、新しいタブウィンドウを開くときに発生します。新しいタブでは、デフォルトの検索エンジンに検索クエリとしてdata:text/plain;charset=utf-8,Testが入力されます。

Microsoft Edgeにはdata:の定義がないようです

誰かがこれに対する解決策を知っていますか？

更新：残念ながら、IE/EdgeのリンクでデータURIを使用する方法はないようです。リンクでのデータURIサポートの検出に関する関連質問を作成しました： ModernizrでサポートされるリンクでデータURIを検出

hyperlinkdata-urimicrosoft-edge
24
Limon Monte

IEもMicrosoft EdgeもデータURIへのナビゲートをサポートしていません。MSDNはこれが セキュリティ上の理由から であると主張しています。

唯一の解決策は、file：//やhttp：//など、isがサポートされているスキームを使用して、コンテンツを含むリソースにリンクすることです。

興味深いことに、IE（私は6よりも古い）の古いバージョン）は、about：URIスキームでデータURIの前兆をサポートしていましたが、この方法でサポートされているのはHTMLだけでした。今日は機能し、「ナビゲーションはキャンセルされました」（以前は「アクションがキャンセルされました」）にリダイレクトされます。

12
BoltClock

IEおよびEdgeは、データURIをソースとして<img>タグをサポートしているため、JavaScriptを使用して画像へのリンクを作成し、ドキュメントに書き込むことができます。

<a href="javascript:document.write('<img src=data:image/png;base64,iVBORw0KGgoAA
AANSUhEUgAAABAAAAAQAQMAAAAlPW0iAAAABlBMVEUAAAD///+l2Z/dAAAAM0l
EQVR4nGP4/5/h/1+G/58ZDrAz3D/McH8yw83NDDeNGe4Ug9C9zwz3gVLMDA/A6
P9/AFGGFyjOXZtQAAAAAElFTkSuQmCC />')">link</a>
2
Matthew Hodges

IE/EdgeでデータURIをダウンロードするには、 navigator.msSaveBlob を使用してみます。

var a = document.getElementsByTagName('a')[0];
a.addEventListener('click', function (e) {
    if (navigator.msSaveBlob) {
        var bytes = atob(a.href.split(',')[1]), array = [];
        for(var i = 0; i < bytes.length; i++) array.Push(bytes.charCodeAt(i));
        navigator.msSaveBlob(new Blob([new Uint8Array(array)], {mime: "text/plain"}), "file.txt");
        e.preventDefault();
    }
});
2
niutech