Axios post and problem with CORS in CodeIgniter 4

Question

I trying post data to backend from Vue app and I have problem with CORS. I using CodeIgniter 4 in backend.

This is my vue service:

import axios from "axios";

const apiUrl = "http://localhost:8080/admin/users/";

export default {

    create(userData) {
        return axios.post(apiUrl + "create", {
            firstName: userData.firstName,
            lastName: userData.lastName,
            email: userData.email,
            password: userData.password,
            role: userData.role
        }).then(response => {
            return response.data;
        }).catch(function() {
            const response = {
                status: 500,
                error: true,
                message: "Błąd połączenia z API.",
                data: []
            };

            return response;
        });
    }

}

Info from console:

Access to XMLHttpRequest at 'http://localhost:8080/admin/users/create' from origin 'http://localhost:8081' 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.

I try add this code in public/.htaccess but it doesn't work:

<IfModule mod_headers.c>
    Header set Access-Control-Allow-Origin "http://localhost:8081"
    Header set Access-Control-Allow-Methods "GET, POST, OPTIONS, PUT, DELETE"
</IfModule>

could you solve your problem, I'm having the same error – Henry marca zeballos Jan 09 '23 at 15:33 — Henry marca zeballos, Jan 09 '23 at 15:33

score 0 · Answer 1 · answered Nov 26 '21 at 16:04

Try:

<IfModule mod_headers.c>
    Header always set Access-Control-Allow-Origin "http://localhost:8081"
    Header always set Access-Control-Allow-Methods "GET, POST, OPTIONS, PUT, DELETE"
</IfModule>

Enable apache module headers and restart the Apache service.

Apache: difference between "Header always set" and "Header set"?

Enable mod_headers in Apache in Windows

Axios post and problem with CORS in CodeIgniter 4

1 Answers1