Problems with SOAP request. 'Access-Control-Allow-Origin'

I'm having an issue when sending a SOAP request. I've researched this topic and see a lot of posts here and elsewhere on the topic but nothing that has worked for me or that really addresses the issue I'm having. To be more specific on what I'm trying to do, I'm trying to access the API on the BrightSign network. A link to the documentation is here. I've tried running my request through a javascript function on an html page with no luck. I get "no 'Access-Control-Allow-Origin'" errors every time. I had installed a add-on that I saw as a fix to bypass this and although I did not get an Access-Control-Allow-Origin error, I received a 200 code error. My biggest issue with this all is that I have downloaded SoapUI and ran a request through there. When doing so, I received back the expected response! I've tried copy and pasting the raw XML from SoapUI into my test page with no avail. I get the same errors each time. Any help on this would be greatly appreciated.

Thank you

Here is the code of my page that I'm using:

function soap(){
            var xmlhttp = new XMLHttpRequest();
            xmlhttp.open('POST', 'https://api.brightsignnetwork.com/2014/12/SOAP/Basic/', true);

            // build SOAP request
            var sr =
                '<soapenv:Envelope xmlns:soap="https://api.brightsignnetwork.com/2014/12/SOAP/" xmlns:soapenv="http://schemas.xmlsoap.org/soap/envelope/">' +
                    '<soapenv:Header>' +
                        '<wsse:Security soapenv:mustUnderstand="1" xmlns:wsse="http://docs.oasis-open.org/wss/2004/01/oasis-200401-wss-wssecurity-secext-1.0.xsd" xmlns:wsu="http://docs.oasis-open.org/wss/2004/01/oasis-200401-wss-wssecurity-utility-1.0.xsd">' +
                            '<wsse:UsernameToken wsu:Id="UsernameToken-541861B587A894A0A714970165483407">' +
                                '<wsse:Username></wsse:Username>' +
                                '<wsse:Password Type="http://docs.oasis-open.org/wss/2004/01/oasis-200401-wss-username-token-profile-1.0#PasswordText"></wsse:Password>' +
                                '<wsse:Nonce EncodingType="http://docs.oasis-open.org/wss/2004/01/oasis-200401-wss-soap-message-security-1.0#Base64Binary">tlWiCWeD9E8JEaY00RfAhA==</wsse:Nonce>' +
                                '<wsu:Created>2017-06-09T13:55:48.340Z</wsu:Created>' +
                            '</wsse:UsernameToken>' +
                        '</wsse:Security>' +
                    '</soapenv:Header>' +
                    '<soapenv:Body>' +
                        '<soap:GetDynamicPlaylistByName>' +
                            '<soap:name></soap:name>' +
                            '<soap:loadContent></soap:loadContent>' +
                        '</soap:GetDynamicPlaylistByName>' +
                    '</soapenv:Body>' +
                '</soapenv:Envelope>';

        xmlhttp.onreadystatechange = function () {
            if (xmlhttp.readyState == 4) {
                if (xmlhttp.status == 200) {
                    alert('REQUEST SENT. CHECK FOR RESPONSE.');
                }
            }
        }

        // Send the POST request
        xmlhttp.setRequestHeader('Content-Type', 'text/xml');
        xmlhttp.setRequestHeader('Authentication-Type', 'Preemptive');
        xmlhttp.send(sr);
        }

Solution

The BrightSign Network API docs at http://docs.brightsign.biz/display/DOC/BSN+API give no indication that the API is intended to be used from frontend JavaScript code running in a browser.

Given that, it seems that they don’t include the Access-Control-Allow-Origin response header in responses from their API endpoints, and so your browser won’t allow your frontend JavaScript code to access the responses.

https://developer.mozilla.org/en-US/docs/Web/HTTP/Access_control_CORS explains what’s happening here, but the gist of it is that the browser does actually get the response as expected—and if you look in the Network tab of your browser devtools, you can examine the response there.

But just because the browser has the response doesn’t mean it will expose the response to your frontend JavaScript code. Browsers will only expose responses from cross-origin requests to frontend code if the responses include the Access-Control-Allow-Origin response header.

Since the BrightSign Network API doesn’t send that response header, you’re not going to be able to work with that API directly from your frontend code but instead need to either make the requests from your backend code or else set up some kind of proxy and make the requests through that.

The answer at "No 'Access-Control-Allow-Origin' header is present on the requested resource" tells how you can set up a special CORS proxy through which your frontend code could make requests.