use-hooks/react-hooks-axios

POST data is not passing

FabianoLothor opened this issue · 7 comments

This is not working. My request is not sending the data object.

  const { loading, error, response } = useAxios({
    filter: () => sent,
    method: 'POST',
    options: {
      data: {
        prop1: "value",
        prop2: "value2",
      },
    },
    trigger: sent,
    url: "myApiLink"
  });

You should set correct headers in your own code instead of patching in this library, others have different usage scenario.

  const { loading, error, response } = useAxios({
    filter: () => sent,
    method: 'POST',
    options: {
      data: {
        prop1: "value",
        prop2: "value2",
      },
+     headers: {
+       'Content-Type': 'application/x-www-form-urlencoded',
+     },
    },
    trigger: sent,
    url: "myApiLink"
  });

axios.post method don't need add any header.

Actually, it need.
You can read docs.

It's two things here:

The request is sending OPTIONS, no POST.

It's because CORS issue, you can see more detail in Console of your demo.

Actually, it need.

I mean POST method needs headers for Content-Type (although here's a default value, but what about i need to set it as application/json?)

At last, the code i given is just a example to explain why patching in this library is rejected.

Well i don't see why the hooks can't optimize the POST methods. I go try something setting axios.default.

Sorry man.

The problem it was with my SpringBoot API. The API it was blocking OPTIONS requests.

I resolve the problem adding a line in the API config:

configuration.setAllowedHeaders(Arrays.asList("Content-Type"));