从服务器获取一个JSON.parse()字符串

Question

首先，我正在学习如何使用jQuery/JavaScript进行编程，并在使用JSON.parse()时遇到了问题。我理解它的格式和为什么人们使用它......但是我无法在任何代码项目中使它起作用。

我已经在书籍/在线上阅读了关于如何使用它的内容，但是我认为我阅读得太多了。我现在感到困惑并开始对我所知道的产生怀疑。

话虽如此，我的jQuery/JavaScript课程要求我通过使用MAMP/本地主机作为服务器来通过AJAX使用它进行分配。

下面的两个代码是我需要填写//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 result”中的JSON信息进行了更改（感谢这里的几个回复）。我开始更好地理解JSON。

我现在有另一个问题，就是如何从传输的整个JSON消息中隔离出其中一部分？

'JSON.parse(msg)'返回的一部分确实包括了方程式miles/gallons的答案，但我不知道如何从JSON中提取它。

方程式miles/gallons的解决方法出现在'msg'输出中。

谢谢。

编辑附加2 这个问题已经解决了！在stackoverflow上寻找之前编辑部分问题的解决方法时，我在这里找到了答案：JavaScript中解析JSON响应以获取键/值对。

答案是：在要求mpg值的//TODO部分下，我放置了以下代码- $("#mpg").val(result.message); - 它说在变量result的JSON部分中，取标记为“message”的JSON部分，其值为等式的解决方案。

感谢所有对我的问题提供解决方案的人。我感谢快速的响应、伟大的建议和理解JSON的信息。

-ECP03

- ECP03

---

你认为JSON.parse("result");会发生什么？ - user663031

由于之前没有使用过JSON，我最初认为它类似于“$_GET”（但是用于从服务器获取信息）。由于PHP（提供的）是服务器响应的模拟，我认为将“（“result”）”放入其中会从服务器中提取“$result = $miles/$gallons;”解决方案，这是我的“//TODO”目标之一。 - ECP03

Answer 1

不需要自己解析JSON，jQuery已经为您提供了一个方便的函数来解析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)，这将返回一个JavaScript对象，其中包含您从PHP脚本发送的值。通过在$.ajax调用中指定dataType: 'json'，jQuery将为您执行此操作。$.getJSON方法会为您执行此操作和其他一些操作。

- Blixt

Answer 2

你有两个选项：

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

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

var result = JSON.parse( msg );

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

使用$.getJSON()，它是以下缩写：

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

- PeterKA

---

我添加了您的选项1解决方案。另一位审阅者的回复（使用console.log(msg)）让JSON变得更加清晰。非常感谢您提供的选项2，但是在继续使用和理解JSON时，我将使用它。 - ECP03

Answer 3

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

var result = JSON.parse(msg);

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

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

- Travis Heeter

---

谢谢你向我解释！ - ECP03

Answer 4

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

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

- Alex McMillan

---

我使用console.log(msg)来测试之前观众的响应，它确实起作用了（在php中，它确实输出了成功函数）。让我走上了正确的轨道。谢谢。 - ECP03

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])
}

- Radonirina Maminiaina

---

好的。在你的回答中，你是说我可以将 'k' 添加到 'obj' 中吗？这是如何实现的？代码会是什么样子？ - ECP03

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

- Marc B

---

额，你的前三个例子也不是JSON。JSON需要一个完整的对象，其中键用双引号括起来。JSON !== Javascript。'{"foo": "bar", "baz": 42}'是JSON。 - Alex McMillan

是的，然后呢？[]代表数组。我可能对JSON使用了错误的引号，但它仍然是技术上有效的。而一个裸露的数字也是有效的JSON。例如，echo json_encode(42)将会返回42。 - Marc B

@MarcB 虽然 json_encode（和 JSON.parse）支持在 JSON 规范中编码（和解析）基元，但这并不意味着您可以将其与 JavaScript 代码进行精确比较。试试这个：JSON.parse("'hello world'") 或者这个：JSON.parse("{a: 42}")。它们都失败了，因为它们未遵循 JSON 规范。请参阅 http://www.json.org/。 - Blixt

@MarcB "[]"是合法的JSON格式。 []是JavaScript数组。无论如何，您提供的示例技术上无效，恰恰相反——它是技术上无效的。像这样的示例只会让那些正在学习的新手感到困惑——根本没有帮助他们。 - Alex McMillan

[]本身就是有效的JSON格式。而在其他编程语言中，为了将数组以JSON格式嵌入到该语言的字符串结构中，需要使用"[]"。例如，在PHP中可以使用$json = "[]"。在JSON中，"[]"是一个字符串，其中包含[和]字符。 - Marc B

好的。在回答有关JSON的问题之前，我强烈建议您去学习JSON规范。 - Alex McMillan