Angularjs 多個 HTTP POST 請求導致 net::ERR_INSUFFICIENT_RESOURCES

Question

在我的應用程序中，我正在獲取用戶以 textarea 字段形式提供的主機列表，並使用 HTTP POST to API 將它們插入到我的數據庫中。

一切正常，直到當我收到net::ERR_INSUFFICIENT_RESOURCES錯誤時列表超過 2.5k 主機。 我讀到它與某些 Chrome 限制有關。

我怎樣才能克服這個限制？ 我試圖將列表拆分為束並在它們之間引入一些延遲，但它不起作用（似乎所有束都是在同一時間異步啟動的）。

控制器：

AddHostsController.$inject = ['$scope', 'Authentication', 'App', 'Hosts', '$filter', '$timeout'];

function AddHostsController($scope, Authentication, App, Hosts, $filter, $timeout) {
    var vm = this;
    vm.submit = submit;
    ...some other staff...

    function submit() {
      var fulllist = [];
      vm.firstbunch = [];
      vm.secondbunch = [];
      fulllist = vm.host_list.split('\n');
      vm.firstbunch = fulllist.slice(0,1500);
      vm.secondbunch = fulllist.slice(1500,);

      $timeout(function() { vm.firstbunch.forEach(submitHost);}, 2000)
      .then(firstBunchSuccessFn, firstBunchErrorFn);

      function firstBunchSuccessFn(){
        vm.secondbunch.forEach(submitHost);
      }

      function firstBunchErrorFn(){
        console.log("Something went wrong!");
      }

      function submitHost(value, index, array){
        App.addhosts(...some args..., value).then(addHostsSuccessFn, addHostsErrorFn);

        function addHostsSuccessFn(response) {
        }

        function addHostsErrorFn(response) {
          console.error('Failure!');
        }
     }
}

服務：

.factory('App', App);

App.$inject = ['$http'];

function App($http) {
    var App = {
      addhosts: addhosts,
    };

    return App;

    function addhosts(...some other.., value) {

        return $http.post('/api/v1/hosts/', {
            ...some other...
            value: value
        });
    }

Answer 1

不是並行執行請求，而是將它們鏈接起來：

var configArr = [/* Array of config objects */];
var resultsArrPromise = configArr.reduce( reducerFn, $q.when([]) );

responseArrPromise
  .then(function (responseArr) {
    responseArr.forEach( response => console.log(response.data) );
}).catch(function (errorResponse) {
    console.log(errorResponse);
}); 

function reducerFn(acc, config) {
    var accArrPromise = acc.then(function(responseArr) {
        var httpPromise = $http(config);
        return $q.all( [...responseArr, httpPromise] );
    });
    return accArrPromise;
}

reducer 以一個空數組的承諾開始。 reducer 的每次迭代都將另一個 HTTP 承諾鏈接到響應數組。 結果是一個解析為一系列響應的承諾。 通過鏈接 HTTP 請求，它們按順序執行，而不是並行執行。