Redirect is not allowed for a preflight request

somethingsomething picture somethingsomething · Nov 8, 2018 · Viewed 31k times · Source

I have this problem where i get the response when trying to use a rest api: "Access to fetch at 'https://kollektivet.app:8082/api/login/' from origin 'https://kollektivet.app' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: Redirect is not allowed for a preflight request."

Picture of response when trying to fetch

This happens when i try any of the rest api's I am using. From what i have read, this error means I am trying to re-direct, which I am not.

The backend is Django and looks like this:

    @csrf_exempt
@api_view(["POST"])
@permission_classes((AllowAny,))
def register(request,):
        password = request.data.get("password", "")
        email = request.data.get("email", "")
        if not email and not password and not email:
            return Response(
                data={
                    "message": "username, password and email is required to register a user"
                },
                status=status.HTTP_400_BAD_REQUEST
            )
        new_user = User.objects.create_user(
            email=email, password=password
        )
        return Response(status=status.HTTP_201_CREATED)

And the front-end is in react which looks like this:

createUser(event) {
        event.preventDefault();

        let data = {
            name: this.state.name,
            password: this.state.password,
            repeatPassword: this.state.repeatPassword,
            email: this.state.email
        };

        if (this.state.name !== '' && this.state.password !== '' && this.state.email !== '' && this.checkPasswords()) {
            console.log('name', this.state.name, 'password ', this.state.password, 'email ', this.state.email);
                fetch("https://kollektivet.app:8082/api/register/", {
                    method: 'POST',
                    headers: {
                        'Accept': 'application/json',
                        'Content-Type': 'application/json',
                    },
                    mode: "cors",
                    body: JSON.stringify(data)
                })
                    .then(response => response.json())
                    .then(data => console.log(data))
                    .catch(error => console.log(error));
            this.setState({message: "Du er nå registrert! For å aktivere din konto trykk på linken som vi har sendt til deg på epost"});
            this.setState({name: ""});
            this.setState({password: ""});
            this.setState({repeatPassword: ""});
            this.setState({email: ""});

        }
    }

I Do have this is the Django settings file:

CORS_ORIGIN_ALLOW_ALL = True
CORS_ALLOW_HEADERS = (
    'accept',
    'accept-encoding',
    'authorization',
    'content-type',
    'dnt',
    'origin',
    'user-agent',
    'x-csrftoken',
    'x-requested-with',
)

I am running this on apache2 if this is relevant. The port 8082 is also closed. Does this need to be open when it is on the same server?

Thanks!

Answer

rich tier picture rich tier · Nov 9, 2018

You're being redirected to site.site.comapi/register/

Do you have some other middleware that does this? Maybe in Apache config?

Note it's a 301 so your browser has cached this response and will now always redirect there even if your rove the code that resulted in this redirect, or even if you stop Django from running.

So you will need to also clear your redirect cache in the browser.

This is why I don't like 301 responses. 302 are much more polite.