Невозможно выполнить аутентификацию JWT в React и Redux - PullRequest
0 голосов
/ 24 января 2020

Обычно я пытаюсь сохранить пользователя после входа в систему.

Итак, когда пользователь входит в систему, я сохраняю токен в localStorage . Теперь в основном компоненте App.js я отправляю действие, чтобы получить текущего пользователя, потому что мне нужно знать, кто является текущим вошедшим в систему пользователем. После этого он переходит к создателю действия currentUser и отправляет запрос GET на маршрут /users/me с токеном (в заголовках). Итак, этот маршрут вызывается, и прежде чем перейти к контроллерам, нам нужно проверить токен. У меня есть auth.js в utils , который проверяет токен и декодирует его. После этого вызывается контроллер verifyUser, и я запутался здесь. Что здесь делать?

Вот код в последовательности:

App.js


class App extends Component {

    constructor(props) {
        super(props)
    }

    componentDidMount() {
        const authToken = localStorage.getItem("authToken")
        if (authToken) {
            this.props.dispatch(getCurrentUser(authToken))
        }
    }

    render() {
        return (
            <div>
                <Router>
                    <Switch>
                        <Route exact path="/" component={LandingPage} />
                        <Route path="/register" component={RegistrationForm} />
                        <Route path="/login" component={LoginForm} />
                        <Route path="/feed" component={Feed} />
                        <Route component={NotFoundPage} />
                    </Switch>
                </Router>
            </div>
        )
    }
}
actions/index.js

export const loginUser = (loginData) => {
    console.log("inside login action")
    return async dispatch => {
        dispatch({ type: "AUTH_STARTS" })

        try {
            const res = await axios.post("http://localhost:3000/api/v1/users/login", loginData)
            dispatch({
                type: "AUTH_SUCCESS",
                data: { user: res.data }
            })

            localStorage.setItem("authToken", res.data.token)

        } catch (err) {
            dispatch({
                type: "AUTH_ERROR",
                data: { error: "Something went wrong" }
            })
        }
    }
}



export const getCurrentUser = (token) => {
    console.log("inside getCurrentUser action", token)
    return async dispatch => {
        dispatch({ type: "AUTH_STARTS" })
        try {
            console.log("try block")
            const res = await axios.get("http://localhost:3000/api/v1/users/me", {
                headers: {
                    "Authorization": token
                }
            })
            dispatch({
                type: "AUTH_SUCCESS",
                data: { user: res.data }
            })
        } catch (err) {
            dispatch({
                type: "AUTH_ERROR",
                data: { error: "Something went wrong" }
            })
        }
    }
}

routes/users.js

router.get("/me", auth.verifyToken, usersController.verifyUser)
utils/auth.js

const jwt = require("jsonwebtoken")

function signToken(payload) {
    console.log("inside signToken")
    return jwt.sign(payload, process.env.JWTSECRET)
}

function verifyToken(req, res, next) {
    console.log("inside verifyToken")
    const token = req.headers.Authorization || req.headers.authorization || ""
    if (!token) {
        return res.status(403).json({ error: "Not authorized"})
    }

    jwt.verify(token, process.env.JWTSECRET, (err, decoded) => {
        if (err) {
            return res.status(403).json({ error: "Not authorized" })
        }

        req.user = decoded
        console.log(req.user, decoded)
        next()  
    })
}


module.exports = { signToken, verifyToken }
usersController.verifyUser

    verifyUser: (req, res) => {
        const email = req.body.email
        const user = User.findOneByField(email)
        return res.json({user})
    }
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...