从服务器检索 JSON.parse() 字符串

Question

首先我会说我正在学习如何在 jquery/javascript 中编程，并且在使用 JSON.parse() 时遇到了问题。我了解这种格式，以及人们使用它的原因......但无法让它在我的任何代码项目中工作。

我已经在 how 中阅读了有关使用它的书籍/在线信息，但我认为我阅读的内容太多了。我现在很困惑，第二次猜测我对它的了解。

话虽如此，我正在学习的 jquery/javascript 课程要求我通过 AJAX 使用 MAMP/localhost 作为服务器进行分配。

下面的两个代码是我需要填写//TODO信息的部分。一种是javascript（客户端），另一种是php（服务器端）。我认为我已经正确设置了其他 //TODO 信息，但我不断收到 JSON 部分的令牌错误。

我在这里寻找解决方案，但我再次认为我把自己搞糊涂了，需要帮助。感谢任何反馈、见解或信息。

-Javascript-

var calculateMpg = function () {
    // These lines are commented out since the server will perform these checks
    // if (!checkNumber("miles") || !checkNumber("gallons")) {
        // return;
    // }
    var miles = $("#miles").val();
    var gallons = $("#gallons").val();
    console.log("ajax request issued.");
    var result;
    $.ajax({
        url: "service.php?action=calculateMPG&miles="+miles+"&gallons="+gallons, 
        cache: false,
        dataType: "text",
        success: function(msg) {
            console.log("ajax response received.");
        //  TODO: parse the JSON string returned from the server (see JSON.parse())
        JSON.parse("result");
        if (result.status === 'success') {
        //  TODO: get the mpg value returned from the server and display it to the user.
            $("#mpg").val($_GET("result"));
            console.log("JSON Working!");
        }
        else {
            // TODO: get the name of the variable with the error. Hint: look at the 'fail' result from service.php 
            $_GET[fail(id)];
            // TODO: report the error to the user using invalidNumber() function.
            alert("{status: 'failure', variable: <variable name>}");
        }
    }
});
};

$(document).ready( function () {
    $("#miles").blur(function () {
        checkNumber("miles");
    });
    $("#gallons").blur(function() {
        checkNumber("gallons");
    });
    $("#calculate").click(calculateMpg);
    $("#miles").focus();
});

-PHP-

<?php
if ($_GET) {
    if ($_GET['action'] == 'calculateMPG') {
        $miles = htmlspecialchars($_GET['miles']);
        $gallons = htmlspecialchars($_GET['gallons']);
        // validate miles
        if (strlen($miles) == 0) {
            fail("miles");
        }
        $miles_chars = str_split($miles);
        for ($i=0; $i< count($miles_chars); $i++) {
            if ($miles_chars[$i] < "0" || $miles_chars[$i] > "9") {
                //error_log("miles_chars check failed at: " + $i);
                fail("miles");
            }
        }
        // validate gallons
        if (strlen($gallons) == 0) {
            fail("gallons");
        }
        $gallons_chars = str_split($gallons);
        for ($i=0; $i< count($gallons_chars); $i++) {
            if ($gallons_chars[$i] < "0" || $gallons_chars[$i] > "9") {
                fail("gallons");
            }
        }
        // validate $miles and $gallons calling $fail along the way
        $result = $miles/$gallons;
        if ($result) {
            success($result);
        } else {
            fail("mpg");
        }
        exit ;
    }
 }

function fail($variable) {
    die(json_encode(array('status' => 'fail', 'variable' => $variable)));
}

function success($message) {
    die(json_encode(array('status' => 'success', 'message' => $message)));
}

已编辑附加 1 我已经对“var 结果”的 JSON 信息进行了更改（感谢这里的几个回复）。我开始更好地理解 JSON。

我（现在）的另一个问题是如何将 JSON 消息的一部分与正在传输的整个消息隔离开来？

返回的“JSON.parse(msg)”的一部分确实包含方程式英里/加仑的答案，但我不知道如何...从 JSON 中提取它。

英里/加仑等式的解出现在“msg”输出中。

谢谢。

已编辑附加 2 这个问题已经解决了！在仔细阅读 stackoverflow 以解决我之前编辑的部分中的问题时，我在这里找到了答案：JSON response parsing in Javascript to get key/value pair。

答案是这样的：在要求mpg值的//TODO部分下，我输入了以下代码 - $("#mpg").val(result.message); - 表示在变量结果的 JSON 部分中，取 JSON 中标记为“消息”的部分，该值是方程解。

感谢所有为我的问题提供解决方案的人。我很欣赏快速响应、很棒的建议以及了解 JSON 的信息。

-ECP03

Answer 1

JSON.parse() 要求您向其发送有效的 JSON 字符串。

"result" 不是有效的 JSON 字符串。在您的success 函数中，您定义了一个参数msg - 它包含什么？在成功函数的开头尝试 console.log(msg) 并查看控制台输出。

Answer 2

你有两个选择：

选项 1： -- 解析返回的字符串。

将JSON.parse("result"); 更改为：

var result = JSON.parse( msg );

选项 2： -- 请求 JSON 而不是纯文本 - 无需解析

使用$.getJSON() 的简写形式：

$.ajax({
  dataType: "json",
  url: url,
  data: data,
  success: success
});

Answer 3

jQuery 已经为您提供了一个方便的函数来解析 JSON，而不是自己解析 JSON：

var path = "service.php?action=calculateMPG&miles="+miles+"&gallons="+gallons;
$.getJSON(path, function (data) {
  if (data.status == 'success') {
    console.log('Success! Message:', data.message);
  } else {
    console.log('Failed :( Variable:', data.variable);
  }
});

对于您的原始代码，您需要做的是在您的success 回调中调用JSON.parse(msg)，这将返回一个带有您从PHP 脚本发送的值的JavaScript 对象。通过在$.ajax 调用中指定dataType: 'json'，jQuery 会为您执行此操作。 $.getJSON 方法会为您执行此操作以及其他一些操作。

Answer 4

需要使用success函数返回的结果：

var result = JSON.parse(msg);

然后，您可以执行result.status 之类的操作。

当您输入JSON.parse("result") 时，您说的是“解析字符串'result'”，这没有任何意义。但是，如果您说 JSON.parse(msg)，您是在说“解析从 ajax 操作返回的变量”，这是有道理的。

Answer 5

JSON.parse() 用于将您的 json 数据转换为对象，然后您可以轻松操作它。JSON.parse(msg); 而不是JSON.parse("result")。 例如：

var json = '{"value1": "img", "value2":"img2"}'
var obj = JSON.parse(json);
for ( k in obj ) {
    console.log(obj[k])
}

Answer 6

这是完全错误的：JSON.parse("result");。 .parse() 需要一个 JSON 字符串，例如从您的 ajax 请求返回的字符串。您没有提供该字符串。您提供的词是 result，它是不是有效的 JSON。

JSON 本质上是赋值表达式的右侧。例如

var foo = 'bar';
          ^^^^^---this is json
var baz = 42;
          ^^---also json
var qux = ['a', 'b', 'c'];
          ^^^^^^^^^^^^^^^---even more json

var x = 1+2;
        ^^^---**NOT** json... it's an expression.

你所做的基本上是：

var x = parse;
        ^^^^^^---unknown/undefined variable: not JSON, it's an expression