The latest articles on DEV Community by Derick Makuto Simiyu (@dmakuto). https://dev.to/dmakuto https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https:%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F221246%2F78123375-ada6-4b0c-91bd-5e3d26b26173.jpg https://dev.to/dmakuto en Derick Makuto Simiyu Sun, 23 May 2021 08:41:19 +0000 https://dev.to/dmakuto/how-do-i-resolve-react-cors-error-14d3 https://dev.to/dmakuto/how-do-i-resolve-react-cors-error-14d3 <p>I'm really having difficulty to fix cors error on an app developed in react. The error snippet below from browser console:</p> <p>Access to fetch at '<a href="https://thingproxy.freeboard.io/fetch/https://api.yelp.com/v3/businesses/search?term=fish&amp;location=phoenix&amp;sort_by=best_match">https://thingproxy.freeboard.io/fetch/https://api.yelp.com/v3/businesses/search?term=fish&amp;location=phoenix&amp;sort_by=best_match</a>' from origin '<a href="https://bitepoint.link">https://bitepoint.link</a>' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: 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.</p> <p>My fetch api code below:</p> <p>const apiKey = "xxx";</p> <p>const Yelp = {<br> search(term, location, sortBy) {<br>     return fetch( <code>https://thingproxy.freeboard.io/fetch/https://api.yelp.com/v3/businesses/searchterm=${term}&amp;location=${location}&amp;sort_by=${sortBy}</code>,<br> {<br> // crossDomain: true,<br> // mode: "cors",<br> // method: "GET",<br> // credentials: "include",<br> // "Access-Control-Allow-Credentials": true,<br> // "Access-Control-Allow-Methods": "GET",<br> headers: {<br> Authorization: <code>Bearer ${apiKey}</code>,<br> },<br> }<br> ).then((response) =&gt; {<br> return response.json();<br> }).then((jsonResponse) =&gt; {<br> if (jsonResponse.businesses) {<br> return jsonResponse.businesses.map((business) =&gt; {<br> //console.log(business);<br> return {<br> id: business.id,<br> imageSrc: business.image_url,<br> name: business.name,<br> address: business.location.address1,<br> city: business.location.city,<br> state: business.location.state,<br> zipCode: business.location.zip_code,<br> category: business.categories[0].title,<br> rating: business.rating,<br> reviewCount: business.review_count,<br> };<br> });<br> }<br> });<br> },<br> };</p> Derick Makuto Simiyu Wed, 05 May 2021 18:04:34 +0000 https://dev.to/dmakuto/help-to-fix-cors-error-7jo https://dev.to/dmakuto/help-to-fix-cors-error-7jo <p>I'm really having difficulty to fix cors error on an app developed in react. Please help!<br> Attached are the errors screenshots.</p>