无法在承诺链接larave-vue2 spa身份验证中遇到错误

发布于 2025-01-21 09:51:06 字数 1967 浏览 3 评论 0原文

我尝试使用VUE3和VUEX在Laravel9 Sanctum A Spa中进行身份验证,而不是使用令牌身份验证,而是使用水疗认证。 我不太习惯使用JavaScript语言,甚至不太习惯保证链接。

我尝试的第一件事是注册。 这是我的方法。

后端注册方法

public function register(Request $request)
{
    $request->validate([
        'name' => 'required|string',
        'email' => 'required|email|string|unique:users,email',
        'password' => [
            'required',
            'confirmed',
            Password::min(8)->mixedCase()->numbers()->symbols()
        ]
    ]);

    $user=User::create([
        'name' => $request['name'],
        'email' => $request['email'],
        'password' => bcrypt($request['password'])
    ]);
    return response (['user'=>$user]);
}

寄存器中的前端注册方法

    //is actually the register form's data
const user = {
        name: "",
        email: "",
        password: "",
        password_confirmation: "",
};

function register(ev) {
        ev.preventDefault();
        store
        .dispatch("register", user)
        .then((data) => {
            console.log("data in vue");
            console.log(data);
            router.push({
                name: "Login",
            });
        })
        .catch((error) => {
                if (error.response.status === 422) {
                errors = error.response.data.errors;
                }
        });
} 

。 操作:{

     register({ commit }, form) {
        console.log("in register of index");
         axiosClient.get("/sanctum/csrf-cookie");
        return axiosClient.post("/api/register", form).then(({ data }) => {
            console.log("data dans index");
            console.log(data);
            return data;
        });
    },
    ...
    

注册工作正常,但是当我尝试以注册表格中已经存在的电子邮件时,我会按照预期获得状态422,并且来自AxiosClient的响应。

{“消息”:“电子邮件已经存在 取。

。我继续使用。然后推动登录路线,这不是我想要的

I try to authenticate in Laravel9 Sanctum a SPA using vue3 and vuex, not with the token authentification but with the SPA Authentication.
I am not very used to the javascript language, and even less to promise chaining.

The first thing I am trying is registration.
Here are my methods.

The backend registration method

public function register(Request $request)
{
    $request->validate([
        'name' => 'required|string',
        'email' => 'required|email|string|unique:users,email',
        'password' => [
            'required',
            'confirmed',
            Password::min(8)->mixedCase()->numbers()->symbols()
        ]
    ]);

    $user=User::create([
        'name' => $request['name'],
        'email' => $request['email'],
        'password' => bcrypt($request['password'])
    ]);
    return response (['user'=>$user]);
}

The frontend registration method in the register.vue

    //is actually the register form's data
const user = {
        name: "",
        email: "",
        password: "",
        password_confirmation: "",
};

function register(ev) {
        ev.preventDefault();
        store
        .dispatch("register", user)
        .then((data) => {
            console.log("data in vue");
            console.log(data);
            router.push({
                name: "Login",
            });
        })
        .catch((error) => {
                if (error.response.status === 422) {
                errors = error.response.data.errors;
                }
        });
} 

the actions method in the store/index.js
actions: {

     register({ commit }, form) {
        console.log("in register of index");
         axiosClient.get("/sanctum/csrf-cookie");
        return axiosClient.post("/api/register", form).then(({ data }) => {
            console.log("data dans index");
            console.log(data);
            return data;
        });
    },
    ...
    

The registration is working fine but when I try an already existing email in the registration form, I get a status 422 as expected and this response from the axiosClient.post('/api/register',form):

{"message":"The email has already been
taken.","errors":{"email":["The email has already been taken."]}}

I expect this error to be intercepted by the catch in the register view but it doesn't happen. Despite this error I continue to use the .then and to push the Login route which is not what I want.

Can somebody tell me where I am doing wrong ?

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(1

梦幻的味道 2025-01-28 09:51:06

我完全忘记了在我的axios.js中,有拦截器触发了这种错误的行为。
现在一切都清楚。

I completely forget that in my axios.js there were interceptors that triggered this wrong behavior.
All is clear now.

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文