Veri kullanırken önerilen bir dosya adı belirtmenin bir yolu var mı: URI?

Örneğin bağlantıyı takip ediyorsanız:

data:application/octet-stream;base64,SGVsbG8=

Tarayıcı, köprünün kendisinde base64 olarak tutulan verilerden oluşan bir dosyayı indirmenizi ister. İşaretlemede varsayılan bir ad önermenin bir yolu var mı? Değilse, bir JavaScript çözümü var mı?

Şu özelliği kullanın download:

<a download='FileName' href='your_url'>

Html5-demos.appspot.com / ... adresinde canlı örnek .

Şu anda Chrome, Firefox, Edge, Opera ve masaüstü Safari'de çalışıyor ancak iOS Safari veya IE11'de çalışmıyor.

Chrome bunu bugünlerde çok basit hale getiriyor:

function saveContent(fileContents, fileName)
{
    var link = document.createElement('a');
    link.download = fileName;
    link.href = 'data:,' + fileContents;
    link.click();
}

Yalnızca HTML: şu downloadözelliği kullanın :

<a download="logo.gif" href="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7">Download transparent png</a>

Yalnızca Javascript: Herhangi bir veri URI'sini şu kodla kaydedebilirsiniz:

function saveAs(uri, filename) {
  var link = document.createElement('a');
  if (typeof link.download === 'string') {
    link.href = uri;
    link.download = filename;

    //Firefox requires the link to be in the body
    document.body.appendChild(link);
    
    //simulate click
    link.click();

    //remove the link when done
    document.body.removeChild(link);
  } else {
    window.open(uri);
  }
}

var file = 'data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7'
saveAs(file, 'logo.gif');

Chrome, Firefox ve Edge 13+ belirtilen dosya adını kullanır.

IE11, Edge 12 ve Safari 9 ( özniteliği desteklemeyendownload ) dosyayı varsayılan adlarıyla indirir veya desteklenen bir dosya türündeyse yeni bir sekmede görüntüler: resimler, videolar, ses dosyaları ,…

RFC 2397'ye göre hayır yok.

Öğenin kullanabileceğiniz herhangi bir özelliği de görünmüyor <a>.

Bununla birlikte, HTML5, daha sonra yazma desteği evrensel olmasa da download, <a>öğe üzerinde niteliği tanıttı (örneğin, MSIE desteği yok)

Netwerk / protokol / veri / nsDataHandler.cpp firefox kaynaklarında biraz baktım

veri işleyici yalnızca içeriği / türü ve karakter kümesini ayrıştırır ve dizede "; base64" olup olmadığına bakar

rfc dosya adı belirtmez ve en azından firefox bunun için dosya adı işlemez, kod rasgele bir ad artı ".part" oluşturur

Ayrıca firefox günlüğünü de kontrol ettim

[b2e140]: DOCSHELL 6e5ae00 InternalLoad data:application/octet-stream;base64,SGVsbG8=
[b2e140]: Found extension '' (filename is '', handling attachment: 0)
[b2e140]: HelperAppService::DoContent: mime 'application/octet-stream', extension ''
[b2e140]: Getting mimeinfo from type 'application/octet-stream' ext ''
[b2e140]: Extension lookup on '' found: 0x0
[b2e140]: Ext. lookup for '' found 0x0
[b2e140]: OS gave back 0x43609a0 - found: 0
[b2e140]: Searched extras (by type), rv 0x80004005
[b2e140]: MIME Info Summary: Type 'application/octet-stream', Primary Ext ''
[b2e140]: Type/Ext lookup found 0x43609a0

kaynaklarına bakmak istiyorsanız ilginç dosyalar:

data uri handler: netwerk/protocol/data/nsDataHandler.cpp
where mozilla decides the filename: uriloader/exthandler/nsExternalHelperAppService.cpp
InternalLoad string in the log: docshell/base/nsDocShell.cpp

Şimdilik bir çözüm aramayı bırakabileceğinizi düşünüyorum, çünkü hiç şüphesiz :)

html5'in bu konuda fark ettiği gibi download, firefox 20 üzerinde de çalışıyor http://www.whatwg.org/specs/web-apps/current-work/multipage/links.html#attr-hyperlink-download

Aşağıdaki Javascript snippet'i, bağlantıların yeni 'indir' özelliğini kullanarak ve bir tıklamayı simüle ederek Chrome'da çalışır.

function downloadWithName(uri, name) {
  var link = document.createElement("a");
  link.download = name;
  link.href = uri;
  link.click();
}

Ve aşağıdaki örnek bunun kullanımını göstermektedir:

downloadWithName("data:,Hello%2C%20World!", "helloWorld.txt")

Hayır.

Tüm amaç, bir dosya değil, bir veri akışı olmasıdır. Veri kaynağı, onu bir dosya olarak işleyen kullanıcı aracısı hakkında hiçbir bilgiye sahip olmamalıdır ...

bağlantı elemanına bir indirme özelliği ekleyebilirsiniz.

örneklem:

<a download="abcd.cer"
    href="data:application/stream;base64,MIIDhTC......">down</a>

Şu bağlantıya bakın: http://lists.w3.org/Archives/Public/uri/2010Feb/0069.html

Alıntı:

Hatta şu şekilde çalışır (olduğu gibi, soruna neden olmaz); base64 şu şekilde
(en azından Opera'da):

veriler: metin / düz; charset = UTF-8; başlıklar = İçerik-Disposition% 3A% 20attachment% 3B% 20filename% 3D% 22with% 20spaces.txt% 22% 0D% 0AContent dil% 3A% 20en; base64,4oiaDQo% 3 boyutlu

Ayrıca tartışmanın geri kalan mesajlarında bazı bilgiler var.

Servis çalışanlarını kullanarak , bu en doğru şekilde mümkün.

1. Sahte bir URL oluşturun. Örneğin /saveAs/myPrettyName.jpg
2. URL'yi <a href, <img srcwindow.open (url) dizininde, kesinlikle "gerçek" bir URL ile yapılabilecek her şeyi kullanın .
3. İşçinin içinde, getirme olayını yakalayın ve doğru verilerle yanıt verin.

Tarayıcı, kullanıcı dosyayı yeni bir sekmede açıp oraya kaydetmeye çalışsa bile myPrettyName.jpg dosyasını önerecektir. Dosya sunucudan gelmiş gibi olur.

// In the service worker
self.addEventListener( 'fetch', function(e)
{
    if( e.request.url.startsWith( '/blobUri/' ) )
    {
        // Logic to select correct dataUri, and return it as a Response
        e.respondWith( dataURLAsRequest );
    }
});

Google Code'da benim için çalışan küçük bir geçici çözüm betiği var:

http://code.google.com/p/download-data-uri/

İçindeki verilerle bir form ekler, gönderir ve sonra formu tekrar kaldırır. Hacky, ama bu işi benim için yaptı. JQuery gerektirir.

Bu iş parçacığı Google'da Google Kod sayfasından önce gösterildi ve bağlantıyı burada da eklemenin yararlı olacağını düşündüm.

Holf'un sürümüne dayanan bir jQuery sürümü ve Chrome ve Firefox ile çalışıyor, ancak sürümü yalnızca Chrome ile çalışıyor gibi görünüyor. Bunu yapmak için vücuda bir şeyler eklemek biraz garip ama eğer birisi daha iyi bir seçeneğe sahipse, bunun için ben varım.

var exportFileName = "export-" + filename;
$('<a></a>', {
    "download": exportFileName,
    "href": "data:," + JSON.stringify(exportData, null,5),
    "id": "exportDataID"
}).appendTo("body")[0].click().remove();

Bu biraz saçma, ama daha önce de aynı durumdaydım. Dinamik olarak javascript bir metin dosyası oluşturmak ve veri-URI ile kodlayarak indirmek için sağlamak istedim.

Bu, küçük çaplı büyük kullanıcı müdahaleleriyle mümkündür . Bir bağlantı oluşturun <a href="data:...">right-click me and select "Save Link As..." and save as "example.txt"</a>. Dediğim gibi, bu yetersizdir, ancak profesyonel bir çözüme ihtiyacınız yoksa çalışır.

Bu, önce adı panoya kopyalamak için flaş kullanılarak daha az acı verici olabilir. Tabii ki Flash veya Java kullanmanıza izin verirseniz (şimdi daha az ve daha az tarayıcı desteği ile?), Muhtemelen bunu yapmanın başka bir yolunu bulabilirsiniz.

Bu Firefox 43.0 (daha eski test edilmemiştir) ile çalışır:

dl.js:

function download() {
  var msg="Hello world!";
  var blob = new File([msg], "hello.bin", {"type": "application/octet-stream"});

  var a = document.createElement("a");
  a.href = URL.createObjectURL(blob);

  window.location.href=a;
}

dl.html

<html lang="en" xmlns="http://www.w3.org/1999/xhtml">

<head>
    <meta charset="utf-8"/>
    <title>Test</title>
    <script type="text/javascript" src="dl.js"></script>
</head>

<body>
<button id="create" type="button" onclick="download();">Download</button>
</body>
</html>

Düğme tıklanırsa , indirmek için hello.bin adlı bir dosya sundu . Hile Blob yerine File kullanmaktır .

başvuru: https://developer.mozilla.org/de/docs/Web/API/File

var isIE = /*@cc_on!@*/false || !!document.documentMode; // At least IE6
var sessionId ='\n';
var token = '\n';
var caseId = CaseIDNumber + '\n';
var url = casewebUrl+'\n';
var uri = sessionId + token + caseId + url;//data in file
var fileName = "file.i4cvf";// any file name with any extension
if (isIE)
    {
            var fileData = ['\ufeff' + uri];
            var blobObject = new Blob(fileData);
            window.navigator.msSaveOrOpenBlob(blobObject, fileName);
    }
    else //chrome
    {
        window.requestFileSystem = window.requestFileSystem || window.webkitRequestFileSystem;
         window.requestFileSystem(window.TEMPORARY, 1024 * 1024, function (fs) {
            fs.root.getFile(fileName, { create: true }, function (fileEntry) { 
                fileEntry.createWriter(function (fileWriter) {
                    var fileData = ['\ufeff' + uri];
                    var blob = new Blob(fileData);
                    fileWriter.addEventListener("writeend", function () {
                        var fileUrl = fileEntry.toURL();
                        var link = document.createElement('a');
                        link.href = fileUrl;
                        link.download = fileName;
                        document.body.appendChild(link);
                        link.click();
                        document.body.removeChild(link);
                    }, false);
                    fileWriter.write(blob);
                }, function () { });
            }, function () { });
         }, function () { });
    }

Aslında bunu Chrome ve FireFox'ta başarabilirsiniz.

Aşağıdaki URL'yi deneyin, kullanılan kodu indirir.

data:text/html;base64,PGEgaHJlZj0iZGF0YTp0ZXh0L2h0bWw7YmFzZTY0LFBHRWdhSEpsWmowaVVGVlVYMFJCVkVGZlZWSkpYMGhGVWtVaUlHUnZkMjVzYjJGa1BTSjBaWE4wTG1oMGJXd2lQZ284YzJOeWFYQjBQZ3BrYjJOMWJXVnVkQzV4ZFdWeWVWTmxiR1ZqZEc5eUtDZGhKeWt1WTJ4cFkyc29LVHNLUEM5elkzSnBjSFErIiBkb3dubG9hZD0idGVzdC5odG1sIj4KPHNjcmlwdD4KZG9jdW1lbnQucXVlcnlTZWxlY3RvcignYScpLmNsaWNrKCk7Cjwvc2NyaXB0Pg==