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

**URL:** https://discuss.elastic.co/t/logging-into-kibana-from-a-react-page-using-api-security-v1-login/95018
**Category:** Kibana
**Created:** [July 28, 2017, 10:09pm UTC](https://discuss.elastic.co/t/logging-into-kibana-from-a-react-page-using-api-security-v1-login/95018 "2017-07-28T22:09:24Z")
**Posts on this page:** 7
**Page:** 1

<div class="post-metadata">

### Author: ![Sannj](https://avatars.discourse-cdn.com/v4/letter/s/f475e1/32.png) [@Sannj](https://discuss.elastic.co/u/Sannj)
#### Post date: [July 28, 2017, 10:09pm UTC](https://discuss.elastic.co/t/logging-into-kibana-from-a-react-page-using-api-security-v1-login/95018/1 "2017-07-28T22:09:24Z")

</div>

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?

---

<div class="post-metadata">

### Author: ![weltenwort](https://sea2.discourse-cdn.com/elastic/user_avatar/discuss.elastic.co/weltenwort/32/53885_2.png) [@weltenwort](https://discuss.elastic.co/u/weltenwort)
#### Post date: [July 31, 2017, 2:02pm UTC](https://discuss.elastic.co/t/logging-into-kibana-from-a-react-page-using-api-security-v1-login/95018/2 "2017-07-31T14:02:47Z")

</div>

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"?

---

<div class="post-metadata">

### Author: ![samphibian](https://avatars.discourse-cdn.com/v4/letter/s/96bed5/32.png) [@samphibian](https://discuss.elastic.co/u/samphibian)
#### Post date: [July 31, 2017, 4:33pm UTC](https://discuss.elastic.co/t/logging-into-kibana-from-a-react-page-using-api-security-v1-login/95018/3 "2017-07-31T16:33:10Z")

</div>

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.

---

<div class="post-metadata">

### Author: ![samphibian](https://avatars.discourse-cdn.com/v4/letter/s/96bed5/32.png) [@samphibian](https://discuss.elastic.co/u/samphibian)
#### Post date: [July 31, 2017, 6:29pm UTC](https://discuss.elastic.co/t/logging-into-kibana-from-a-react-page-using-api-security-v1-login/95018/4 "2017-07-31T18:29:52Z")

</div>

Here is the response we log:

 ![52 AM](https://us1.discourse-cdn.com/elastic/original/3X/6/1/616202499936b02275c7ea92580cf1d613a220b4.png)

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

 ![13 AM](https://us1.discourse-cdn.com/elastic/original/3X/3/e/3e390cf1e03a33eb6ea169ece8c2a15f069ad3e0.png)

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

---

<div class="post-metadata">

### Author: ![weltenwort](https://sea2.discourse-cdn.com/elastic/user_avatar/discuss.elastic.co/weltenwort/32/53885_2.png) [@weltenwort](https://discuss.elastic.co/u/weltenwort)
#### Post date: [August 1, 2017, 9:13am UTC](https://discuss.elastic.co/t/logging-into-kibana-from-a-react-page-using-api-security-v1-login/95018/5 "2017-08-01T09:13:58Z")

</div>

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

```javascript
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.

---

<div class="post-metadata">

### Author: ![samphibian](https://avatars.discourse-cdn.com/v4/letter/s/96bed5/32.png) [@samphibian](https://discuss.elastic.co/u/samphibian)
#### Post date: [August 4, 2017, 7:07pm UTC](https://discuss.elastic.co/t/logging-into-kibana-from-a-react-page-using-api-security-v1-login/95018/6 "2017-08-04T19:07:14Z")

</div>

> [@weltenwort](#):
>
> fetch("[https://HOSTNAME/api/security/v1/login](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

---

<div class="post-metadata">

### Author: ![system](https://us1.discourse-cdn.com/elastic/original/3X/1/a/1ac57faf039f6b580b3f104ef42a2a89e41014de.png) [@system](https://discuss.elastic.co/u/system)
#### Post date: [September 1, 2017, 7:07pm UTC](https://discuss.elastic.co/t/logging-into-kibana-from-a-react-page-using-api-security-v1-login/95018/7 "2017-09-01T19:07:18Z")

</div>

This topic was automatically closed 28 days after the last reply. New replies are no longer allowed.
