Laravel and React CORS error only on certain routes

\\Routes  Route::view('/{path?}', 'app');  Route::post("users/signup", "App\Http\Controllers\Users@signup");  Route::post("users/email/verify", "App\Http\Controllers\EmailVerificationController@verify");  Route::get("users/email/resend", "App\Http\Controllers\EmailVerificationController@resend");  

\\Verify email once the user clicks on their email  <?php    namespace App\Http\Controllers;    use App\Mail\VerifyEmail;  use App\Models\User;  use Illuminate\Http\Request;  use Illuminate\Support\Facades\Mail;    class EmailVerificationController extends Controller  {     public function verify( Request $request){         $user = User::where($request->input("token") ,"verification_token");           if($user){             $user->markEmailAsVerified();             $user->email_verified_at = now();             return response()->json(["msg" => "Email has been verified"]);         }      }       public static function sendVerificationEmail($email,$username,$verificationToken){         $userInfo = [             "username" => $username,             "verification_token" => $verificationToken,         ];         Mail::to($email)->send(new VerifyEmail($userInfo));     }  }  

\\Frontend for the VerifyEmail Page  import React, { useEffect } from 'react'  import { useParams } from 'react-router-dom'  import {instance} from "../axios"    const VerifyEmail = () =>  {      let {token} = useParams();      useEffect( () =>      {          instance.post( `users/email/verify`, {             token          } ).then((response) => console.log(response)         ).catch((err) => console.log(err.response))      },[])        return (          <div>              Hello          </div>      )  }    export default VerifyEmail  

I'm trying to verify users' emails, so when a user signs up, an email is sent with a token and when they click on the link of the email, it takes them to the VerifyEmail component in the frontend. Then this component makes a request to the backend with the token to check the database for this token and mark this email as verified, but I get this error:

Access to XMLHttpRequest at 'http://localhost/social-api/public/users/email/verify' from origin 'http://localhost:3000' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: It does not have HTTP ok status.  Error: Network Error      at createError (createError.js:16)      at XMLHttpRequest.handleError (xhr.js:84)  xhr.js:177 POST http://localhost/social-api/public/users/email/verify net::ERR_FAILED  

If I change the post request and I try to do a simple get request,then I get this error in the response.

"message": "",      "exception": "Symfony\\Component\\HttpKernel\\Exception\\NotFoundHttpException",      "file": "D:\\xampp\\htdocs\\social-api\\vendor\\laravel\\framework\\src\\Illuminate\\Routing\\AbstractRouteCollection.php",      "line": 43,  

The issue was in the config cors file, changed it from this

'paths' => ['social-api/public/*'],        'allowed_methods' => ['*'],        'allowed_origins' => ['*'],        'allowed_origins_patterns' => [],        'allowed_headers' => ['*'],        'exposed_headers' => [],        'max_age' => 0,        'supports_credentials' => false,  

to this

'paths' => ['*'],        'allowed_methods' => ['*'],        'allowed_origins' => ['*'],        'allowed_origins_patterns' => [],        'allowed_headers' => ['*'],        'exposed_headers' => [],        'max_age' => 0,        'supports_credentials' => false,  

https://stackoverflow.com/questions/66506515/laravel-and-react-cors-error-only-on-certain-routes March 06, 2021 at 10:04PM