How to fetch data from Microsoft Custom Vision API using ReactJS

Question

I need some help regarding the use of Custom Vision. I built an image classifier in order to detect car damages.

So what I am trying to do: when I try to input an image and click the submit button, I want to be able to call the Custom Vision API and get the results in order to be able to analyze them later using ReactJS

I tried using AXIOS and the componentDidMount() method, but I can't seem to get a hold of them.

componentDidMount(){
axios.get('url: "https://southcentralus.api.cognitive.microsoft.com/customvision/v3.0/Prediction/...",
                   // Request headers {
                     prediction:   ("Prediction-Key","xxx");
                     content:  ("Content-Type","xxx");
                    },
                    type: "POST",
                    // Request body
                    data: imgContent,
                    processData: false')
  .then(response => {
    console.log(response.data);
  })
  .catch(error => {
    console.log(error);
  });
}

Either you should use ```axios(url : "...", method : "POST")``` or ```axios.post('url....', {data...})``` . Also if you want to call this method onclick you do not have to call it inside componentDidMount method. — Garry, Jul 11 '19 at 19:25

score 1 · Answer 1 · answered Jul 11 '19 at 19:18

Check your code, // Request headers { prediction: ("Prediction-Key","xxx"); content: ("Content-Type","xxx"); },

The first bracket seems to be commented out so this may be a potential problem.

You should use async/await with the componentDidMount method.

An example

  async componentDidMount() {
const response = await fetch(`https://api.coinmarketcap.com/v1/ticker/?limit=10`);
const json = await response.json();
this.setState({ data: json });

}

score 1 · Accepted Answer · answered Jul 11 '19 at 19:20

1

your request type is post and you are using axios.get()

answered Jul 11 '19 at 19:20

m7md2112

327
3
13

How to fetch data from Microsoft Custom Vision API using ReactJS

2 Answers2