'Django Rest Framework Cors issues with query params

When I make a GET request without queryparams my backend provides the data no problem, but if I pass any queryparams the request gets rejected.

[Example of Rejection in network tab, status column says CORS ERROR][1]

The fetch being made is this (it's within a react useEffect)

fetch('http://localhost:8000/gems/' + new URLSearchParams({
      filters: 'all'
}))

If I remove the + params it works just fine, but removing the trailing slash also causes the issue.

in package.json I have added this

  "proxy": "https://localhost:8000/",

The backend view is this (going to overwrite get_queryset to read the params)

class GemViewSet(viewsets.ModelViewSet):
    queryset = Gem.objects.all()
    serializer_class = GemSerializer

and I've installed the cors app, added the middleware and set

CORS_ALLOW_ALL_ORIGINS = True

If someone could set me on the right track I'd be very grateful. [1]: https://i.stack.imgur.com/g0dIp.png



Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source