Se supone que mi aplicación M * EAN devuelve datos al lado angular de la base de datos usando php, pero cuando se ejecuta el controlador y se ejecuta $ http.get, response.data devuelve el código fuente de index.html.

Creo que todo el código necesario para ayudarnos a encontrar el error está debajo. También hay algunas capturas de pantalla de lo que sucede cuando la aplicación se ejecuta en Chrome usando las herramientas de desarrollador, para que sepa exactamente de lo que estoy hablando.

Nos estamos ejecutando en un servidor MAMP, y sé que nuestra aplicación se está ejecutando en el servidor Apache, pero no sabemos por qué todavía no estamos obteniendo los datos JSON, pero el HTML se envía como una respuesta JSON.

Aquí está el código que lo acompaña:

Market.php

<?php
header("Access-Control-Allow-Origin: *");
include 'dbConfig.php';

$sel = mysqli_query($con,"select * from Chef");
if (!$sel) {
    printf("Error: %s\n", mysqli_error($con));
    exit();
}
$data = array();

while ($row = mysqli_fetch_array($sel)) {
    $point = array("fullname"=>$row["fullname"],"city"=>$row["city"],"state"=>$row["state"],"zip_code"=>$row["zip_code"],"rating"=>$row["rating"]);
    array_push($data, $point);
}

header('Content-type: application/json; charset=utf-8');
echo json_encode($data);

MarketControllers.js

angular.module('OrchidApp')

.controller('marketController', function ($scope, $http) {
    console.log('ANYTHING');
    $scope.users=[];
    $http({method: 'GET', url:'market.php', headers:{ 'X-Force-Content-Type': 'application/json' }})
        .then(function successCallback(response) {
            $scope.users = response.data;
            console.log($scope.users);
            console.log("There is data here.");
            return $scope.users;
        }, function errorCallback(response) {
            console.log(response.data);
            console.log("Error.");
        });
});

Index.html

<!doctype html>
   <html lang="en" ng-app="OrchidApp" >
       <head>
           <title>Orchid</title>
           <meta charset="utf-8">
           <base href="/">
           <meta http-equiv="x-ua-compatible" content="ie=edge">
           <meta name="viewport" content="width=device-width, initial-scale=1">
            <link rel="stylesheet" type="text/css" href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
            <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.6.3/angular.min.js"></script>

            <script src="//cdnjs.cloudflare.com/ajax/libs/angular.js/1.6.3/angular-cookies.min.js"></script>

            <script src="//cdnjs.cloudflare.com/ajax/libs/angular-ui-router/0.4.2/angular-ui-router.min.js"></script>

            <script src="/js/app.js"></script>
            <script src="/js/authService.js"></script>
            <script src="/js/profileController.js"></script>
            <script src="/js/marketControllers.js"></script>
            <script src="/js/navController.js"></script>
            <script src="/js/loginController.js"></script>
            <script src="/js/signupController.js"></script>       
       </head> 
       <body class="container">
           <div ng-controller="marketController">
               <p>Above the table.</p>
               <table>
                   <tr ng-repeat="user in users track by $index">
                       <td>{{user.fullname}}</td>
                       <td>{{user.city}}</td>
                       <td>{{user.state}}</td>
                       <td>{{user.zip_code}}</td>
                       <td>{{user.rating}}</td>
                   </tr>
               </table>
               <p>Below the table.</p>
           </div>
       </body>
    </html>

Capturas de pantalla

General + response header

Request Headers

Response.data output

1
Henry Johnson 30 oct. 2017 a las 22:16

3 respuestas

La mejor respuesta

Parece que está ejecutando el servidor web de desarrollo local de angular en localhost: 3000, que es incapaz de procesar scripts PHP. Tendrá que usar algo como WAMP / MAMP, Vagrant o Docker para administrar su entorno PHP / mysql.

0
Westwick 31 oct. 2017 a las 16:30

La url / market.php probablemente no se encuentre y el servidor HTTP que está utilizando está redirigiendo a index.php en tal caso.

Otro caso podría ser que la redirección funciona bien pero el servidor no reconoce una sesión y lo está redirigiendo a index.html para iniciar sesión.

Intente abrir /market.php en un navegador para ver.

0
Marcin Malinowski 30 oct. 2017 a las 19:44

Una vez que tenga su backend / api en funcionamiento, es posible que también desee agregar la URL de la API a su $http.get, la llamada actualmente es relativa, por lo que intentará http://localhost:3000/market.php

Puedes hacer algo como:

Index.html antes de app.js

<script>
 window.api = "http://localhost:3001"
</script>

Controladora...

$http({method: 'GET', url: window.api + '/market.php'})...
1
Tyler Pham 7 nov. 2017 a las 00:11