programing

병렬 요구와 체인 요구를 $http와 조합한 각도입니다.() 및 $q.all()을 지정합니다.

randomtip 2023. 3. 12. 21:21
반응형

병렬 요구와 체인 요구를 $http와 조합한 각도입니다.() 및 $q.all()을 지정합니다.

API 호출이 좀 복잡해서 최대한 우아하고 퍼포먼스 있게 하려고 합니다.Promise api를 사용하는 방법은 이해했습니다.$httpservice-to-chain 요구 및 사용 방법$q병렬로 요청하기 위한 서비스입니다.그러나 이 특정 API 워크플로우를 위해서는 둘 다 수행해야 합니다.

다음으로 개략적인 API 흐름의 예를 제시하겠습니다.

  • /dog/<dog_id>
    • /breed/<breed_id>
      • /food/<food_id>
  • /cat/<cat_id>
  • /turkey/<turkey_id>
  • /fish/<fish_id>

요청의 첫 번째 계층은 모두 알려진 ID를 가집니다.하지만, 그<breed_id>를 만들기 위해 필요한/breed에서 콜을 해석해야 합니다./dog응답 및<food_id>를 만들기 위해 필요한/food에서 콜을 해석해야 합니다./breed대답.그렇게/dog,/breed,그리고./food모두 쇠사슬에 묶어야 해하지만/cat,/turkey,그리고./fish전체와 병렬로 만들 수 있다/dog쇠사슬을 채우다

현재 받은 요청은 두 가지입니다(그리고 정상적으로 동작하고 있습니다.어떻게 하면 이 흐름을 개선할 수 있을까요?2개의 스택을 조합하여 하나의 약속으로 이행할 수 있는 방법이 있습니까?.then()?

var dogId = '472053',
    catId = '840385',
    turkeyId = '240987',
    fishId = '510412';

var myData = {};

var firstSetComplete = false,
    secondSetComplete = false,
    returnData = function() {
        if (firstSetComplete && secondSetComplete) {
            console.log("myData.dog", myData.dog);
            console.log("myData.dog.breed", myData.dog.breed);
            console.log("myData.dog.food", myData.dog.food);
            console.log("myData.cat", myData.cat);
            console.log("myData.turkey", myData.turkey);
            console.log("myData.fish", myData.fish);
        }
    };

// first call set
$http.get('http://example.com/dog/' + dogId)
.then(function(response) {
    myData.dog = response.data;
    return $http.get('http://example.com/breed/' + response.data.breed_id);
})
.then(function(response) {
    myData.dog.breed = response.data;
    return $http.get('http://example.com/food/' + response.data.food_id);
})
.then(function(response) {
    myData.dog.food = response.data;

    firstSetComplete = true;
    returnData();
});

// second call set
$q.all([
    $http.get('http://example.com/cat/' + catId),
    $http.get('http://example.com/turkey/' + turkeyId),
    $http.get('http://example.com/fish/' + fishId)
])
.then(function(responses) {
    myData.cat = responses[0].data;
    myData.turkey = responses[1].data;
    myData.fish = responses[2].data;

    secondSetComplete = true;
    returnData();
});

다음과 같이 첫 번째 체인을 통과할 수 있습니다.

$q.all([
    $http.get('http://example.com/cat/' + catId),
    $http.get('http://example.com/turkey/' + turkeyId),
    $http.get('http://example.com/fish/' + fishId),
    $http.get('http://example.com/dog/' + dogId)
    .then(function(response) {
         myData.dog = response.data;
         return $http.get('http://example.com/breed/' + response.data.breed_id);
     })
     .then(function(response) {
         myData.dog.breed = response.data;
         return $http.get('http://example.com/food/' + response.data.food_id);
     })
     .then(function(response) {
         myData.dog.food = response.data;
         return myData;
     })
])
.then(function(responses) {
    myData.cat = responses[0].data;
    myData.turkey = responses[1].data;
    myData.fish = responses[2].data;

    secondSetComplete = true;
    returnData();
});

개에 대한 그 큰 약속 사슬은 결국 마지막 약속에 의해 해결되는 하나의 약속으로 끝나게 된다.then호출되어 최종 함수의 결과로 해결됩니다.그래서 당신이 그것을 당신의 집에 넣지 못할 이유는 없다.$q.all()불러.

언급URL : https://stackoverflow.com/questions/20252640/angular-combining-parallel-and-chained-requests-with-http-then-and-q-all

반응형