在本地文件上保存JSON數據

在我的程序中，我使用JSON.stringify()獲得了JSON格式的數據。現在我想將這個JSON對象保存在一個文件中。在本地文件上保存JSON數據

我的問題是：如何將JSON數據保存在本地創建的文件上，點擊jquery上的按鈕？

我JSON對象是這樣的：

{"tasks":[{"blockId":"startpoint4","tasktype":"startpoint","properties":[],"positionX":430,"positionY":230},{"blockId":"userTask5","tasktype":"userTask","properties":[],"positionX":630,"positionY":230}],"connections":[],"properties":[],"numberOfElements":5}

來源

2017-07-24 N.Malloul

我不會允許任意波形網頁，以我的本地機器上創建文件，好在JS是不能這樣做的。使用localStorage或sessionStorage將數據保存到本地計算機。 – Teemu

你可以發佈你的代碼嗎？ – Remi

您是不是要下載？ – Nagaraju

twFile檢查這個jQuery插件。

它允許您讀取和寫入本地文件。

我希望這可以幫助你

來源

2017-07-24 10:00:41 hadi

使用localStorage！這就像餅乾，但這些文件可能是做大：

var json = '{"tasks":[{"blockId":"startpoint4","tasktype":"startpoint","properties":[],"positionX":430,"positionY":230},{"blockId":"userTask5","tasktype":"userTask","properties":[],"positionX":630,"positionY":230}],"connections":[],"properties":[],"numberOfElements":5}'; 
 

 

 
localStorage.setItem("json", json); 
 

 
// if you want to use it, simply use localStorage.getItem("json") 
 

 
console.log(JSON.parse(localStorage.getItem("json")));

來源

2017-07-24 10:02:03 Luca

SO在這裏給你一個錯誤，但在你的頁面上測試它！ – Luca

好吧，但是當我運行這個，我會找到生成的文件？ –

您可以使用Blob構造和URL.createObjectURL()創建一個臨時錨標記與download屬性設置爲什麼都命名您下載的文件應有，然後在該錨元素上觸發一個click事件。這將不幸在任何瀏覽器中都不起作用，但對Blob constructor的支持其實很不錯。

這裏是一個例子。

var data = '{"tasks":[{"blockId":"startpoint4","tasktype":"startpoint","properties":[],"positionX":430,"positionY":230},{"blockId":"userTask5","tasktype":"userTask","properties":[],"positionX":630,"positionY":230}],"connections":[],"properties":[],"numberOfElements":5}'; 
 

 

 
document 
 
.querySelector('#download') 
 
.addEventListener('click', function() { 
 

 
    var blob = new Blob([ data ], { 
 
     type: 'application/octet-stream' 
 
    }); 
 

 
    var url = URL.createObjectURL(blob); 
 
    var link = document.createElement('a'); 
 
    link.setAttribute('href', url); 
 
    link.setAttribute('download', 'data.json'); 
 

 
    link.click() 
 

 
    URL.revokeObjectURL(url) 
 

 
})

<button id="download">Download</button>

來源

2017-07-24 11:12:22 DavidDomain

在其他相關問題的解決方案中，這是我最喜歡的答案。有沒有理由不使用'application/json'的類型呢？ – Nova

某些瀏覽器插件可能會嘗試使用MIME類型的「application/json」打開文件。爲了確保文件將被下載，而不是由瀏覽器直接打開，「application/octet-stream」是一個選項。 – DavidDomain

在本地文件上保存JSON數據

回答

相關問題