如何使用 jquery/ajax 将数据发送到 json 文件

Question

我发现了无数关于如何使用 jQuery 和 ajax 从 json 文件检索数据的教程，但没有关于如何将数据 POST 到 json 文件的教程。如果有人可以向我展示或向我发送一个关于如何执行此操作的小脚本，那就太好了。我到处搜索如何做到这一点，但没有运气。我见过人们这样做的例子，但他们似乎忘记分享我没有看到的重要信息。我使用 ajax 检索数据 json 文件没有问题。如果有人能告诉我我是否忘记了什么或做错了什么，那就太好了。如果有人可以向我发送一个工作文件，以便我可以对 ir 进行逆向工程并了解如何做到这一点，我将非常感激。我想将 $firstName 和 $caption 中的值发送到 json 文件。我知道这对其他人来说可能看起来很愚蠢，但我厌倦了所有的搜索却没有得到任何直接的答案。

这是我所拥有的。

      getImages: function(){
        var $firstName = $(".name"),
            $caption = $(".caption");
        var object = {
            name: $firstName.val(),
            caption: $caption.val()
        }
        $.ajax({
            type: 'POST',
            data: object,
            url: 'images.json',
            success: function(data){
                console.log("KILLER");
                var count = 0;
                $.each(data, function(i, imgSlide){
                    count ++;
                    //console.log(result.sliderImages[i].url[0].thumb);
                    var imageEl = "<img src='"+imgSlide.url[0].thumb+"' alt='"+imgSlide.name+"'>";
                    var slide = "<li class='imageSlide' data-id='"+count+"'>"+imageEl+"</li>";
                    $("ul.imageGallery").append(slide).fadeIn();
                });
            },
            error: function(){
                console.log("Abort");
            },
            timeout: 3000,
            beforeSend: function(){

            },
            complete: function(){

            }
        });

    }

这是我的 JSON 文件

    [{
      "name": "Bootcamp",
      "url": [{
        "thumb": "img/ill-bootcamp.jpg",
        "med": "img/ill-bootcamp.jpg",
        "large": "img/ill-bootcamp.jpg"
            }],
      "caption": "Lifetime Fitness",
      "ID": ""
     },
     {
       "name": "Pinup Girl",
       "url": [{
            "thumb": "img/ill-pinup.jpg",
            "med": "img/ill-pinup.jpg",
            "large": "img/ill-pinup.jpg"
             }],
      "caption": "Illustration",
      "ID": ""
     },
     {
       "name": "SixDitch",
       "url": [{
             "thumb": "img/web-sixditch.jpg",
             "med": "img/web-sixditch.jpg",
             "large": "img/web-sixditch.jpg"
             }],
       "caption": "SD MotorSports",
       "ID": ""
     }]

Answer 1

所以你需要使用服务器端脚本语言。在本例中我们将使用 PHP。

定义 json 对象后，将其转换为字符串并通过 post 将其发送到 php 文件。PHP 将从那里获取它并将其编码为 JSON 对象。该 json 对象将使用 php 函数 file_put_contents() 保存到名为 my_json_data.json 的文件中。如果您想附加新内容而不是替换旧内容，请使用如下函数：

file_put_content('my_json_data.json', $jsonObject, FILE_APPEND);

Java脚本：

var $firstName = $(".name"),
    $caption = $(".caption");
var object = {
    name: $firstName.val(),
    caption: $caption.val()
}

var params = JSON.stringify(object);

$.ajax({
    type: 'POST',
    data: params,
    url: 'save_to_json.php',
    success: function(data){
        // do something on success
    },
    error: function(){
        // do something on error
    }
});

PHP（save_to_json.php）：

    if (!isset($_POST['params']) && !empty($_POST['params'])) {
        $params = $_POST['params'];

        $jsonObject = json_encode($params);
        file_put_contents('my_json_data.json', $jsonObject);
    }

我希望我没有错过什么。祝你好运。