[FIXED] postman requests are "POST" but react request are "OPTIONS"

Issue

I try to communicate with a reactjs front and a flask back but I get this problem: When i call my function with postman i get this:

127.0.0.1 - - [25/Mar/2022 16:53:34] "POST /add HTTP/1.1" 200 -

and when i call it with my react js front:

127.0.0.1 - - [25/Mar/2022 16:52:16] "OPTIONS /add HTTP/1.1" 200 -

I looked old stack overflow but i don't find my answer.

There is my flask function;

@app.route("/add", methods=["POST"], strict_slashes=False)
def add_articles():
    print("NONNNNNNNNNNNN")
    return "AHHHHH"

this is my api call:

export default class APIService{
    // Insert an article
    static InsertArticle(body){
        return fetch(`http://localhost:5000/add`,{
            'method':'POST',
             headers : {
            'Content-Type':'application/json'
      },
      body:JSON.stringify(body)
    })
    .then(response => response.json())
    .catch(error => console.log(error))
    }

}```

thanks for yours answers, i am lost

Solution

When the React app makes a request to the api, it needs to make an options request first for CORS check, since they are in different domain. You can verify that in the network tab of the developer tool that each ajax request has a OPTIONS request before it.

For example, you React app could be in localhost:3000, while the backend is in localhost:5000 domain. Then each ajax request needs to make a CORS check first, because the frontend & backend are technically in different domains. You don't see the options request in Postman because Postman is making the call directly to the backend so it doesn't needs the options request for the CORS check.

Answered By - Anthony C