Bonjour tout le monde, j’ai récemment commencé un projet et j’ai des problèmes avec axios (une bibliothèque pour faire des http request).
Je suis entrain de faire un sign up form et je voudrais authentifier les utilisateurs qui s’inscrive. Le problème est que lorsque je teste le form, je reçois une erreur 404 à cause de la post request, pourtant le endpoint est le bon. Voici l’erreur que je reçois sur ma console: POST http://localhost:8080/SignUp 404 (Not Found). J’ai bien loader la dependencie axios et j’ai aussi installé le package sur mon projet donc je ne comprend pas.
voici le script pour ma component « Sign Up »:
<script>
import axios from "axios";
export default {
name: "SignUpView",
data() {
return {
name: "",
email: "",
password: "",
};
},
methods: {
handleSubmit() {
const data = {
name: this.name,
email: this.email,
password: this.password,
};
axios
.post("http://localhost:8080/SignUp", data)
.then((res) => {
console.log(res);
})
.catch((err) => {
console.log(err);
});
},
},
};
</script>
axios.js:
import axios from "axios";
axios.defaults.baseURL = "http://localhost:8080/";
main.js:
import { createApp } from "vue";
import App from "./App.vue";
import router from "./router";
import store from "./store";
import "./axios";
createApp(App).use(store).use(router).mount("#app");
et le router (si ça peut aider):
import { createRouter, createWebHistory } from "vue-router";
import MenuView from "../views/MenuView.vue";
import ExperienceView from "../views/ExperienceView.vue";
import FaqView from "../views/FaqView.vue";
import PricingView from "../views/PricingView.vue";
import ContactView from "../views/ContactView.vue";
import SignUpView from "../views/SignUpView.vue";
import LoginView from "../views/LoginView.vue";
const routes = [
{
path: "/",
redirect: "/Menu",
},
{
path: "/Menu",
name: "Menu",
component: MenuView,
},
{
path: "/Experience",
name: "Experience",
component: ExperienceView,
},
{
path: "/Faq",
name: "Faq",
component: FaqView,
},
{
path: "/Pricing",
name: "pricing",
component: PricingView,
},
{
path: "/Contact",
name: "Contact",
component: ContactView,
},
{
path: "/Login",
name: "Login",
component: LoginView,
},
{
path: "/SignUp",
name: "SignUp",
component: SignUpView,
},
];
const router = createRouter({
history: createWebHistory(process.env.BASE_URL),
routes,
});
export default router;
Voilà donc si vous avez une réponse à ce problème n’hésitez pas ça m’aiderait beaucoup, merci à tous !
