Did you find the root cause of your issue? I started having the same problem today....
XHR Cancelled Requests - InertiaJS
Hey all,
I hope everyone is well!
First post here so I hope it's not a stupid one!
The question, so I am pretty far into building my Inertia App using the latest Laravel and Vue3 using mostly .
I am at a point where my functions are doing Inertia posts. An example of this:
NewPerson.vue (Slide-out menu Component)
function submit() {
Inertia.post("customers", form, {
onSuccess: () => {
Inertia.visit(`/companies/${company.id}/edit`);
alert("Contact Successfully Created");
},
});
this.open = false;
}
CustomersController::index - Store function
public function store(Request $request)
{
Customers::create([
'uuid' => Str::uuid(16),
'company_id' => $request->company_id,
'first_name' => $request->first_name,
'last_name' => $request->last_name,
'full_name' => $request->first_name . ' ' . $request->last_name,
'email_address' => $request->email_address,
'contact_number' => $request->contact_number,
'company_name' => $request->company_name,
'location_name' => $request->location_name
]);
return redirect()->back()->with('success', 'Contact was successfully created.');
}
specified route - web.php
Route::post('companies/{id}/customers', [CustomersController::class, 'store']);
What I am finding is, that it seems to be doing 2 XHR requests sending the same payload but one is "canceled". My issue with this is I think this is causing duplicate data to be posted to my API which in turn is putting 2 entries into the database.
Just for some background, this is my first deep dive into inertia, In my day job, I work on a VueSPA with a laravel backend using Axios. I can surmise it's probably something I am doing wrong, but I am at a loss as to what.
Any suggestions or help will be greatly appreciated :)
Have a good day everyone and thank you for reading.
Please or to participate in this conversation.