2014-07-13 2 views
3

Ember.js 앱과 Express REST API의 두 가지 프로젝트로 나눠야합니다. 저는 이런 것들이 이런 식으로 깨끗하다고 ​​가정했습니다.Ember.js + Express의 개발 환경 설정 방법

그때까지 Express 애플리케이션은 모두 REST 엔드 포인트와 index.htmlapp.js과 같은 모든 정적 파일을 제공합니다. 하지만 이제 ember-cli가 정적 파일을 제공하고 Express 응용 프로그램이 authentication + REST를 처리합니다.

마지막 문제는 두 개의 다른 포트가 있다는 것입니다. ember-cli는 http://localhost:4200을 사용하고 익스프레스는 http://localhost:3333을 사용합니다. 인증시 익스프레스에서 세션 쿠키를 가져 오면 동일한 원본 정책으로 인해 후속 요청에서 결코 보내지지 않습니다 (How do I send an AJAX request on a different port with jQuery? 참조). 내가 제대로 이해한다면

지금 나는 두 가지 해결책이 있습니다

  1. 설정 Express는 JSONP를 지원하고 엠버 로컬 Nginx에 나 아파치와 설정을 설치 너무 프록시 패스를
  2. 그것을 사용하고 있는지 확인하기를

첫 번째 해결책은 배포 후 두 응용 프로그램이 동일한 도메인/포트를 사용하기 때문에 ok가 아닙니다. 두 번째 해결책은 아마 작동 할 것입니다. 그러나 개발자에게 앱을 단순히 실행하기 위해 로컬 웹 서버를 설치하도록 요청하는 것은 약간 웃기는 것 같습니다.

많은 분들이 이전에이 문제를 겪었을 것입니다. 개발을 쉽게하기 위해 당신은 무엇을 제안하겠습니까?

감사합니다.

답변

5

흠. 지침에 따라

이 발견 : 당신은 또한 익스프레스 응용 프로그램에 다음과 같은 헤더를 추가해야합니다 http://discuss.emberjs.com/t/ember-data-and-cors/3690/2

export default DS.RESTAdapter.extend({ 
    host: 'http://localhost:3333', 
    namespace: 'api', 
    ajax: function(url, method, hash) { 
     hash = hash || {}; // hash may be undefined 
     hash.crossDomain = true; 
     hash.xhrFields = { withCredentials: true }; 
     return this._super(url, method, hash); 
    }) 
}); 

: 그것 뿐이다

// Add support for cross-origin resource sharing (localhost only) 
app.all('*', function(req, res, next) { 
    if (app.get('env') === 'development') { 
     res.header('Access-Control-Allow-Origin', 'http://localhost:4200'); 
     res.header('Access-Control-Allow-Headers', 'X-Requested-With, Content-Type'); 
     res.header('Access-Control-Allow-Credentials', 'true'); 
     res.header('Access-Control-Allow-Methods', 'GET, POST, PUT, DELETE'); 
    } 
    next(); 
}); 

내가 다른 해결책을 찾을 것 같다! 마지막 단계는 Ember가 dev 환경에서만 CORS을 사용하는지 확인하는 것입니다.

UPDATE

엠버 - CLI는 이제 위의 모든 쓸모하게 통합 proxy feature 있습니다.

"--proxy 플래그를 사용하여 주어진 주소로 모든 Ajax 요청을 프록시하십시오. 예를 들어 ember server --proxy http://127.0.0.1:8080은 모든 응용 프로그램 XHR을 포트 8080에서 실행중인 서버로 프록시합니다."

+0

놀라운, 감사합니다. 나는 Ember와 Sails가 협력 할 수있게하려고 노력 해왔다. 그리고 이것은 나를 일으키고 달렸다. – paulruescher

+0

당신을 환영한다! 참고로 PUT 요청을 실행하자마자'res.header ('Access-Control-Allow-Methods', 'GET, POST, PUT, DELETE');를 서버에 추가해야했습니다. – Pedro

+0

Ember 프록시 구성에 대한 최고 정보, 건배 야! – JellyFishBoy