I'm not sure why I'm getting a 404 error even though my endpoint URL is correct. I know it's correct because I've even verified through via the Network tab. I'm testing via Postman and the API's working fine but some reason, the endpoint just can't be found.
I've tried too many ways to list here in an attempt to rectify this but to no avail. Does anyone have any suggestions on what I can try to do to fix this?
I've tried /api/register, api/register, /register to name a few but none of it worked.
const LoginSignUp = () => {
const [name, setName] = useState("");
const [email, setEmail] = useState("");
const [password, setPassword] = useState("");
const [confirmPassword, setConfirmPassword] = useState("");
const handleSubmit = () => {
let data = {
'name': name,
'email': email,
'password': password,
'confirmPassword': confirmPassword
}
axios.post('http://myWebsite.test/api/register', data)
.then(data => {
console.log(data);
}).catch(error => {
console.log(error);
});
}
return(
<form method="POST" onSubmit={handleSubmit()}>
<div className="card-back">
<div className="center-wrap">
<div className="section text-center">
<h4 className="mb-4 pb-3">Sign Up</h4>
<div className="form-group">
<input type="text" name="logname"
className="form-style"
placeholder="Username"
id="userName"
autoComplete="none"
onChange={(e) => setName(e.target.value)}
/>
<i className="input-icon uil uil-user"></i>
</div>
<div className="form-group mt-2">
<input type="email" name="logemail"
className="form-style"
placeholder="Your Email"
id="logemail"
autoComplete="none"
onChange={(e) => setEmail(e.target.value)}
/>
<i className="input-icon uil uil-at"></i>
</div>
<div className="form-group mt-2">
<input type="password" name="logpass"
className="form-style"
placeholder="Your Password"
id="logpass"
autoComplete="none"
onChange={(e) => setPassword(e.target.value)}
/>
<i className="input-icon uil uil-lock-alt"></i>
</div>
<div className="form-group mt-2">
<input type="password" name="logpass"
className="form-style"
placeholder="Confirm Password"
id="logpass"
autoComplete="none"
onChange={(e) => setConfirmPassword(e.target.value)}
/>
<i className="input-icon uil uil-lock-alt"></i>
</div>
<button className="btn mt-4">Submit</button>
</div>
</div>
</div>
</form>
);
}
Here's my api.php file
Route::post('register', [RegisterController::class, 'register']);
Here's the cURL format:
curl 'http://myWebsite.test/api/register' \
-H 'Connection: keep-alive' \
-H 'Accept: application/json, text/plain, */*' \
-H 'X-XSRF-TOKEN: eyJpdiI6IjBLQ1Z2ck5DZ1NZSTUwQkNrOFoxaWc9PSIsInZhbHVlIjoiV1MwaUVqM1NiYUdwcHcxSUlJMkhOMlIyeXZaaWdCOXEzd2ZFRFRkM3I0akVkQmJPSFJwYkM4cGc2WEhVYXBtM0xzV3FZQmxGWGpUUnoxMndBRkpzSlBWcFkwZVROTDhMTWpEWHNVc2RYYmpXVEgzdWo0NzI0RWlzM0FUWDJZek4iLCJtYWMiOiJhMDBiNzg0NDA4M2UyOGNmODQ0NjMwN2FlOWY3OTI5ZGZkOTkwNmUzZDA5OTliMDcxNjFkMGExOGJlNzUzYWI5In0=' \
-H 'X-Requested-With: XMLHttpRequest' \
-H 'User-Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/91.0.4472.77 Safari/537.36' \
-H 'Content-Type: application/json;charset=UTF-8' \
-H 'Origin: http://myWebsite.test' \
-H 'Referer: http://myWebsite.test/' \
-H 'Accept-Language: en-US,en;q=0.9' \
-H 'Cookie: XSRF-TOKEN=eyJpdiI6IjBLQ1Z2ck5DZ1NZSTUwQkNrOFoxaWc9PSIsInZhbHVlIjoiV1MwaUVqM1NiYUdwcHcxSUlJMkhOMlIyeXZaaWdCOXEzd2ZFRFRkM3I0akVkQmJPSFJwYkM4cGc2WEhVYXBtM0xzV3FZQmxGWGpUUnoxMndBRkpzSlBWcFkwZVROTDhMTWpEWHNVc2RYYmpXVEgzdWo0NzI0RWlzM0FUWDJZek4iLCJtYWMiOiJhMDBiNzg0NDA4M2UyOGNmODQ0NjMwN2FlOWY3OTI5ZGZkOTkwNmUzZDA5OTliMDcxNjFkMGExOGJlNzUzYWI5In0%3D; laravel_session=eyJpdiI6Ik9rdmowVnVGc0I5eXN0M043MmdmYWc9PSIsInZhbHVlIjoieXVtSWtlSW5wOVRCWm1DM3FJdzJWSWduczRERk03MUFvN2U2czd5ZldUcXJ0Zi9wZUVpSU9mOE5UN3BNN3oraXdwSjlXNlhwL0VsNWl2aHprZ25leWxLWDZkMnpibXlrTkFZRDFLa3BQaVd2RFFZY3htTHZTUHZoMHJPeDNYWGEiLCJtYWMiOiJmM2EzMjdhMzI4MjZjZjA5NTJmYjFjNDA4OWNmYTYxZDUxYzdkOTk3OTQ1ODFlYTNhN2E4MGE1ODQ5ZWZhNDliIn0%3D' \
--data-raw '{"name":"g","email":"","password":"","confirmPassword":""}' \
--compressed \
--insecure