Javascript AJAX библиотека, поддерживающая глобальные события

0

Какую библиотеку ajax следует использовать для моего приложения React/Flux? Мне нужно глобально обрабатывать ошибки (например, автоматически выходить из системы и перенаправлять на логин, если 401, аналогично службе $ http в Angular), и я хотел бы использовать обещания.

Теги:
events
request

1 ответ

1

То, как я сейчас это делаю, представляет собой комбинацию из трех библиотек:

  1. Reflux.js
  2. певчая птица
  3. JQuery

webutils.js

var Promise = require('bluebird');

module.exports = {
  makeApiCall: function() {
    return Promise.resolve($.get("http://makeyourapicall"));
  }
};

actions.js:

var Reflux = require('reflux');
var WebUtils = require('web-utils.js');

var Actions = Reflux.createActions({
  getDataFromServer: { asyncResult: true } 
});

Actions.getDataFromServer.listenAndPromise(WebUtils.makeApiCall);

module.exports = Actions;

Объяснение:

  • asyncResult: true в вызове createActions создает "вложенное/асинхронное действие", которое вы можете прослушивать. Подробнее здесь
  • Функция listenAndPromise перехватывает обещание до вложенных completed и failed обратных вызовов на основе результата

Вы можете использовать вложенные действия следующим образом:

Actions.getDataFromServer.complete.listen(res => console.log('success', res));

Actions.getDataFromServer.failed.listen(err => console.log('failed', err));

В этом смысле мы можем реализовать универсальный обработчик ошибок, подключая все события .failed.

рефлюкс-ошибка-handler.js

var _ = require('lodash');
var Reflux = require('reflux');
var NotificationStore = require('../stores/NotificationStore');

/**
 * Overall error handler for async actions
 * @param err
 */
function handleError(err) {
  console.error('Encountered error:', err);
  NotificationStore.createErrorNotification(err);
}

/**
 * Loops over refluxActions and attaches an error handler to all async actions
 * @param refluxActions {Object} hash of the reflux actions ot generate
 * @constructor
 */
var RefluxErrorHandler = function(refluxActions) {
  _.forEach(refluxActions, func => {
    if(func.failed) {
      func.failed.listen(handleError);
    }
  });
  return refluxActions;
};

module.exports.wrapRefluxActions = RefluxErrorHandler;

Чтобы использовать его в actions.js:

var Reflux = require('reflux');
var WebUtils = require('web-utils.js');
var RefluxErrorHandler = require('reflux-error-handler.js');

var Actions = Reflux.createActions({
  getDataFromServer: { asyncResult: true } 
});

Actions.getDataFromServer.listenAndPromise(WebUtils.makeApiCall);

module.exports = RefluxErrorHandler(Actions);

Ещё вопросы

Сообщество Overcoder
Наверх
Меню