2012-12-02 3 views
2

실제 웹 서버를 전혀 보지 못하고 AJAX를 통해 Yelp API와 상호 작용하는 로컬 프로젝트에 백본을 사용하려고합니다. Yelp API는 oauth를 사용하여 인증해야하며 sample code에 나 자신 만의 코드를 모델링했습니다. 샘플 코드를 사용할 때 Cross-Origin이나 다른 어떤 문제도 발생하지 않습니다. 그러나 브라우저 보안 옵션을 해제하면 오류에 대해 400 응답 만받습니다.Oauth 용 백본 덮어 쓰기 collection.sync

fetch: function(options) { 
    var accessor, message, parameterMap, parameters; 
    if (!options) { 
    options = {}; 
    } 
    accessor = { 
    consumerSecret: LOAF.auth.conserumerSecret, 
    tokenSecret: LOAF.auth.accessTokenSecret 
    }; 
    parameters = []; 
    parameters.push(['oauth_consumer_key', LOAF.auth.consumerKey]); 
    parameters.push(['oauth_consumer_secret', LOAF.auth.consumerSecret]); 
    parameters.push(['oauth_token', LOAF.auth.accessToken]); 
    parameters.push(['oauth_signature_method', 'HMAC-SHA1']); 
    parameters.push(['location', "New York City"]); 
    message = { 
    'action': this.url, 
    'method': 'GET', 
    'parameters': parameters 
    }; 
    OAuth.setTimestampAndNonce(message); 
    OAuth.SignatureMethod.sign(message, accessor); 
    parameterMap = OAuth.getParameterMap(message.parameters); 
    parameterMap.oauth_signature = OAuth.percentEncode(parameterMap.oauth_signature); 
    options.url = this.url; 
    options.data = parameterMap; 
    options.cache = true; 
    options.dataType = 'json'; 
    options.success = this.onResponse; 
    console.log("Attempting"); 
    console.log(options); 
    return Backbone.Model.prototype.fetch.apply(this, options); 
}, 

을하지만, 이것은 400 응답을 생성

I는 다음과 같은 메소드를 가져 덮어 시도했다. 백본이 나를 위해 대부분을 수행하고 내가 설정하고있는 옵션 중 일부를 덮어 쓸 가능성이 있기 때문에 AJAX 호출을 제대로 작성하지 않기 때문에 기분이 좋다. 내가해야 할 일은 OAuth를 처리하고 응답을 직접 파싱하는 대신이 컬렉션의 "동기화"메서드를 덮어 쓰는 것입니다. 이 작업을 수행하는 더 좋은 방법이 있습니까?

답변

1

이것이 올바른 방법인지 잘 모르겠지만이 방법으로 작동하므로 여기 내 해결책이 있습니다. 나는 fetch를 오버라이드하고 결코 디폴트 fetch 메소드를 호출하지 않는다. 대신 fetch 메서드에서 ajax 호출을 만들고 응답을 처리하는 onResponse 메서드를 사용하여 응답에 대한 모델 (Yelp Businesses)을 만듭니다. 희망이 동일한 위치에있는 사람을 도와줍니다.

LOAF.YelpList = Backbone.Collection.extend({ 
    model: LOAF.Business, 
    url: 'http://api.yelp.com/v2/search?', 
    fetch: function(options) { 
    var accessor, message, parameterMap, parameters; 
    if (!options) { 
     options = {}; 
    } 
    accessor = { 
     consumerSecret: LOAF.auth.consumerSecret, 
     tokenSecret: LOAF.auth.accessTokenSecret 
    }; 
    parameters = []; 
    parameters.push(['callback', 'cb']); 
    parameters.push(['oauth_consumer_key', LOAF.auth.consumerKey]); 
    parameters.push(['oauth_consumer_secret', LOAF.auth.consumerSecret]); 
    parameters.push(['oauth_token', LOAF.auth.accessToken]); 
    parameters.push(['oauth_signature_method', 'HMAC-SHA1']); 
    parameters.push(['location', "New York City"]); 
    message = { 
     'action': this.url, 
     'method': 'GET', 
     'parameters': parameters 
    }; 
    OAuth.setTimestampAndNonce(message); 
    OAuth.SignatureMethod.sign(message, accessor); 
    parameterMap = OAuth.getParameterMap(message.parameters); 
    parameterMap.oauth_signature = OAuth.percentEncode(parameterMap.oauth_signature); 
    options.url = this.url; 
    options.data = parameterMap; 
    options.cache = true; 
    options.dataType = 'jsonp'; 
    options.jsonpCallback = 'cb'; 
    options.success = this._onResponse; 
    options.context = this; 
    return $.ajax(options); 
    }, 
    _onResponse: function(data, textStats, xhr) { 
    debugger; 
    var _this = this; 
    return _.each(data.businesses, function(business) { 
     var busModel; 
     if (!_this.get(business.id)) { 
     busModel = new LOAF.Business(business); 
     return _this.add(busModel); 
     } 
    }); 
    } 
}); 

두 가지 참고 사항 :

  1. 초기 코드 일 것이다 그러나 consumerSecret 부적절한 OAuth를 호출의 결과, 잘못된 철자했다. 그것이 내가 400 오류를 얻은 이유입니다.
  2. 이것을 고치더라도 Cross-Origin 호출에 문제가 있습니다. 내가 사용했던 AJAX 방법으로 전환하면이 문제가 완화됩니다. 그러나 백본에 이보다 더 고유 한 문제를 해결할 수있는 방법이있을 수 있습니다. 내 프로젝트의 일정 기간 동안, 이것은하지 않을 것입니다.