URL을 호출하고 결과 JSON을 그대로 렌더링하는 간단한 AngularJS 애플리케이션이 있습니다. 여기에 index.html을은 다음과 같습니다Play Framework 백엔드에서 AngularJS 렌더링 Raw JSON
<!doctype html>
<html ng-app>
<head>
<title>Hello AngularJS</title>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.8/angular.min.js"></script>
<script>
function Hello($scope, $http) {
$http.get('http://localhost:9000/status').
success(function(data) {
$scope.greeting = data;
});
}
</script>
</head>
<body>
<div ng-controller="Hello">
<pre>{{greeting | json}}</pre>
</div>
</body>
</html>
URL입니다 나는 브라우저에서와 같이, 내가 기대하는 JSON을 얻을 수 있지만 localhost를 호출 할 때 빈 페이지를 참조 호출 할 때 : 8080
I을 다음 완전히 다른 서버에서 다른 URL을 호출하려고 :
http://rest-service.guides.spring.io/greeting
그리고 이것은 예상대로 콘텐츠를 렌더링 :
{"id":1,"content":"Hello, World!"}
포트 9000에서 실행되는 백엔드 서버가 Play 프레임 워크에 의해 제공되는 동안 NGINX 서버 내부에서 index.html을 실행 중입니다. 다음은 NGINX 구성입니다.
server {
listen 8080;
server_name localhost;
root /Users/joesan/Projects/Sandbox/my-app;
#charset koi8-r;
access_log logs/host.access.log main;
location/{
# If you want to enable html5Mode(true) in your angularjs app for pretty URL
# then all request for your angularJS app will be through index.html
try_files $uri /index.html;
}
# /api will server your proxied API that is running on same machine different port
# or another machine. So you can protect your API endpoint not get hit by public directly
location /api {
proxy_pass http://localhost:9000;
proxy_http_version 1.1;
proxy_set_header Upgrade $http_upgrade;
proxy_set_header Connection 'upgrade';
proxy_set_header Host $host;
proxy_cache_bypass $http_upgrade;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
}
}
다음은 누군가 프로젝트 템플릿을 찾고있는 경우를위한 전체 설정입니다. https://github.com/joesan/nginx-mac-os-setup – sparkr