0
441
ViewsUsing Axios to send a token to the backend
I am new to this
I am writing a Vue app that connects to a Wordpress backend and I need to log in. I am using a plugin called Simple JWT-Login and I am able to send the email and password to the back end and i get the JWT back. But trying to log in and sending the jWT back to the back end gets me an error Bad Request. Here is the function that is supposed to handle the login
async login(){
try{
const response = await axios.post('/?rest_route=/simple-jwt-login/v1/auth&email=email&password=password',
{
email: this.email,
password: this.password,
}
);
const token = response.data.data.jwt
localStorage.setItem('token', token)
console.log(token)
const login = await axios.get('/?rest_route=/simple-jwt-login/v1/autologin&JWT=token')
console.log(login)
// this.$router.push("/");
} catch(err){
console.log(err)
// if(err.response.status === 400){
// this.error = "Wrong credentials! Please make sure"
// }
} finally{
}
}
2 answers
Answer question0
The issue was a setting in the plugin that the docs does not explain to you and unless you are an expert the only way to find out is by trial and error.
The setting under general for SESSION must be On
0
Looking at the docs for Login User, it seems you just need to pass the previous token value as the JWT query parameter.
I've always found it best to use the params option in Axios for query params
const login = await axios.get("/", {
params: {
rest_route: "/simple-jwt-login/v1/autologin",
JWT: token,
}
})
Your issue was that in this string...
'/?rest_route=/simple-jwt-login/v1/autologin&JWT=token'
token was not interpolated; you were literally sending "token".
You should do the same with your first request. The email and password should not be in the query string for this one.
axios.post("/", {
email: this.email,
password: this.password,
}, {
params: {
rest_route: "/simple-jwt-login/v1/auth",
}
})