I know this has been asked a thousand times. I've went through each one of the answers and nothing seems to work, or I'm not asking the right questions.
I'm doing a small full-stack project. My backend is Node and Express running in port:8000
. The relevant part (I think) is this:
AppDataSource.initialize()
.then(()=>{
...
const app = express()
app.use(express.json())
app.use(cookieParser())
app.use(cors({
allowedHeaders: ['Content-Type', 'Authorization'],
credentials: true,
origin: ['localhost:3000'],
methods: ['GET', 'POST', 'PUT', 'DELETE']
}))
...
})
The front, running on localhost:3000
, is ReactJS and uses axios
. The relevant code is this one:
const deleteUser = async (id: number) => {
if (window.confirm('Are you sure you want to delete this record?')){
try {
await axios.delete(`users/${id}`)
setUsers(users.filter((u: UserType) => {
return u.id !== id
}))
}catch(e){
console.log(e)
}
}
}
The backend delete:
export const DeleteUser = async (req: Request, res: Response) => {
const id = parseInt(req.params.id)
const repository = AppDataSource.getRepository(User)
const user = await repository.findOneBy({id})
if (!user) {
res.status(404).send({
message: "No user found"
})
} else {
await repository.delete(id)
res.status(204).send({
message: "User deleted"
})
}
}
In Chrome I get this:
I may add that I have Access-Control-Allow-Origin
addon installed and active in Chrome, and Postman App has no issues DELETing records at all.
Any help?
I switched browser to FireFox, installed a CORS add-on and it worked. Doesn't solve the issue, but it does show the problem is Chrome.