source

AngularJS 글로벌http 폴링 서비스

factcode 2023. 3. 20. 23:38
반응형

AngularJS 글로벌http 폴링 서비스

저는 AngularJS를 사용하여 웹 앱을 만들고 있습니다.앱은 JSON 데이터를 반환하는 URL을 폴링하여 해당 데이터를 앱의 모든 부분에서 사용할 수 있도록 해야 합니다.지금까지 읽은 바로는 폴링을 처리하고 JSON 데이터의 내부 캐시를 유지하는 서비스를 만든 후 해당 데이터를 참조하고자 하는 앱의 모든 부분에 서비스를 주입하는 것이 최선의 방법입니다.내가 어떻게 해야 할지 모르겠다.가장 가까운 예는 이 질문입니다만, 특정의 컨트롤러에 의해서 수동으로 호출되는 서비스(그 자체가 특정의 루트에 관련지어져 있는 것)를 작성하는 것 같습니다만, 앱의 어느 부분이 액티브한지 불문하고, 앱의 백그라운드에서 영속적으로 실행되는 것을 원합니다.이것이 가능한 일일까요, 아니면 제가 완전히 잘못된 접근 방식을 취하고 있는 것일까요?

솔루션:

app.factory('Poller', function($http, $timeout) {
  var data = { response: {}, calls: 0 };
  var poller = function() {
    $http.get('data.json').then(function(r) {
      data.response = r.data;
      data.calls++;
      $timeout(poller, 1000);
    });      
  };
  poller();

  return {
    data: data
  };
});

(폴링이 이루어졌음을 나타내기 위해서만)

http://plnkr.co/edit/iMmhXTYweN4IrRrrpvMq?p=preview

편집: Josh David Miller가 코멘트에서 제안했듯이 처음부터 폴링이 이루어지도록 app.run block에 이 서비스에 대한 의존성을 추가해야 합니다.

app.run(function(Poller) {});

또한 이전 콜이 종료된 후 다음 폴링 일정도 이동했습니다.따라서 폴링이 장시간 정지했을 경우에 대비하여 콜의 '스택'은 발생하지 않습니다.

갱신된 plunker.

이것은 컨트롤러에 쉽게 주입할 수 있는 Github의 앵글 폴러 서비스입니다.

설치하는 방법:bower install angular-poller.

백그라운드에서 영속적으로 실행되는 글로벌 폴링 서비스를 시작하는 경우 다음 작업을 수행할 수 있습니다.

// Inject angular poller service.
var myModule = angular.module('myApp', ['poller']);

// The home/init controller when you start the app.
myModule.controller('myController', function($scope, $resource, poller) {

    // Define your resource object.
    var myResource = $resource(url[, paramDefaults]);

    // Create and start poller.
    var myPoller = poller.get(myResource);

    // Update view. Most likely you only need to define notifyCallback.
    myPoller.promise.then(successCallback, errorCallback, notifyCallback);
});

이제 사용자가 호출할 때까지 백그라운드에서 계속 실행됩니다.myPoller.stop()또는poller.stopAll().

다른 컨트롤러에서 이 폴러의 콜백 데이터를 사용하는 경우는, 다음의 조작을 실시합니다.

myModule.controller('anotherController', function($scope, $resource, poller) {

    /* 
     * You can also move this to a $resource factory and inject it
     * into the controller so you do not have to define it twice.
     */
    var sameResource = $resource(url[, paramDefaults]);

    /* 
     * This will not create a new poller for the same resource
     * since it already exists, but will simply restarts it.
     */
    var samePoller = poller.get(sameResource);

    samePoller.promise.then(successCallback, errorCallback, notifyCallback);
});

@ValentynShybanov의 공장 코드를 포크하고 인터벌 콜(매초, 5초마다 등)을 추가했습니다.또, 필요에 따라서 폴러를 정지 및 기동할 수도 있습니다.

http://plnkr.co/edit/EfsttAc4BtWSUiAU2lWf?p=preview

app.factory('Poller', function($http, $timeout) {
  var pollerData = {
    response: {},
    calls: 0,
    stop: false
  };

  var isChannelLive = function() {
    $http.get('data.json').then(function(r) {
      if (pollerData.calls > 30 && pollerData.stop === false) { // call every minute after the first ~30 secs
        var d = new Date();
        console.log('> 30: ' + d.toLocaleString() + ' - count: ' + pollerData.calls);
        pollerData.calls++;
        $timeout(isChannelLive, 10000);
      } else if (pollerData.calls > 15 && pollerData.calls <= 30 && pollerData.stop === false) { // after the first ~15 secs, then call every 5 secs
        var d = new Date();
        console.log('> 15 & <= 30: ' + d.toLocaleString() + ' - count: ' + pollerData.calls);
        pollerData.calls++;
        $timeout(isChannelLive, 5000);
      } else if (pollerData.calls <= 15 && pollerData.stop === false) { // call every 1 second during the first ~15 seconds
        var d = new Date();
        console.log('<= 15: ' + d.toLocaleString() + ' - count: ' + pollerData.calls);
        pollerData.calls++;
        $timeout(isChannelLive, 1000);
      }

      pollerData.response = r.data;
    });

  };
  var init = function() {
    if (pollerData.calls === 0) {
      pollerData.stop = false;
      isChannelLive();
    }
  };
  var stop = function() {
    pollerData.calls = 0;
    pollerData.stop = true;
  };

  return {
    pollerData: pollerData, // this should be private
    init: init,
    stop: stop
  };
});

언급URL : https://stackoverflow.com/questions/14944936/angularjs-global-http-polling-service

반응형