Javascript 將即時生成的 BLOB 文件下載到特定文件夾中

Question

所以我正在嘗試編寫一個 Firefox Webextension。 我想將網頁的標題、網址和個人評論保存到文件myfile.txt

這是我來的：

我不希望我的 Downloads 文件夾很快變滿，所以我想將它們下載到我的 Downloads 文件夾中包含的文件夾中，我們稱之為VNW 。 FIY 我說的是“下載”，但它是一個虛擬下載：我即時構建文件並設法像這樣保存：您不需要互聯網連接。

我寫了這段代碼：

var textToSave = "<TITLE>" + titolo + "</TITLE>"  + "<COMMENT>" + comment + "</COMMENT>" + "<LINK>" + indirizzo + "</LINK>" + "\n"; 
var hiddenElement = document.getElementById('SAVE');
hiddenElement.href = 'data:attachment/text,' + encodeURI(textToSave);
hiddenElement.download = 'VNW/myfile.txt';

壞事它將文件保存在我的Downloads文件夾中，而不是我期望的Downloads/VNW ，並將文件保存為VNW_myfile.txt

為什么？

問題中的問題：當我在編輯器中打開myfile.txt ，例如：

<TITLE>How to download silently with javascript - Stack Overflow</TITLE><COMMENT>My comment</COMMENT><LINK>http://stackoverflow.com/questions/37781938/how-to-download-silently-with-javascript

最后</LINK>標記被修剪的地方...我無法想象為什么...:(有沒有辦法可以靜默下載文件，而不會每次都提示用戶？

提前致謝！！

編輯 1：

使用我正在寫的 Daniel Herr 評論（我是 Javascript 初學者）

var comment = document.getElementById('COMMENT').value;
var titolo=document.getElementById('TITLE_TAB').value;
var indirizzo=document.getElementById('URL_TAB').value;
var textToSave = "<TITLE>" + titolo + "</TITLE>"  + "<COMMENT>" + comment + "</COMMENT>" + "<LINK>" + indirizzo + "</LINK>" + "\n"; 
var downloading;
var txt_saving =  'data:attachment/text,' + encodeURI(textToSave);
downloading = browser.downloads.download(url : txt_saving,filename : 'VNW.txt');

但它不起作用......再次感謝

編輯 2再次感謝丹尼爾，我正在接近解決方案，但我不在那里。

感謝您的代碼，它開始下載，但它說它像圖像中一樣失敗

我檢查了我的清單，下載是正確的。

這里是，

{
  "browser_action": {
    "browser_style": true,
    "default_title": "TENTATIVO",
    "default_popup": "save_url.html"
  },
  "description": "TENTATIVO",
  "manifest_version": 2,
  "name": "TENTATIVO",
  "permissions": [
    "tabs",
    "downloads",
    "activeTab"
  ],
  "page_action": {
    "default_icon": "save.png",
    "default_title": "TENTATIVO"
  },
  "version": "1.0"
}

還添加了所有代碼以供參考。

save_url.html

<!DOCTYPE html>

<html>
  <head>
    <meta charset="utf-8">
    <link rel="stylesheet" href="tabs.css"/>
  </head>

<body onload="save_url.js">
  <div style="margin-left:5%" id="BODY">
  <form>
  <br>
  <strong>TITOLO:</strong>
  <br>
  <input type="text" value="" id="TITLE_TAB" style="width:90%;"></input>
  <br>
  <strong>URL:</strong>
  <br>
  <input type="text" value="" id="URL_TAB" style="width:90%;"></input>
  <br>
  <strong>DESCRIZIONE:</strong>
  <br>
  <textarea rows="5" cols="5" placeholder="Descrizione.." style="width:90%;" id="COMMENT"></textarea>
  <br>
  <center>
  <a href="" id="SAVE" style="width:90%;" value = "" >SALVA</a>
  </center>
  <br>
  <br>
  </form>
  </div>
  <script src="save_url.js"></script>
  <script src="FileSaver.js"></script>
</body>

</html>

save_url.js

browser.tabs.query({'active': true, 'lastFocusedWindow': true}, function (tabs) {
    var url = tabs[0].url;
    var title = tabs[0].title;

    var x = document.getElementById("URL_TAB");
    x.value = url;
    var y = document.getElementById("TITLE_TAB");
    y.value = title;
});

document.addEventListener('DOMContentLoaded', function() {
  document.getElementById("SAVE").addEventListener("click", salva);
});

function salva()
{
    var comment = document.getElementById('COMMENT').value;
    var titolo=document.getElementById('TITLE_TAB').value;
    var indirizzo=document.getElementById('URL_TAB').value;
    var textToSave = "<TITLE>" + titolo + "</TITLE>"  + "<COMMENT>" + comment + "</COMMENT>" + "<LINK>" + indirizzo + "</LINK>" + "\n"; 

    browser.downloads.download({
                                url: URL.createObjectURL(new Blob([ textToSave ])),
                                filename: "test/test.txt",
                                })
}

編輯 3解決了。

我實際上寫了一篇博文（我的第一篇！），感謝所有的幫助。

Answer 1

您將需要使用下載 API 並向清單添加“下載”權限。

browser.downloads.download({
 url: URL.createObjectURL(new Blob([ textToSave ])),
 filename: "test/test.txt",
 saveAs: false,
})

如果filename是路徑，則將根據需要創建任何父文件夾。

https://developer.mozilla.org/en-US/Add-ons/WebExtensions/API/downloads/download

子文件夾需要 Firefox 51+ https://bugzilla.mozilla.org/show_bug.cgi?id=1280044

Answer 2

您是否嘗試過在文件目標 (/VNW/..) 前面使用前導 / 或 \\ 或使用完整的文件目標 (..\\downloads\\VNW\\myfile.txt) 您是否在自己的服務器上運行它？ 也許您可能需要更多地探索您的文件系統結構？？？ 您可能需要從瀏覽器中捕獲用戶選擇的文件路徑？

Javascript 將即時生成的 BLOB 文件下載到特定文件夾中

問題描述

2 個解決方案

解決方案1
1 2017-02-10 22:49:52

解決方案2
0 2017-02-10 22:30:17

Javascript 將即時生成的 BLOB 文件下載到特定文件夾中

問題描述

2 個解決方案

解決方案1 1 2017-02-10 22:49:52

解決方案2 0 2017-02-10 22:30:17

解決方案1
1 2017-02-10 22:49:52

解決方案2
0 2017-02-10 22:30:17