[S9L4] Middleware, Authentication

Question 1

Was ist Middleware?

Answer 1

“The redux middleware syntax is a mouthful: a middleware function is a function that returns a function that returns a function. The first function takes the store as a parameter, the second takes a next function as a parameter, and the third takes the action dispatched as a parameter. The store and action parameters are the current redux store and the action dispatched, respectively. The real magic is the next() function. The next() function is what you call to say ‘this middleware is done executing, pass this action to the next middleware’.”

Question 2

Wo befindet sich Middleware im Zustandsablauf einer Redux App?

Answer 2

• Nach der Action
• Fängt die Action ab und manipuliert diese
• Leitet dann verzögert die Action an den Reducer

Question 3

Wie schreibt man eine Middleware?

Answer 3

const customMiddleWare = store => next => action => {
console.group(action.type);
console.log(“Prev state: “, store.getState());
console.log(“Action: “, action);
next(action(;
console.log(“New State: “, store.getState());
console.groupEnd();

Question 4

Wie wird Authentication in React gehandled?

Answer 4

export default function() {
    const token = localStorage.getItem('userToken');

    return axios.create({
        headers: {
            'Content-Type': 'application/json',
            'Authorization': `${token}`,
        }
    });
};

Question 5

Ist Protected erforderlich um Authentication in React zu integrieren?

Answer 5

-Nein, die Function reicht aus

Question 6

Ist Protected erforderlich um Authentication in React zu integrieren?

Answer 6

• Nein, die Function reicht aus

- Protected ist extra

Question 7

Wie schreibt man eine MiddelWare, welche einen LoginToken in den LocalStorage schreibt nach dem login?

Answer 7

const setToken = store => next => action => {
if (action.type === LOGIN_SUCCESS) {
localStorage.setItem(“userTOken”, action.payload.token);}
next(action);
);