2016-07-11 3 views
0

좋아요, 가능한 한 간단하게 설명하겠습니다. Postman에서 그들을 테스트 할 수 있고 Chrome에서 바로 찾을 수 있기 때문에 Node, Express 및 mySQL 서버에서 일반적인 get, post, put, delete와 함께 RESTful API를 실행한다. 이것은 현재 내 컴퓨터에서 모두 로컬로 실행됩니다. 나는 REST API를 실행하는 우분투 상자가 있습니다. 크롬에서 쿼리 할 때 나는 작업 할 필드의 예상 출력을 얻습니다.RESTful API가 간단한 AngularJS 컨트롤러로 표시되지 않습니다.

(예제 요청 "http://192.168.239.130:1337/api/plates/")이 사실을 알려줍니다.

{ 
"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" 
    } 
    ] 
} 

이는 화면에 인쇄되는 샘플 mySQL 데이터의 일부입니다. 나는 희망대로 일하고있다. 내 문제는 각도 스크립트를 사용하여 간단한 HTML 페이지를 만들어 인쇄하려고 시도 할 때입니다. 내가 얻는 것은 빈 페이지뿐입니다. 다른 API와 온라인으로 코드를 실행 해 보았습니다. 아래에 게시 할 동일한 코드로 인쇄하는 데 아무런 문제가 없습니다.

<!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> 

나는이 다른 API 온라인 작품 .... 내 그것은 그것과 관련이있다 뭔가 그것을하지 않습니다 실행하면 로컬에 말했듯이? 위의 주소를 .... .... api/plates API를 브라우저에서 아무런 문제없이 실행할 수 있고 JSON이 침을 뱉을 수 있다고 말한 것입니다.

모든 지식은

감사를 감상 할 수있다.

+1

Chrome의 네트워크 탭은 무엇이라고 말합니까? 아마도 도메인 간 문제 일 것입니다. –

+0

약속의 오류 콜백을 사용하면 오류 메시지가 나타 납니까? '''app.controller ('platesCtrl', 기능 ($ 범위, $ HTTP) { $ HTTP 갔지 ("http://192.168.239.130:1337/api/plates") 그 때는 ( 함수 (대응) {$ scope.plates = response.data; } 함수 (에러) { CONSOLE.LOG ('응답 오류'에러) } ) })' ' – Anthony

+0

그래서 나는 콘솔이 말한 것을 완전히 놓쳤다. '액세스 제어 - 원점 허용'이 누락되었습니다. – HardLuckHank

답변

0

좋아, 직접 대답하겠습니다. 다른 몇몇 사용자의 의견에서 생각해보십시오. 콘솔을 검사하고 크로스 도메인 문제가 있고 '액세스 제어 허용 원점'이 누락되었다는 오류가 표시되었습니다. 내 API 호출 함수로 들어가고 모든 API 호출에

res.header("Access-Control-Allow-Origin", "*"); 

을 추가하는 문제를 해결할 수있었습니다. 지금 당장은 똑같은 것을 구현하는보다 우아한 방법이 있다고 확신하지만 작동합니다.

도움 주셔서 감사합니다.

관련 문제