0

My site is https://a.com. I making an AJAX call to https://b.com, where my pageAction method resides and I make update operations on the database where the result is then converted to JSON.

I need to show the result in a.com using an alert and update the same in database of a.com. Please note I have added referrer as a.com in b.com

The problems that I have encountered are:

  1. In firefox I have Error as :

Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at https://B.com/statusCheck.htm. (Reason: CORS header ‘Access-Control-Allow-Origin’ does not match ‘http://B.com’).

  1. The response body is not available to scripts (Reason: CORS Allow Origin Not Matching Origin) in response header of browser.
 Status   200
Version    HTTP/1.1
Transferred     3.89 KB (111 B size)
Referrer Policy    strict-origin-when-cross-origin

Response header

HTTP/1.1 200 
X-Content-Type-Options: nosniff
X-XSS-Protection: 1;   mode=block
Strict-Transport-Security:   max-age=7776000; includeSubdomains
Access-Control-Allow-Origin:   http://b.com
Access-Control-Allow-Credentials:   true 

Request header

POST /statusCheck.htm HTTP/1.1
Host: B.com
User-Agent: Mozilla/5.0 (X11; Ubuntu; Linux x86_64; rv:99.0) Gecko/20100101 Firefox/99.0
Accept: application/json, text/javascript, */*; q=0.01
Accept-Language: en-US,en;q=0.5
Accept-Encoding: gzip, deflate, br
Content-Type: application/x-www-form-urlencoded; charset=UTF-8
Content-Length: 137
Origin: https://A.com
Connection: keep-alive
Referer: https://B.com/

Please help me to render the response from b.com

function checkStatusFromExternalApp() {
  var url = "https://B.com/statusCheck.htm";
  var mandatoryFields = {
    "username": "name",
    "password": "pass"
  };

  $.ajax({
    type: "POST",
    url: url,
    data: {
      "pageAction": "checkStatus",
      "id": "123",
      "authenticationFields": mandatoryFields
    },
    dataType: "json",
    success: function(response) {
      if (response.success == false) {
        alert(response.errorMsg);
      } else {
        var respStatus = response.status;

        $.ajax({
          type: "POST",
          url: contextPath + "history.htm",
          data: {
            "pageAction": "updateStatus",
            "status": respStatus,
          },
          dataType: "json",
          success: function(response) {
            if (response.success == false) {
              alert(response.errorMsg);
            } else {
              alert(response.successMsg);
            }
          }
        });
      }
    }
  });
}
  • 1
    Allow `CORS` in your server setting/server code. It tells the browser that the server is open to accepting requests from other domains, sites, ports, etc as well. – Sang Suantak May 19 '22 at 07:42
  • @SangSuantak Hi, could you tell me in which server to add in application A or B ? – wisdom_seeker May 19 '22 at 07:55
  • 1. You need to add CORS headers to the response from b.com. Exactly how you do that will depends on the OS/code running on that server. I'd suggest Googling 'enable CORS [server type] [language name]' 2. Do not use alert() for debugging. It coerces datatypes. Use `console.log()` or `console.dir()` – Rory McCrossan May 19 '22 at 08:19
  • @RoryMcCrossan Hi I have added my HTTP header details, Could you please check that too ? – wisdom_seeker May 19 '22 at 16:01
  • You've set `Access-Control-Allow-Origin: http://b.com` that needs to be `a.com` - you set the CORS header to the domains ***allowed*** to access the resource. – Rory McCrossan May 19 '22 at 16:17

0 Answers0