Question

我使用JSONEditor（https://github.com/josdejong/jsoneditor）加载json文件，进行更改并保存文件。这很好用但它只将JSON文件保存到根据您的浏览器设置指定的文件夹。这是演示代码（https://github.com/josdejong/jsoneditor/blob/master/examples/04_load_and_save.html）：

def None_sum(*args):
    args = [a for a in args if not a is None]
    return sum(args) if args else None

我希望能够将文件保存到Web服务器。有什么办法可以将编辑后的JSON文件保存到Web服务器吗？我搜索并尝试将此库与JSONEditor集成，但没有任何乐趣：

https://abandon.ie/notebook/simple-file-uploads-using-jquery-ajax

我不仅限于ajax，所以我会考虑任何有效的方法！谢谢你的建议。约翰

更新：这是控制器代码块。

<!DOCTYPE HTML>
<html>
<head>
  <title>JSONEditor | Load and save</title>

  <link href="../dist/jsoneditor.css" rel="stylesheet" type="text/css">
  <script src="../dist/jsoneditor.js"></script>

  <script src="https://bgrins.github.io/filereader.js/filereader.js"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/FileSaver.js/2014-11-29/FileSaver.min.js"></script>

  <style>
    html, body {
      font: 11pt sans-serif;
    }
    #jsoneditor {
      width: 500px;
      height: 500px;
    }
  </style>
</head>
<body>
<h1>Load and save JSON documents</h1>
<p>
  This examples uses HTML5 to load/save local files.
  Powered by <a href="http://bgrins.github.io/filereader.js/">FileReader.js</a> and
  <a href="https://github.com/eligrey/FileSaver.js">FileSaver.js</a>.<br>
  Only supported on modern browsers (Chrome, FireFox, IE10+, Safari 6.1+, Opera 15+).
</p>
<p>
  Load a JSON document: <input type="file" id="loadDocument" value="Load"/>
</p>
<p>
  Save a JSON document: <input type="button" id="saveDocument" value="Save" />
</p>

<div id="jsoneditor"></div>

<script>
  // create the editor
  var editor = new JSONEditor(document.getElementById('jsoneditor'));
  // Load a JSON document
  FileReaderJS.setupInput(document.getElementById('loadDocument'), {
    readAsDefault: 'Text',
    on: {
      load: function (event, file) {
        editor.setText(event.target.result);
      }
    }
  });
  // Save a JSON document
  document.getElementById('saveDocument').onclick = function () {
    // Save Dialog
    fname = window.prompt("Save as...");

    // Check json extension in file name
    if(fname.indexOf(".")==-1){
      fname = fname + ".json";
    }else{
      if(fname.split('.').pop().toLowerCase() == "json"){
        // Nothing to do
      }else{
        fname = fname.split('.')[0] + ".json";
      }
    } 
    var blob = new Blob([editor.getText()], {type: 'application/json;charset=utf-8'});
    saveAs(blob, fname);
  };
</script>
</body>
</html>

我使用Postman测试了这个并且它有效。我现在无法做的就是将编辑好的JSON文件发送给控制器。这是修改后的HTML页面，我尝试发送json失败。为简洁起见，我只需添加额外/编辑的代码：

// POST api/values
    public async void Post()
    {
        string json = await Request.Content.ReadAsStringAsync();
        File.WriteAllText(
            HttpContext.Current.Server.MapPath("~\\App_Data\\somefile.json"),
            json
        );
    }

编辑javascript，我尝试将编辑过的json返回到表单：

<form id="form1" method="post" enctype="text/plain" action="http://localhost:1651/api/values">
    <input type="file" name="json" id="loadDocument" value="Load"/>
    <input type="submit" value="Save" />
</form>

请帮忙！如何将json发送到控制器？

如何使用JSONEditor将已编辑的JSON文件保存到Web服务器？

0 个答案: