I have this code in codepen and it works properly however if I installed this code on a wordpress site as a plugin, it says this error below.

Access to XMLHttpRequest at '' (redirected from '') from origin 'http://localhost:8888' 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.

My codepen is here.

$.ajax({
            type: "post",
            url: ";,
          
            dataType: "json",
          data: data_val,
        
            success: function(data) {
                $(".optin-form").hide();
                $(".optin-success").show();
            },
            //expected to be error in result.
            error: function(data){
              
              $(".optin-form").hide();
              $(".optin-success").show();
            }
        });

Is there a way to fix this issue? Please help.

I have this code in codepen and it works properly however if I installed this code on a wordpress site as a plugin, it says this error below.

Access to XMLHttpRequest at 'https://vative.us15.list-manage./subscribe/post' (redirected from 'http://vative.us15.list-manage./subscribe/post') from origin 'http://localhost:8888' 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.

My codepen is here.

https://codepen.io/gegejosper/pen/powzGQJ?editors=1011

$.ajax({
            type: "post",
            url: "https://vative.us15.list-manage./subscribe/post",
          
            dataType: "json",
          data: data_val,
        
            success: function(data) {
                $(".optin-form").hide();
                $(".optin-success").show();
            },
            //expected to be error in result.
            error: function(data){
              
              $(".optin-form").hide();
              $(".optin-success").show();
            }
        });

Is there a way to fix this issue? Please help.

• javascript
• ajax
• xmlhttprequest
• same-origin-policy

Share Improve this question Follow asked Aug 27, 2021 at 23:45 EasyWayEasyWay 36511 gold badge66 silver badges2323 bronze badges

Add a ment  | 

2 Answers 2

Sorted by: Reset to default 2

Server (https://vative.us15.list-manage.) has to allow the cross origin requests. As of now it's not allowing this. (Exact solution will depends on which language server is written)

I see the same issue in codeopen: index.html:1 Access to XMLHttpRequest at 'https://vative.us15.list-manage./subscribe/post' from origin 'https://cdpn.io' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.

From the server-side (your VPS) add the following header:

Access-Control-Allow-Origin: *

Nodejs

res.writeHead(200, {'Access-Control-Allow-Origin': '*'});

PHP

header('Access-Control-Allow-Origin: *');

You can also white list certain domains as shown here :

Access-Control-Allow-Origin: https://codepen.io

For more info, check MDN