Reactivesearch proxylike backend with cookie authentication

Question

I have a spring backend which i'm accessing my Elastic search cluster through by a proxylike endpoint. The request has to be authorized with a cookie.

I'm currently using searchkit with supports authenticating requests through the withCredentials flag. Is there a similar option for reactivesearch or is there any other solution for authorizing the request with a cookie?

I could add: the backend exposes a swagger client which runs on a different domain than my frontend client. This client "owns" the cookie and thus i cannot read the cookie from my frontend client

score 1 · Answer 1 · answered Aug 07 '18 at 13:51

1

You can use the headers prop in ReactiveBase to pass custom headers along with the requests. Link to docs. Since there is no withCredentials you could read the cookies and set in custom headers to verify the requests at the proxy middleware.

<ReactiveBase
  ...
  headers={{
      customheader: 'abcxyz'
  }}
>
    <Component1 .. />
    <Component2 .. />
</ReactiveBase>

Here is a sample proxy server but its in NodeJS

answered Aug 07 '18 at 13:51

Divyanshu Maithani

13,908
2
36
47

Thanks for your answer. I've seen the section about the custom headers and played around with it with no progress. The problem with reading the cookie is that my backend exposes a swagger client which i use and runs on another domain than my frontend client - thus unables reading the cookie from the frontend client. – Timothy Lawler Aug 08 '18 at 06:23
You could perhaps use `document.cookie` to read the cookies and send via `headers` prop and then set these at the proxy server. – Divyanshu Maithani Aug 08 '18 at 06:33
It's not possible to read cookies housed on a different domain [source](https://stackoverflow.com/questions/36318866/reading-a-cookie-from-a-different-domain) – Timothy Lawler Aug 08 '18 at 07:43
Right, seems like this has to be added at the library level, created an issue here https://github.com/appbaseio/appbase-js/issues/42 :) – Divyanshu Maithani Aug 08 '18 at 08:36
I might have found a solution to this. will await with answering my question till i can confirm it works. So far the solution is to hijack on the beforeSend prop and return credentials: 'include' on root level of the request – Timothy Lawler Aug 08 '18 at 09:04

score 1 · Accepted Answer · answered Aug 08 '18 at 12:27

Okey so it turns out, Reactivesearch uses fetch and fetch wants credentials: 'include' for cookie authentication. This may not be placed in the headers that Reactivesearch supplies and must be placed on the root object for the request.

It's possible to do this by implementing beforeSend on ReactiveBase.

const Base = ({ children }) => {
  const onBeforeSend = props => {
    return {
      ...props,
      credentials: 'include',
    }
  }

  return (
    <ReactiveBase
      app="app-name"
      url="url"
      beforeSend={onBeforeSend}
    >
      {children}
    </ReactiveBase>
  )
}

Reactivesearch proxylike backend with cookie authentication

2 Answers2