I am trying to fetch data from jsonplaceholder by axios and request. I found that when I pass 'http' url to axios, it returned 'Network Error'.
code
import axios from "axios"
const url='http://jsonplaceholder.typicode.com/todos/1';
axios.get(url)
.then((res) => console.log(res))
.catch((err) => console.log(err))
response
AxiosError: Network Error
message: "Network Error"
name: "AxiosError"
code: "ERR_NETWORK"
config: (15) {transitional: {...}, adapter: xhrAd...}
request: XMLHttpRequest {data: undefined}
response: XMLHttpRequest {data: undefined}
Or you can see all responses I have tried in these images.
It takes some time for the request to return. Hence you must call it asynchronously:
async function getSomeDataWithAsync() {
/*
Using await inside a function marked as async tells the browser to HOLD UP
on running any more of the functions code until the promise is returned and the
value is set in the response variable.
*/
const response = await axios.get("https://jsonplaceholder.typicode.com/todos/1");
/*
This is the same exact point as the first .then in the getSomeData function above
this one. You can see async/await is slightly less verbose.
*/
console.log(response)
/*
At this point you can extract the data from the resolved promise
and use it.
*/
const { data } = response;
console.log(data);
}
getSomeDataWithAsync();