$http.get JSON 从 PHP 不工作

Question

首先我是编程新手，母语不是英语，所以请原谅我在以下问题中正确命名事物等方面的错误:)

这是我的 JSON 输出：

[{"Year":"2017","Month":"1","Day":"1"},{"Year":"2017","Month":"1","Day":"2"},{"Year":"2017","Month":"1","Day":"3"},{"Year":"2017","Month":"1","Day":"4"},{"Year":"2017","Month":"1","Day":"5"},{"Year":"2017","Month":"1","Day":"6"},{"Year":"2017","Month":"1","Day":"7"},{"Year":"2017","Month":"1","Day":"8"},{"Year":"2017","Month":"1","Day":"9"},{"Year":"2017","Month":"1","Day":"10"},{"Year":"2017","Month":"1","Day":"11"},{"Year":"2017","Month":"1","Day":"12"},{"Year":"2017","Month":"1","Day":"13"},{"Year":"2017","Month":"1","Day":"14"},{"Year":"2017","Month":"1","Day":"15"},{"Year":"2017","Month":"1","Day":"16"},{"Year":"2017","Month":"1","Day":"17"},{"Year":"2017","Month":"1","Day":"18"},{"Year":"2017","Month":"1","Day":"19"},{"Year":"2017","Month":"1","Day":"20"},{"Year":"2017","Month":"1","Day":"21"},{"Year":"2017","Month":"1","Day":"22"},{"Year":"2017","Month":"1","Day":"23"},{"Year":"2017","Month":"1","Day":"24"},{"Year":"2017","Month":"1","Day":"25"},{"Year":"2017","Month":"1","Day":"26"},{"Year":"2017","Month":"1","Day":"27"},{"Year":"2017","Month":"1","Day":"28"},{"Year":"2017","Month":"1","Day":"29"},{"Year":"2017","Month":"1","Day":"30"},{"Year":"2017","Month":"1","Day":"31"}]

我已经在 valiator 上检查过它并被接受。

这是一个 RESTful API，使用 SlimApp、Apache 虚拟主机、mysql 数据库。

这是一个

calendar.php，从SQL表中获取JSON内容：

<?php
use \Psr\Http\Message\ServerRequestInterface as Request;
use \Psr\Http\Message\ResponseInterface as Response;

$app = new \Slim\App;

// Get All Customers
$app->get('/api/calendar', function (Request $request, Response $response) {

    // echo 'CALENDAR'; });

    $sql = "SELECT * FROM days";

    try {
    // Get DB Object
    $dbcalendar = new dbcalendar();
    //Connect
    $dbcalendar = $dbcalendar->connect();

    $stmt = $dbcalendar->query($sql);
    $dbcalendar = $stmt->fetchAll(PDO::FETCH_OBJ);
    // $dbcalendar = null;

    echo json_encode($dbcalendar);

    } catch(PDOException $e) {
        echo '{"error": {"text": '.$e->getMessage().'}';
    }
});`. 

以下是来自 AngularJS 的文件：

days.js

app.factory('days', ['$http', function($http) {
    return $http.get('http://slimapp/api/calendar/index.html')
        .success(function(data) {
            return data;
        })
        .error(function(err) {
            return err;
        });
}]);`,

DaysController.js

app.controller('DaysController', ['$scope', 'days', function($scope, days) {
    days.success(function(data) {
        $scope.days = data;
    });
}]);,

app.js

var app = angular.module('CalendarApp', ['ngRoute']);
app.config(function ($routeProvider) {
    $routeProvider
        .when("/", {
            controller: "DaysController",
            templateUrl: "views/test.html"
        })
        .otherwise({
            redirecTo: "/"
        });
});

test.html

<div ng-repeat="day in days"> 
<p> {{day.Year}} </p>
</div>.

当我在浏览器中输入http://slimapp/api/calendar时，JSON内容如上图所示。

将一些其他代码放入test.html，例如：<p> Hello world </p>，在浏览器中一切正常。

我使用旧版本的 AngularJS1.X，因为这是我在 CodeCademy 上学到的版本。因此我在我的$http.get 服务中使用.success 和.error。

我还在 Chrome 浏览器中安装了“Allow-Control-Allow-Origin *”扩展程序。

当我想用test.html显示JSON内容时

<div ng-repeat="day in days"> 
    <p> {{day.Year}} </p>
</div>

我在浏览器中看到空白页。没有任何错误信息，什么都没有。

请帮助我，因为我已经在这个问题上苦苦挣扎了两天，阅读了很多不同的解释，cmets 等等。我真的被卡住了:(

好的。我根据评论的建议更改了calendar.php：

`<?php
use \Psr\Http\Message\ServerRequestInterface as Request;
use \Psr\Http\Message\ResponseInterface as Response;

$app = new \Slim\App;

// Get All Customers
$app->get('/api/calendar', function (Request $request, Response $response) {

    // echo 'CALENDAR'; });

    $sql = "SELECT * FROM days";

    try {
    // Get DB Object
    $dbcalendar = new dbcalendar();
    //Connect
    $dbcalendar = $dbcalendar->connect();

    $stmt = $dbcalendar->query($sql);
    $dbcalendar = $stmt->fetchAll(PDO::FETCH_OBJ);
    // $dbcalendar = null;

    echo json_encode($dbcalendar);
    header("Content-type:application/json");
    } catch(PDOException $e) {
        echo '{"error": {"text": '.$e->getMessage().'}';
    }
});`

但问题依然存在。

Answer 1

您是否尝试过返回JSON response from SLIM？除非您的数据库查询成功，否则这应该可以工作：

$app->get('/api/calendar', function (Request $request, Response $response) {

    // echo 'CALENDAR'; });

    $sql = "SELECT * FROM days";

    try {
        // Get DB Object
        $dbcalendar = new dbcalendar();
        //Connect
        $dbcalendar = $dbcalendar->connect();

        $stmt = $dbcalendar->query($sql);
        $dbcalendar = $stmt->fetchAll(PDO::FETCH_OBJ);
        // $dbcalendar = null;

        return $response->withJson($dbcalendar);
    } catch(PDOException $e) {
        $error = array('error' => array('text' => $e->getMessage()));
        return $response->withJson($error,500);
    }

});

Answer 2

在回显 JSON 时将 Content-Type 设置为 application/json。这样，JavaScript 会自动将响应字符串解析为 JSON，否则您必须手动将响应转换为 JSON.parse()

你的 PHP 代码也容易出错，如果抛出一个不是 PDOException 的异常或者不是从它继承的异常，那么你将不会得到关于错误的信息。