Submitted over 1 year ago

Responsive Url Shortening App Using React and React Query

react, tanstack-query, tailwind-css, typescript

faizal789•390

@faizal789

A solution to the URL shortening API landing page challenge

Preview Code

Solution retrospective

I have an error like this in this project when accessing the /api/v1/shorten endpoint.

Access to XMLHttpRequest at 'https://cleanuri.com/api/v1/shorten' from origin 'https://faizal789.github.io' 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.

Does anyone know how to solve it?

Code

Please log in to post a comment

Community feedback

Sławek•310
@SlawekZet
Posted over 1 year ago
What you have to do is to create a proxy server that will deal with the CORS issue. I did that for the first version of my solution. It was working like that: Shortly App --> proxy server --> CleanUri API. Here is the proxy repo: https://github.com/SlawekZet/express-CORS-proxy I've deployed it on Netlify, so it should be ready to go :)

Join our Discord community

Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!

Join our Discord