0

Here is my code which is causing the problems. I have Axios and I don't know how to use it effectively.

import axios from "axios";

const options = {
  headers: {
    'content-type': 'application/json',
    ContentType: 'text/json; charset=utf-8',
    'X-RapidAPI-Key': 'REACT_APP_KEY',
    'X-RapidAPI-Host': 'rdrunnerxx-trackservice.p.rapidapi.com'
  },
  data: '{"Locations":[{"LatLong":{"Latitude":39.767968, "Longitude": 64.421725}},{"LatLong":{"Latitude":40.022882 , "Longitude": 64.516878}}],"RouteOptions":{"DistanceUnit":0,"RouteOptimize":0,"Culture":"en-US","MapSize":null,"RouteColor":null}}'
};


export const ApiService = {
    async fetching() {
        const response = axios.post('https://rdrunnerxx-trackservice.p.rapidapi.com/route', data,  { options })
        return response
    },
}

const response = axios.post('url', data,  { options })
const data = ?
double-beep
  • 5,031
  • 17
  • 33
  • 41
Halimjon Halimov
  • 1
  • It's good that you show the problematic code. But it would be helpful if you told us what the problem is. *"code which is causing the problems"* isn't very specific. What did you expect to happen? And what is the current behaviour of the code? Are you getting errors? Do requests take too long? Aren't you getting the result you want? Could you describe the problem in more detail? – 3limin4t0r Apr 13 '23 at 13:19
  • Try to use Axios interceptors. here a reference link https://stackoverflow.com/a/52737325/3945316 – Abhinav Rai Apr 13 '23 at 14:34

2 Answers2

0

i think you need edit ContentType to "Content-Type":"application/json"

const {data} = await axios.post('/user', document.querySelector('#my-form'), {
  headers: {
    'Content-Type': 'application/json'
  }
})

document : https://axios-http.com/docs/post_example

Mohsen Abasi
  • 10
  • 2
0

This should work

async function fetching() {
  try {
    const response = await axios.post(
      'https://rdrunnerxx-trackservice.p.rapidapi.com/route',
      options.data,
      { headers: options.headers }
    );

    const data = response.data;
    console.log('data', data);
    return data;
  } catch(error) {
    console.log(error)
  }
}

export const ApiService = {
   fetching,
}

To use the Fetching function

// component.jsx

useEffect(() => {
  fetching();
}, [])
samduke
  • 91
  • 3