# Client Js Failed to fetch file (gradio api)

**URL:** </static-proxy?url=https%3A%2F%2Fdiscuss.huggingface.co%2Ft%2Fclient-js-failed-to-fetch-file-gradio-api%2F111196%3E%5C
**Category:** Intermediate\
**Created:** [October 10, 2024, 1:52pm UTC](/static-proxy?url=https%3A%2F%2Fdiscuss.huggingface.co%2Ft%2Fclient-js-failed-to-fetch-file-gradio-api%2F111196 "2024-10-10T13:52:21Z")\
**Posts on this page:** 2\
**Page:** 1

<div class="post-metadata">

**Author:** ![harshs0ni](https://avatars.discourse-cdn.com/v4/letter/h/839c29/32.png) [@harshs0ni](/static-proxy?url=https%3A%2F%2Fdiscuss.huggingface.co%2Fu%2Fharshs0ni)%5C
**Post date:** [October 10, 2024, 1:52pm UTC](/static-proxy?url=https%3A%2F%2Fdiscuss.huggingface.co%2Ft%2Fclient-js-failed-to-fetch-file-gradio-api%2F111196%2F1 "2024-10-10T13:52:21Z")

</div>

Im Using Gradio Api on react web app and when i fetch some data and file it responds with failed to fetch  
(im new please let me know if you need anything)

```auto
      const response_0 = await fetch(fileLocation);
      const exampleFile = await response_0.blob();
      const client = await Client.connect("http://127.0.0.1:7860/");
      const result = await client.predict("/predict", {
        input_text: notesText,
        sum_style: sumStyle,
        sum_length: sumLen,
        op: sumFile,
        location: exampleFile,

```

---

<div class="post-metadata">

**Author:** ![John6666](https://sea2.discourse-cdn.com/hellohellohello/user_avatar/discuss.huggingface.co/john6666/32/27664_2.png) [@John6666](/static-proxy?url=https%3A%2F%2Fdiscuss.huggingface.co%2Fu%2FJohn6666)%5C
**Post date:** [October 11, 2024, 4:13am UTC](/static-proxy?url=https%3A%2F%2Fdiscuss.huggingface.co%2Ft%2Fclient-js-failed-to-fetch-file-gradio-api%2F111196%2F2 "2024-10-11T04:13:18Z")

</div>

I don’t know much JavaScript, but let’s follow the sample first. Also, you may be able to fix the port problem by changing README.md.

> [@How to use Gradio API](/static-proxy?url=https%3A%2F%2Fdiscuss.huggingface.co%2Ft%2Fhow-to-use-gradio-api%2F47108%2F6)%3A
>
> While the documentation is WIP, you can’t find a bit more info here and here

> **[Gradio Javascript Client Docs](https://www.gradio.app/docs/js-client)**
>
> Make programmatic requests to Gradio applications in JavaScript (TypeScript) from the browser or server-side.

> **[Spaces Configuration Reference](https://huggingface.co/docs/hub/spaces-config-reference)**
>
> We’re on a journey to advance and democratize artificial intelligence through open source and open science.

> **[What are JavaScript Fetch Errors & How Can You Resolve Them? ](https://noibu.com/blog/what-are-javascript-fetch-errors-and-how-can-you-resolve-them/)**
>
> In this blog post, we break down JavaScript fetch errors, their impact, why they are caused, and how you can resolve them.