How to call external web service from Kibana Plugin?

Elastic Stack Kibana
1

Hi Kibana Team,

I am developing a Kibana plugin. I am trying to make a AJAX call from Kibana Visualization to external web service. Below is my code:

 $.ajax({
     type: "GET",
     url: 'http://localhost/elasticservice',
     headers: {'Content-Type':'application/x-www-form-urlencoded'},
     success: function(result) {
          console.log(result);
     },
     error: function() {
          alert("error");
     },
});

On making this request, I am getting an error:

  XMLHttpRequest cannot load http://localhost/elasticservice/. Request header field kbn-version is not allowed by Access-Control-Allow-Headers in preflight response.

I checked the issue on several links. And from this, I understand that the Kibana is expecting some preflight token which would act as authentication token to use this service.

If so, then how to use preflight in kibana? and if 'NO', then what could be the issue?

2

Kibana uses the kbn-version and kbn-name headers to prevent XSRF attacks.

It looks to me like your webservice hasn't been configured to allow this header. I'm assuming your web service is running on a different port than Kibana, is that correct? If so, you'll have to configure your web service to allow the kbn-version and kbn-name headers.

3

hi @lukas:

Our web service is written in PHP and I have added the kibana headers to the external web-service, below it the code for your reference

<?php
header('access-control-allow-origin: *');
header('HTTP/1.1 200 OK');
header('kbn-name: kibana');
header('kbn-version: 4.4.2');
header('content-type: application/json; charset=UTF-8');
echo "Hello";
?>

And the AJAX response and request headers are as follows:

Response Headers:

HTTP/1.1 200 OK
Date: Wed, 18 May 2016 05:48:06 GMT
Server: Apache/2.4.18 (Unix) OpenSSL/1.0.2g PHP/5.6.19 mod_perl/2.0.8-dev Perl/v5.16.3
X-Powered-By: PHP/5.6.19
access-control-allow-origin: *
kbn-name: kibana
kbn-version: 4.4.2
Content-Length: 5
Keep-Alive: timeout=5, max=100
Connection: Keep-Alive
Content-Type: application/json; charset=UTF-8

Request Headers:

OPTIONS /elasticservice/ HTTP/1.1
Host: localhost
Connection: keep-alive
Access-Control-Request-Method: POST
Origin: http://localhost:5601
User-Agent: Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/49.0.2623.110 Safari/537.36
Access-Control-Request-Headers: accept, content-type, kbn-version
Accept: */*
Referer: http://localhost:5601/app/kibana
Accept-Encoding: gzip, deflate, sdch
Accept-Language: en-US,en;q=0.8,hi;q=0.6

Anything suspicious which you can find here? With reference to your previous comment, I have added kbn-version and kbn-name.

4

You'll want to add the following:

header('access-control-allow-headers: kbn-version, kbn-name');

You can also remove the following:

header('kbn-name: kibana');
header('kbn-version: 4.4.2');

Please let me know if that helps!

1 Like
5

Hi @lukas ,

I checked the same, however I am getting this error:

XMLHttpRequest cannot load http://localhost/elasticservice/. Response to preflight request doesn't pass access control check: The 'Access-Control-Allow-Origin' header contains multiple values 'kbn-name, kbn-version', but only one is allowed. Origin 'http://localhost:5601' is therefore not allowed access.

From, this I understand that I can only allow one Access-Control-Allow-Origin. And the previous code that I had:

header('access-control-allow-origin: *');

I understand that, this will allow any origin to send and receive the data.

6

There are two separate headers that are necessary here: access-control-allow-origin and access-control-allow-headers. You're currently setting access-control-allow-origin but I don't see anywhere you're setting access-control-allow-headers. It should look something like this:

<?php
header('access-control-allow-origin: *');
header('access-control-allow-headers: kbn-version, kbn-name');
header('HTTP/1.1 200 OK');
header('content-type: application/json; charset=UTF-8');
echo "Hello";
?>

Could you give that a try?