# API Gradio Spaces error API request failed: 404 {"detail":"Not Found"}

**URL:** <https://discuss.huggingface.co/t/api-gradio-spaces-error-api-request-failed-404-detail-not-found/147053>\
**Category:** Beginners\
**Created:** [March 23, 2025, 2:41pm UTC](https://discuss.huggingface.co/t/api-gradio-spaces-error-api-request-failed-404-detail-not-found/147053 "2025-03-23T14:41:07Z")\
**Posts on this page:** 1\
**Showing post:** 3

<div class="post-metadata">

**Author:** ![trinhminhhieu](https://sea2.discourse-cdn.com/hellohellohello/user_avatar/discuss.huggingface.co/trinhminhhieu/32/43922_2.png) [@trinhminhhieu](https://discuss.huggingface.co/u/trinhminhhieu)\
**Post date:** [March 23, 2025, 3:53pm UTC](https://discuss.huggingface.co/t/api-gradio-spaces-error-api-request-failed-404-detail-not-found/147053/3 "2025-03-23T15:53:19Z")

</div>

Hello here error 404

```auto

Response {
  [Symbol(realm)]: { settingsObject: {} },
  [Symbol(state)]: {
  aborted: false,
  rangeRequested: false,
  timingAllowPassed: false,
  requestIncludesCredentials: false,
  type: 'default',
  status: 404,
  timingInfo: null,
  cacheState: '',
  statusText: 'Not Found',
  headersList: HeadersList {
  [Symbol(headers map)]: Map(12) {
  'access-control-allow-credentials' => 'true',
  'connection' => 'keep-alive',
  'content-length' => '22',
  'content-type' => 'application/json',
  'date' => 'Sun, 23 Mar 2025 15:46:57 GMT',
  'link' => '<https://huggingface.co/spaces/trinhminhhieu/bgnbl>;rel="canonical"', 
  'server' => 'uvicorn',
  'vary' => 'origin, access-control-request-method, access-control-request-headers', 
  'x-proxied-host' => 'http://10.106.9.151',
  'x-proxied-path' => '/run/predict',
},
  [Symbol(headers map sorted)]: null
},
  urlList: [],
  body: {
  stream: <ref *1> ReadableStream {
  _state: 'readable',
  _reader: undefined,
  _storedError: undefined,
  _disturbed: false,
  _readableStreamController: ReadableStreamDefaultController {
  _controlledReadableStream: [Circular *1],
  _queue: S {
  _cursor: 0,
  _size: 0,
  _front: { _elements: [], _next: undefined },
  _back: { _elements: [], _next: undefined }
},
  _queueTotalSize: 0,
  _started: true,
  _closeRequested: false,
  _pullAgain: false,
  _pulling: false,
  _strategySizeAlgorithm: [Function],
  _strategyHWM: 0,
  _pullAlgorithm: [Function],
  _cancelAlgorithm: [Function]
}
},
  source: null,
  length: null
}
},
  [Symbol(headers)]: Headers {
  [Symbol(headers list)]: HeadersList {
  [Symbol(headers map)]: Map(12) {
  'access-control-allow-credentials' => 'true',
  'connection' => 'keep-alive',
  'content-length' => '22',
  'content-type' => 'application/json',
  'date' => 'Sun, 23 Mar 2025 15:46:57 GMT',
  'link' => '<https://huggingface.co/spaces/trinhminhhieu/bgnbl>;rel="canonical"', 
  'server' => 'uvicorn',
  'vary' => 'origin, access-control-request-method, access-control-request-headers', 
  'x-proxied-host' => 'http://10.106.9.151',
  'x-proxied-path' => '/run/predict',

},
  [Symbol(headers map sorted)]: null
},
  [Symbol(guard)]: 'response',
  [Symbol(realm)]: { settingsObject: {} }
}
}
Error: API request failed: 404 {"detail":"Not Found"}

```

here code nextjs api for cloudflare

```auto
/ /api/upload.js
export const runtime = "edge";

export default async function handler(req) {
  // if (req.method !== "POST") {
  // return new Response(JSON.stringify({ error: "Method Not Allowed" }), {
  // status: 405,
  // headers: { "Content-Type": "application/json" },
  // });
  // }

  try {
    // Get form data
    const formData = await req.formData();
    const imageFile = formData.get("image");

    if (!imageFile) {
      return new Response(JSON.stringify({ error: "No file uploaded" }), {
        status: 400,
        headers: { "Content-Type": "application/json" },
      });
    }

    // Convert the File object to ArrayBuffer
    const arrayBuffer = await imageFile.arrayBuffer();

    // Send to HF Space API
    const response = await fetch(
      "https://trinhminhhieu-bgnbl.hf.space/run/predict",
      {
        method: "POST",
        headers: {
          Authorization: `Bearer ${process.env.HF_TOKEN}`,
          "Content-Type": "application/json",
          Accept: "application/json",
        },
        body: arrayBuffer,
      }
    );

    console.log(response);
    if (!response.ok) {
      const errorText = await response.text();
      throw new Error(`API request failed: ${response.status} ${errorText}`);
    }

    const result = await response.json();
    console.log("result", result);

    if (result.error) {
      throw new Error(result.error);
    }

    return new Response(
      JSON.stringify({
        processedImageUrl:
          result.data && result.data[0] ? result.data[0].url : result.url,
      }),
      {
        status: 200,
        headers: { "Content-Type": "application/json" },
      }
    );
  } catch (error) {
    console.error("Error:", error.message);
    return new Response(
      JSON.stringify({
        error: "Failed to process image",
        details: error.message,
      }),
      {
        status: 500,
        headers: { "Content-Type": "application/json" },
      }
    );
  }
}

```

app.py

```auto
with gr.Blocks() as demo:
    gr.Markdown("Background Removal ")
    gr.Markdown("Upload an image to remove the background.")

    with gr.Row():
        input_image = gr.Image(type="pil", label="Upload Image")
        output_image = gr.Image(type="pil", label="Output Image")

    btn = gr.Button("Remove Background")

    btn.click(remove_bg, inputs=input_image, outputs=output_image, concurrency_limit=None)

# demo.queue()
server = demo.launch(share=True)

```

---

_[View the full topic](https://discuss.huggingface.co/t/api-gradio-spaces-error-api-request-failed-404-detail-not-found/147053)._
