Failed to fetch when in fact it works in postman

Question

I'm fetching a google place api, it works perfectly fine in postman but it does not when I try to fetch it. Here is the error it produce: has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. If an opaque response serves your needs, set the request's mode to 'no-cors' to fetch the resource with CORS disabled.

  useEffect( () => {
    const fetchDataForPharmacy = async () => {
      try {
        const res = await fetch(`https://maps.googleapis.com/maps/api/place/findplacefromtext/json?&fields=formatted_address%2Cname%2Ctypes%2Cplace_id%2Cgeometry&input=pharmacy&inputtype=textquery&key={my_api_key}`,{
          method: "get",
          headers: { },
        });
        const data = await res.json();

        setPharmacyList(data);
        console.log(pharmacyList.candidates[0].position);
      } catch (e) {
        console.error(e);
      }
    }
    fetchDataForPharmacy();
  },[]);

score 0 · Answer 1 · answered Sep 22 '21 at 09:22

0

i think this api has been blocked by CORS policy,you need to set proxy to resolve it

answered Sep 22 '21 at 09:22

taoxiaoqi

19
1
4

Your answer could be improved with additional supporting information. Please [edit] to add further details, such as citations or documentation, so that others can confirm that your answer is correct. You can find more information on how to write good answers [in the help center](/help/how-to-ask). – Community Sep 22 '21 at 09:57

Failed to fetch when in fact it works in postman

1 Answers1