Axios returning HTML data, not JSON

Asked

Viewed 191 times

1

I am developing small project to learn Act and I came across the following problem. When making a request in an Axios API by passing input as parameter to the route, Axios is returning an HTML, not a JSON.

The repository link if it helps. https://github.com/carlos-souza-dev/apinews

This is my code.

  // REACT
  
  const [ input, setInput ] = useState('');
  const [ query, setQuery ] = useState([]);
  
  const queryFunc = async () => {
    setQuery( await axios.get(`${props.url}/search`).then(res => {
        console.log("Response",res)
        return res.data.articles
      }))
    };

  const handleInput = (e) => {
    setInput(e.target.value);
  }

  const handleSubmit = () => {
    axios.get(`${props.url}/search`, {
      text: input,      
    });
  };
  
  
  // ROUTER
  
  app.get('/api/brasil/search', async  (req, res) => {

  const text = await ""+req.body.text;
  
  const response = await fetch(`${process.env.APP_URL}top-headlines?q=${text}&country=pt&from=${today}&to=${today}&apiKey=${process.env.APP_KEY}&pageSize=100`);
  const data = await response.json();
  res.send(data)
});

This is the Next Sponse.

inserir a descrição da imagem aqui

  • The Xios just brings what it gets as endpoint response. What that endpoint http://localhost:5000/api/search is bringing? Wouldn’t he be the problem?

  • I want to send a word as a search for the route, so I’ve created a route "http://localhost:5000/api/search" and this route is fetch in an API and returns the data "res.send(reply.data)" for the route "/search" and in the component I take this route "http://localhost:5000/api/search" and I use Axios to bring up the answer, and then the problem happens. When I put the word straight into the api url it works perfectly, now if I put the word through a variable it doesn’t work.

1 answer

0

The problem is not in AXIOS in this case,

probably you are making the request for a Website and not for an API.

Experiment with other "Apis", for example, https://fakerapi.it/en is a widely used API for testing applications.

Hug! Success!

  • Also received an HTML.

Browser other questions tagged

You are not signed in. Login or sign up in order to post.