how can i encode a token in my url using vuejs - vue.js

Question

i have an app which recieves token in my broswer url
http://localhost:8081/reset/eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJfaWQiOiI2MmU2YWJmMmMzMzI0Mjk1NGQyNmVjZjIiLCJpYXQiOjE2NTk1MDIwNTEsImV4cCI6MTY1OTUwMjk1MX0.GIlKy_GI7HlfuB1WgD9HPxOGRZUX2_uOtOclrDTW3Y8
how can i remove (.) from my url
this is how i go to my route
{ name: "reset", path: "/reset/:token", component: Reset },
this is my script tag on how i call the function
<script>
import axios from "axios";
export default {
data() {
return {
password: "",
confirm_password: ""
};
},
mounted() {
console.log("the id is :" + this.$route.params.token);
},
methods: {
async submit() {
let token = this.$route.params.token;
let encoded = encodeURI(token);
return axios({
method: "post",
data: {
password: this.password,
token: this.$route.params.token
},
url: "http://localhost:5000/api/auth/updatePassword",
headers: {
"Content-Type": "application/json"
}
})
.then(res => {
console.log(res);
this.$router.push({ name: "login" });
})
.catch(error => {
console.log(error);
});
},
clear() {
this.$refs.form.reset();
}
}
};
</script>
i can't get the reset page until i remove the (.) please how can i encode the token

Answer 1

The token that you have is a JWT token, which should contain the two dots. I don't think removing them is a good idea. However, it looks like Vue router interprets the dots like a separator or something, causing the router to fail in finding the route.
What you might do is use a query string instead of a route param. You add the token to the url like:
http://localhost:8081/reset?token=eyJhbGciOiJ...
You should change the route to:
{ name: "reset", path: "/reset", component: Reset },
Now you can get it from the router with:
this.$route.query.token