React Fetch API in Laravel application

Question

I've seen this not-so-perfect solution where we're supposed to place a universal view route and then route everything from react-router like so:

Route::view('/{any}', 'layouts.app')->where('any', '.*');

or

Route::view('/{any?}', 'layouts.app');

But the big issue here is when I'm fetching data to react from within my laravel application, for example: /posts, react-router will try to resolve /posts, but laravel will match it with /{any?}, and the fetch call will respond with a view.

Is there a way to make apiResource calls like described, and if so, how?

Phillip Zoghbi · Accepted Answer · 2021-11-23 16:05:24Z

1

Name your API routes with the 'api' prefix 'api/posts' (for example).
Then let your react router do the routing for the application using one universal route:

Route::view('/{any?}', 'layouts.app');

This route comes after your API routes so that your API routes don't get matched with {'/any?'} parameter. (Very important!)

Then, you can have something like this in your react app:

<Routes>
    <Route path="/posts" element={<Posts/>} />
</Routes>

answered Nov 23, 2021 at 16:05

Phillip Zoghbi

6105 silver badges18 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

React Fetch API in Laravel application

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related