[Django]-How to store JWTs in HttpOnly Cookies?

by

0👍

✅

Well I was making a silly mistake,
so moving {withCredentials:true} from here =>

export const login = (username, password) => dispatch => {
    //Headers
    const config = {
        headers: {
            "Content-type": "application/json"
        }
    }

    //Request body
    const body = JSON.stringify({ username, password })

    axios.post("http://127.0.0.1:8000/auth/login/", body, config, {withCredentials: true})
        .then(res => {
            dispatch({
                type: LOGIN_SUCCESS,
                payload: res.data
            })
        }).catch(err => {
            console.log(err)
            dispatch({
                type: LOGIN_FAIL
            })
        })
}

to here =>

    //Headers
    const config = {
        headers: {
            "Content-type": "application/json"
        },
        withCredentials: true
    }

solved my problem.

👤altF4

3👍

You can set cookie with set_cookie() method.

For example:

...
response = Response(serializer.data)
response.set_cookie('token', serializer.data['token'], httponly=True)
return response

Good article about where to store JWT (and how to do it) here.

👤python.enjoyer

3👍

Same problem I faced. Here samesite flag is ‘Lax‘ or ‘strict‘ so cookie blocked by browser. Because cross-site response not set cookie.

So when in development you have to host your backend and frontend under same IP. ex. my backend :

python manage.py runserver localhost:8000

localhost:8000

frontend:

localhost:3000

Different ports same ip.

This is not the scenario when it goes to production you can have any domain.
For more detail.

WithCredentials = true for both side..

👤Pradip Kachhadiya

Leave a comment