How to handle an authorization token

Question

I would like to add an authentication token to the header of the http request every time an HTTP request is sent, and if authorization fails, I want to redirect the user to login. Should I decorate the Http driver or is there a better way to do this?

I came up with a solution that adorns the http driver. But I'm not sure if this is the right way to do this. Here is the code that I have written so far:

import Rx from 'rx';
import {makeHTTPDriver} from '@cycle/http';

function makeSecureHTTPDriver({eager = false} = {eager: false}) {

    return function secureHTTPDriver(request$) {
        const httpDriver = makeHTTPDriver(eager);

        const securedRequest$ = request$
            .map(request => {
                const token = localStorage.getItem('token');

                if (token) {
                    request.headers = request.headers || {};
                    request.headers['X-AUTH-TOKEN'] = token;
                }

                return request;
            });

        const response$ = httpDriver(securedRequest$);
        //todo: check response and if it fails, redirect to the login page

        return response$;
    }
}

export default makeSecureHTTPDriver;

Run codeHide result

Here is the code how I use makeSecureHttpDriver

const drivers = {
        DOM: makeDOMDriver('#app'),
        HTTP: makeSecureHttpDriver()
    };

Run codeHide result

Answer 1

It’s a little late, I don’t very often so much. Instead, I suggest using other drivers so as not to put logic in your drivers.

import storageDriver from '@cycle/storage'
import {makeHTTPDriver} from '@cycle/http'

function main(sources) {
 const {storage, HTTP} = sources
 const token$ = storage.local.getItem('token')
  .startWith(null)

 const request$ = createRequest$(sources)

 const secureRequest$ = request$.withLatestFrom(token$, 
   (request, token) => token ? 
     Object.assign(request, {headers: {'X-AUTH-HEADER' : token }) : 
     request
 )
 return {HTTP: secureRequest$, ...}
}

Cycle.run(main, {
 ...
 storage: storageDriver,
 HTTP: makeHTTPDriver()
})

Answer 2

, , HTTP- , , , , .

, , HTTP driver , , , , :

const drivers = {
    DOM: makeDOMDriver('#app'),
    HTTP: makeSecureHttpDriver({secure:true})
};

, , . HTTP , , gitter: )