CORS error

Hi @ddboy19912,

Thanks for reaching out.

To resolve the CORS issue, you can try putting the below rules in your .htaccess file –

SetEnvIf Origin “(https://localhost:5174)$” AccessControlAllowOrigin=$0
Header set Access-Control-Allow-Origin %{AccessControlAllowOrigin}e env=AccessControlAllowOrigin
Header set Access-Control-Allow-Credentials true
Header always set Access-Control-Allow-Methods “POST,GET,OPTIONS,DELETE,PUT”
Header always set Access-Control-Max-Age “3600”
Header always set Access-Control-Allow-Headers “Content-Type,Authorization”

Let us know if this helps.

Thanks,
Team miniOrange

I still get the same error using Basic auth in the React frontend. Here is a snippet of the fetching logic being employed

  useEffect(() => {
    async function fetchResult() {
      try {
        const username = "username";
        const password = "password";
        const encodedCredentials = btoa(${username}:${password}); // Encode username and password

        const response = await axios.post(
          "https://localhost/wordpress/wp-json/wp/v2/pages",
          {
            headers: {
              Authorization: Basic ${encodedCredentials}, // Include Basic Authentication header
            },
          }
        );

        console.log(response.data);
      } catch (error) {
        console.error("Error fetching token:", error);
      }
    }

    fetchResult();
  }, []);

Hi @ddboy19912,

Thanks for your reply.

Can you please try adding this request parameter mode: ‘no-cors’ in your Axios WordPress API request?

If still, the issue persists please drop an email to [email protected] with an appropriate description of the issue, so we can assign a technical engineer who can set up a screenshare session with you to help you out.

Thanks,
Team miniOrange

This did not work as well. I’ve sent a mail here [email protected]

Hi

I had a CORS problem as well, the error read

Access to XMLHttpRequest at 'https://www.no2do.com/synopse/kontakt' (redirected from 'https://no2do.com/synopse/kontakt') from origin 'https://no2do.com' 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.
www.no2do.com/synopse/kontakt:1 Failed to load resource: net::ERR_FAILED
778787.htm:

I tried a couple of things, finally I put the snipplet above (posted by abhiladdha07, “SetEnvIf Origin …”) in my .htaccess file and that fixed the issue.

However, when trying to figure the whole thing out, one of the supporters in my original post (https://de.www.ads-software.com/support/topic/blocked-by-cors/ ) pointed out that my website can be reached in 2 ways: with and without “www.”

Eventually that is also a point to have in mind: Is your website set up in a way that it only can be reaced ONE way, (either with or without “www.”)?

For me this does make a difference: The .htaccess-fix does NOT work as long as I call the website without “www.” (I suppose, the same applies if you can reach a site using both https:// and https://)

So I finally also added some lines to my .htaccess file fixing that issue as well. ??

Regards, Karin

Thank you very much for your response.

In my case, I’m basically trying to authenticate the API in my local environment (React setup). Kind of like this: https://localhost:5173/.

Initially I had the problem you were facing regarding ‘Access-Control-Allow-Origin’. I was able to bypass this through different ways. E.g installing a cors plugin on the browser, Install a cors plugin on wordpress or overriding the .htaccess file. After doing this, the error changed to the one I’m currently facing: https://i.ibb.co/ftcN2ry/Screenshot-2023-05-31-082317.png.

Thanks for your response. I’ll look into the forum you sent to see If it helps

Hi @ddboy19912,

It has been a while since we heard back from you on our ongoing email thread. We are marking this thread as resolved for now. You can always reach out to our email support or on this forum so we can help you in the best possible way.

Thanks,
Team miniOrange