# Custom Visualization request /resposne

**URL:** <https://discuss.elastic.co/t/custom-visualization-request-resposne/195617>\
**Category:** Kibana\
**Created:** [August 17, 2019, 7:16pm UTC](https://discuss.elastic.co/t/custom-visualization-request-resposne/195617 "2019-08-17T19:16:11Z")\
**Posts on this page:** 5\
**Page:** 1

<div class="post-metadata">

**Author:** ![adityaPsl](https://avatars.discourse-cdn.com/v4/letter/a/e47c2d/32.png) [@adityaPsl](https://discuss.elastic.co/u/adityaPsl)\
**Post date:** [August 17, 2019, 7:16pm UTC](https://discuss.elastic.co/t/custom-visualization-request-resposne/195617/1 "2019-08-17T19:16:11Z")

</div>

Hello Team,

I was able to create custom visualization (react visualization) , however i want to execute custom GET /POST requests from the visualization.  
I tried to set httpClient from app.js something similar to custom Kibana plugin

```
const { httpClient } = this.props;
httpClient.get

```

. but i m getting httpClinet or $http s undefined.

```
backend.js:1 TypeError: Cannot read property 'get' of undefined

```

Could you please help me understand how can i execute http GET/POST requests from VisualizationController or react component .

Thank you for your help and support.  
Aditya

---

<div class="post-metadata">

**Author:** ![Larry\_Gregory](https://sea2.discourse-cdn.com/elastic/user_avatar/discuss.elastic.co/larry_gregory/32/34969_2.png) [@Larry\_Gregory](https://discuss.elastic.co/u/Larry_Gregory)\
**Post date:** [August 19, 2019, 12:40pm UTC](https://discuss.elastic.co/t/custom-visualization-request-resposne/195617/2 "2019-08-19T12:40:29Z")

</div>

Hey @adityaPsl,

You can use `kfetch` to execute GET/POST requests as needed:

```auto
import { kfetch } from 'ui/kfetch';

const response = await kfetch({
    pathname: '/api/my-custom-endpoint',
    method: 'POST',
    body: JSON.stringify({ prop1: true, prop2: 'foo' }),
});

```

---

<div class="post-metadata">

**Author:** ![adityaPsl](https://avatars.discourse-cdn.com/v4/letter/a/e47c2d/32.png) [@adityaPsl](https://discuss.elastic.co/u/adityaPsl)\
**Post date:** [August 19, 2019, 6:20pm UTC](https://discuss.elastic.co/t/custom-visualization-request-resposne/195617/3 "2019-08-19T18:20:27Z")

</div>

Thank you very much Larry\_Gregory,  
I will try to implement this.  
Only one query , here `pathname` is the path we define in `server.route` function right

Thank you,  
Aditya

---

<div class="post-metadata">

**Author:** ![adityaPsl](https://avatars.discourse-cdn.com/v4/letter/a/e47c2d/32.png) [@adityaPsl](https://discuss.elastic.co/u/adityaPsl)\
**Post date:** [September 8, 2019, 3:00am UTC](https://discuss.elastic.co/t/custom-visualization-request-resposne/195617/4 "2019-09-08T03:00:22Z")

</div>

Hello Larry\_Gregory,

Sorry for the delay. kfetch worked for me. only thing is that i had to wrap the kefetch inside async function.

```
(async () => {
		const response = await kfetch({
			pathname:'../api/sample_react_vis/example',
			method: 'POST',

		  });

```

Thank you,  
Aditya

---

<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:** [October 6, 2019, 3:00am UTC](https://discuss.elastic.co/t/custom-visualization-request-resposne/195617/5 "2019-10-06T03:00:26Z")

</div>

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