• Приемлимо ли связывать два фронтенд микросервиса через шину сообщений со своим api сообщений?

    wapster92
    @wapster92 Куратор тега JavaScript
    Я делал нечто подобное, сервис вебсокетов ловил сообщения от ORM. При изменении БД отдавал сообщения на фронт. Если фронт подписан на изменения сущности, то при событии от сокетов обращался к API бэкенда за получением данных условно. И это вполне нормально живет.
    Ответ написан
    Комментировать
  • В каких случаях имеет смысл показывать модальное окно по ссылке?

    werty1001
    @werty1001
    undefined
    Если пользователь может поделиться ссылкой, то разумно пихать данные в роут, модалка, панелька, фильтры, не важно. Захочет юзер поделиться ссылкой на окно авторизации? Сомневаюсь. А вот отправить жене ссылку на новый шкаф, который он собрал в модалке-конструкторе скорее всего захочет.
    Ответ написан
    1 комментарий
  • Как правильно использовать интерцепторы в axios?

    owl1n
    @owl1n
    fullstack developer
    Покажу немного практик, как интерцепторы упрощают жизнь мне, да и многим, в целом.
    Здесь и далее покажу именно использование интерцепторов при работе с авторизацией по JWT (токены).

    1) Подстановка хедера авторизации

    const createSetAuthInterceptor = options => config => {
      if (options.access) {
        config.headers.Authorization = options.access;
      } else {
        delete config.headers.Authorization;
      }
      return config;
    };
    
    const setAuthCb = createSetAuthInterceptor(store.state.auth);
    axios.interceptors.request.use(setAuthCb);


    Здесь мы проверям наличие доступа из стора, а точнее, наличие токена. Далее, подставляем, либо удаляем заголовок.

    2) Следующая практика, это обновление токена (то, о чем вы спросили в комментарии, при окончании сессии и т.д.)

    let refreshTokenPromise;
    
    const createUpdateAuthInterceptor = (store, http) => async error => {
      const message = get(error, 'response.data.message');
      if (!['Token expired', 'Invalid token'].includes(message)) {
        return Promise.reject(error);
      }
    
      if (!refreshTokenPromise) {
        refreshTokenPromise = store.dispatch('refreshToken');
      }
    
      await refreshTokenPromise;
      refreshTokenPromise = null;
    
      return http(error.config);
    };
    
    const updateAuthCb = createUpdateAuthInterceptor(store, axios);
    axios.interceptors.response.use(null, updateAuthCb);


    Здесь мы можем видеть, что при каждом ответе проверяем наличие ошибок и если ошибка соответствует ошибке с токеном, то отправляем обновлять токен и далее снова отправляем тот же самый запрос, который к нам вернулся с ошибкой. Тут грамотно будет проверять не само сообщение об ошибке, а код ответа (401 и т.д.), но тут используется такое решение уже из за специфики бэка.

    В этом же решение, вместо обновления токена, можно отправлять юзера авторизовываться самому, на страницу авторизации. Для этого, конечно же, стоит передавать не экземпляр store, а экземляр роутера, чтобы редиректить юзера. Надеюсь, помог и хоть как то наглядно показал способы применения :)
    Ответ написан
    1 комментарий
  • Как в react можно добавлять классы на элементы?

    @Che603000
    c 2011 javascript
    Обычно используют https://www.npmjs.com/package/classnames

    В Вашем случае:
    const classNames = require('classnames');
    
    const box = props => {
    
      const inputClass = classNames('deff', {
            metal:  props.name,
            energ: !props.name
       });
    
       return  <input className={inputClass} />;
    }
    Ответ написан
    Комментировать
  • Почему при выборе select не появляется блок?

    @Fransic
    laravel, vue, vuex, react, angular 2+, express, no
    Нужно объявить const id. После проверить console.log(id) находит ли правильно id
    $(''#affiliation').on('change', function (e) {
        const optionSelected = $("option:selected", this);
        const id = this.value;
        ....
    });
    Ответ написан
    5 комментариев