2016-07-11 6 views
0

Alles klar, ich versuche es so einfach wie möglich zu erklären. Ich habe einen Node und Express eingerichtet und mySQL Server läuft eine RESTful API mit dem üblichen Get, Post, Put, Delete funktioniert gut, da ich sie mit ihnen in Postman testen und einfach in Chrome nachschlagen kann. Dies wird jetzt lokal auf meinen Rechnern ausgeführt. Ich habe eine Ubuntu-Box, auf der die REST-API läuft. Wenn ich nur in Chrom abfrage, bekomme ich eine erwartete Ausgabe der Felder, mit denen ich arbeite.RESTful API wird nicht mit einem einfachen AngularJS Controller angezeigt

(Beispiel Anfrage "http://192.168.239.130:1337/api/plates/") Gibt mir dies.

{ 
"Plates": [ 
    { 
     "lot_number": "P234", 
     "plate_number": "NGE-781", 
     "date_and_time": "2016-07-08T21:14:31.000Z" 
    }, 
    { 
     "lot_number": "P234", 
     "plate_number": "FEB-423", 
     "date_and_time": "2016-07-08T21:26:08.000Z" 
    }, 
    { 
     "lot_number": "P234", 
     "plate_number": "SEB-623", 
     "date_and_time": "2016-07-08T21:26:20.000Z" 
    }, 
    { 
     "lot_number": "P234", 
     "plate_number": "ZEB-683", 
     "date_and_time": "2016-07-08T21:30:59.000Z" 
    }, 
    { 
     "lot_number": "P234", 
     "plate_number": "FEW-083", 
     "date_and_time": "2016-07-08T21:31:57.000Z" 
    }, 
    { 
     "lot_number": "L323", 
     "plate_number": "JEQ-324", 
     "date_and_time": "2016-07-11T18:59:03.000Z" 
    } 
    ] 
} 

Dies sind nur einige Beispiel-mySQL-Daten, die auf dem Bildschirm gedruckt werden. Was funktioniert, wie ich es mir erhofft hatte. Mein Problem ist, wenn ich versuche, eine einfache HTML-Seite mit eckigem Skript zu erstellen, um zu versuchen, es zu drucken, will es nicht. Alles, was ich bekomme, ist eine leere Seite. Ich habe versucht, meinen Code mit anderen APIs online laufen zu lassen. Ich habe kein Problem, diese mit dem identischen Code auszudrucken, den ich im Folgenden veröffentlichen werde.

<!DOCTYPE html> 
<html> 
</style> 
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script> 
<body> 

<div ng-app="myApp" ng-controller="platesCtrl"> 

{{plates}} 

</div> 

<script> 
var app = angular.module('myApp', []); 
app.controller('platesCtrl', function($scope, $http) { 
    $http.get("http://192.168.239.130:1337/api/plates") 
    .then(function (response) {$scope.plates = response.data;}); 
}); 
</script> 

</body> 
</html> 

Wie ich schon sagte die Online-Arbeiten mit anderer API läuft .... Minen nicht es sich etwas, das mit ihm vor Ort zu tun hat? Auch wenn ich wie gesagt die oben genannte Adresse an die .... API/Platten-API in einem Browser ausführen kann kein Problem und bekomme den JSON ausgespuckt.

Irgendwelche Kenntnisse würden geschätzt werden

Danke.

+1

Was sagt Ihr Netzwerk-Tab in Chrome? Es ist wahrscheinlich ein Cross-Domain-Problem. –

+0

Haben Sie eine Fehlermeldung, wenn Sie den Fehlerrückruf des Versprechens verwenden? '' 'app.controller ('platesCtrl', function ($ Umfang, $ http) { $ http .get ("http://192.168.239.130:1337/api/plates") .then ( Funktion (Antwort) { $ scope.plates = response.data; }, Funktion (Fehler) { console.log ('Response-Fehler:' Fehler); }, ); }); '' ' – Anthony

+0

Also habe ich total vermisst, was die Konsole sagte. 'Zugriffssteuerung-Zulassen-Ursprung' fehlt. – HardLuckHank

Antwort

0

In Ordnung, ich werde das selbst beantworten. Dachte aus den Kommentaren von einigen anderen Benutzern. Ich überprüfte die Konsole und erhielt einen Fehler, der besagt, dass ich ein domänenübergreifendes Problem habe und "Zugriffssteuerung-Zulassen-Ursprung" fehlt. Ich war in der Lage zu beheben in meine API-Aufruf-Funktionen gehen und fügen Sie zu jedem API-Aufruf

. Für den Moment funktioniert das, obwohl ich mir sicher bin, dass es eine elegantere Möglichkeit gibt, dasselbe zu implementieren.

Danke für die Hilfe.