Authenticate Spinnaker from application for IFrame

Hi All,
I have an application that has 3 IFrame’s. Each of these IFrames displays a pipline on the Spinnaker dashboard. As it stands, the only way the IFrames can display the pipelines from Spinnaker is by having a new tab with Spinnaker open and logged into.
I’ve been trying to authenticate Spinnaker from my application using a xmlHttpRequest and everytime i’m getting the following error:

“Access to XMLHttpRequest at spinnaker-api. se/login from origin localhost :8585 has been blocked by CORS policy: Request header field access-control-allow-methods is not allowed by Access-Control-Allow-Headers in preflight response.”


“Refused to display spinnaker-api. se/login in a frame because it set ‘X-Frame-Options’ to ‘deny’.”

I think the reason for the second error is because of the first error. Spinnaker blacks CORS on the login page and as a result all 3 IFrames url’s redirect to the login page and display nothing.
Would anyone know anyway around this? Or is it possible to do this any other way? Many thanks in advance. Let me know if any more information is required.

Here is the code with the request:
var xhr = new XMLHttpRequest();
var user = ‘user’;
var pass = ‘pass’;
var url = spinnaker-api. se/login;
var params = ‘username=user&password=pass&submit=Login’;‘POST’, url, true);
xhr.setRequestHeader(“Access-Control-Allow-Credentials”, “true”);
//xhr.setRequestHeader(‘Access-Control-Allow-Headers’,‘x-requested-with, content-type, authorization, X-RateLimit-App, X-Spinnaker-Priority’);
xhr.setRequestHeader(‘Access-Control-Allow-Headers’,‘Access-Control-, Origin, X-Requested-With, Content-Type, Authorization, X-RateLimit-App, X-Spinnaker-Priority’);
xhr.setRequestHeader(“Access-Control-Allow-Methods”, “GET, POST, PUT, DELETE, OPTIONS, HEAD”);
//xhr.setRequestHeader(‘Content-Type’, ‘application/x-www-form-urlencoded’ );
xhr.setRequestHeader(‘Content-Type’, ‘application/x-www-form-urlencoded’ );
xhr.setRequestHeader(‘Accept’, ‘application/x-www-form-urlencoded’);
// xhr.onreadystatechange = function(){
// if(xhr.readyState == 4 && xhr.status == 200){
// console.log(“working”);
// alert(xhr.responseText);
// }
// }
xhr.setRequestHeader(‘Authorization’, 'Basic ’ + btoa(user + ‘:’ + pass));

Sorry about the spaces and stuff with the url’s. This form said because I’m a new user I can post max 2 url’s per post.