Logging into Kibana from a React page using /api/security/v1/login

[Sannj (Sanjana Badam)]

Hi,
We are trying to log into an embedded dashboard in a react page using the '/api/security/v1/login' API. The API works properly and sets the 'sid' cookie but, the browser is not able to use it because the 'httpOnly' flag set to true. We have a work around where we submit a hidden form the timing is off and login doesn't actually happen automatically unless the page is refreshed.

Any thoughts on how to make auto-login work using the API?

[weltenwort (Felix Stürmer)]

Hi @Sannj,

that is definitely a problematic area of Kibana in combination with X-Pack. Usually we recommend one of two approaches:

• Use a reverse proxy for accessing the dashboards that injects an Authorization header.
• Use an ajax request before loading the iframes, which calls the API with the Authorization header to have the cookie set in the browser session.

From your description it sounds like you already tried the second approach. Could you elaborate what you mean by "the browser is not able to use it"?

[samphibian (Sam)]

Hi @weltenwort,
When we make the request (I'm on a team with @Sannj ), the browser shows that the cookie has been set. However, the iframe doesn't login and we can't see the cookie in the response. When we look at the set-cookie object, it has the httpOnly flag set to true, which we've been informed is probably what is stopping our auto-login.

[samphibian (Sam)]

Here is the response we log:

In the browser, this is what we see when we look at the network response:

We have tried it with the username/password in the body and with the Authorization header, both of which gave the same response.

[weltenwort (Felix Stürmer)]

I was able to get the cookie to be set in the browser session via a xhr request like the following:

fetch("https://HOSTNAME/api/security/v1/login", {
  body: JSON.stringify({
    username: "USERNAME",
    password:"PASSWORD",
  }),
  credentials: 'include',
  headers: {
    "kbn-version": "5.5.1",
  },
  method: "POST",
})

Depending on the location where the page running the JavaScript is served from, you might have to adjust the CORS settings of Kibana. Note the credentials: 'include' setting of the request, which was crucial for getting the browser to persist the sid cookie.

[samphibian (Sam)]

@weltenwort

fetch("https://HOSTNAME/api/security/v1/login", {
body: JSON.stringify({
username: "USERNAME",
password:"PASSWORD",
}),
credentials: 'include',
headers: {
"kbn-version": "5.5.1",
},
method: "POST",
})

It worked! Thanks so much