Ajax 콜백이있는 자바 스크립트 모듈 패턴

Question

mongo 데이터베이스에서 데이터를 가져와야하는 여러 카테고리가있는 웹 사이트를 작성했습니다. 지금까지 나는 계획 아약스 호출을 작성했지만,이 요구 사항은 내가 재사용 가능한 코드/패턴에 대해 생각하기 시작한 다양한 아약스 호출을 계속 사용해야하기 때문에 필요합니다. 나는 Javascript 모듈 패턴에 초보자이지만, 지금까지 내가 읽었고 이해 한 것은, 모듈 형 패턴을 드러내는 것이 객체 지향적 인 나머지 것들과 너무 많이 혼동하기보다는 좋은 시작일 것 같다.

SOF 및 인터넷에서 사용할 수있는 많은 링크, 문서가 있지만 실제로 이해할 수있는 다음 단계로 넘어갈 수 있도록 내 간단한 요구 사항에 대한 직접 응답을 얻을 수 없습니다. GetData의 데이터베이스 및 getOffers에서 레코드를 당길 개인 유지

var myApp = new function() { 

    var Var1 = []; 

    getData = function (sendData) { 

     return $.ajax({ 
      type: "POST", 
      url: URL, 
      data: sendData, 
      datatype: "json", 
      success: function (results) {} 
     }); 

    }; 

    getOffers = function (sendData) { 
     getData(sendData); 
    }; 

    return { 
     getOffers: getOffers 
    }; 

}(); 

내가 여기 테스트 코드를 작성했습니다

는 ... 내가 이해 외부에서 호출 public입니다. 그러나, 나는 어떻게 그들의 바깥에서 나의 아약스 전화의 성공 반환을 얻습니까?

내가 뭘 달성하고자 아래처럼 내 함수를 호출 할 수있는 쉬운 방법이있다 ... 난 내 요구 사항에 기반을 변경할 수 있도록 내 MongoDB의 데이터를 가져 오는

myApp.getOffers({ 
    'showData': 1, 
    'myLocation': "Location1", 
    'clientID': "Client1" 
}); 

myApp.getOffers({ 
    'showData': 1, 
    'myLocation': "Location2", 
    'clientID': "Client2" 
}); 

. 각각의 값을 반환 할 때, 나는 diff Div에 그것들을 보여주기 위해 조작 할 것입니다. 그래서 액션은 정적이 아니기 때문에 제 정의의 바깥에 있어야합니다.

함수에서 직접 리턴 할 때 작동하기 때문에 어떻게해야합니까?하지만 아약스에서 리턴해야 할 때 콜백 때문에 작성하지 않아도됩니다. 그러나 이것이 코드를 재사용하고 다양한 분야를 가장 간단한 접근 방식으로 보낼 수 있도록하기 위해 일반적으로 어떻게 쓰여졌습니까?

이 코드를 변경하면 더 잘 이해할 수 있으며 내 요구 사항에 맞는 매우 기본적인 것으로 시작하십시오. 또는 내 기본을 실제로 설명하는 몇 개의 링크를 보내주십시오.

또한 "나는"GET 메서드를 사용할 때 사용자가 (소스 코드에서) 어떤 변수를 전달 하는지를 아는 사용자가 직접 myApp를 보낼 수 있다고 생각하기 때문에 myApp에 대한 ajax "POST"메서드를 사용합니다. action.php? variable = 1 & 변수 = 2. GET 메서드를 안전하게 사용할 수 있다면 어떻게 피할 수 있습니까?

Answer 1

하지만 어떻게해야 성공적으로 내 아약스 호출을받을 수 있습니까?

만들기는 getData 반환 아래처럼 jqXHR을 반환 getOffers - 당신은 Ajax 요청에 대한 성공 응답을 얻을 때 - -

가

var myApp = (function() { 

    var Var1 = []; 

    var getData = function (sendData) { 

     return $.ajax({ 
      type: "POST", 
      url: URL, 
      data: sendData, 
      datatype: "json", 
      success: function (results) {} 
     }); 

    }; 

    var getOffers = function (sendData) { 
     // return the jqXHR returned by getData 
     return getData(sendData); 
    }; 

    return { 
     getOffers: getOffers 
    }; 

})(); 

$.ajax({})에 의해 반환되는 jqXHR 객체가 Promise 당신이 성공을 첨부 할 수 있습니다 이런 식의 처리기 - 아약스 요청이 아님

myApp.getOffers({ 
    'showData': 1, 
    'myLocation': "Location1", 
    'clientID': "Client1" 
}).done(function (data, textStatus, jqXHR) { 

    // work with DOM here 
}); 

기타 정보

또한이 선언시 앞에 var 누락으로 getData, getOffers 세계를 만들어 - 쿼리 Deferreds은/here 약속.대신 GET의 POST 사용에 대한 귀하의 의견으로 당

은, 엄지 손가락의 일반적인 규칙은 - GET의 데이터 검색을위한, POST 저장을위한 - 당신이 POST를 사용해서 그 어떤 하나의 데이터를 도청 할 수없는 것을 의미하지 않는다 요청 URL 대신 요청 본문의 일부일뿐입니다. 보내는 데이터가 실제로 민감하다고 생각되면 앱에 SSL(HTTPS)을 사용하도록 설정해야합니다.