Question

我有一个json对象，我可以将它保存为我的桌面上的文件，如果是的话怎么做以及如何读取该文件。我只在javascript和html工作。

var canvas = new fabric.Canvas('c');
data = JSON.stringify(canvas)

我的画布是面料js，如果这有助于理解问题。我只是试图将画布保存为json对象，然后将其作为文件下载，以便保留其功能。

http://jsfiddle.net/P9cEf/3/

jsfiddle，目前正致力于在线保存和加载2个不同的画布我想下载并从计算机加载。

Answer 1

您可以使用锚标记的下载属性（我不知道它支持得多好）和html5文件api。

<a href = "#" id = "save" download="data.json">Save Canvas 1</a>
Load Canvas<input type="file" id="load" />

$( "#save" ).click(function( event ) {
    this.href = 'data:plain/text,' + JSON.stringify(canvas1)
});
$( "#load" ).change(function( event ) {
    var fr = new FileReader();
    fr.onload = function(){
        canvas2.loadFromJSON(this.result, canvas2.renderAll.bind(canvas2));
    }
    fr.readAsText(this.files[0]);    
});

http://jsfiddle.net/P9cEf/5/

这是一个版本或新IE（至少IE11）

$( "#save" ).click(function( event ) {
    event.preventDefault();
    var blob = new Blob([JSON.stringify(canvas1)],{type:'application/json'});
    navigator.msSaveOrOpenBlob(blob, 'data.json');
});

http://jsfiddle.net/P9cEf/7/

Answer 2

保存

更新您的保存功能以使用此代码段将文件保存到桌面：

http://bgrins.github.io/devtools-snippets/#console-save

上传

然后您只需要上传表单和服务器，以便您可以处理他们上传到服务器上临时位置的人员文件，以加载到您已经创建的功能中。 / LI>
服务器端编程语言可以使用哪些内容？只需谷歌如何上传该语言的文件
您可以使用jQuery ajax或vanilla JavaScript通过XHR请求上传该文件的内容

如何从浏览器下载json对象作为文件

2 个答案:

保存

上传