fetch to API ("/on_srcfile_changed")

[bobgus39]

api_name: /on_srcfile_changed

import { client } from "@gradio/client";

const response_0 = await fetch("undefined");
const exampleFile = await response_0.blob();
						
const app = await client("http://127.0.0.1:7860/");
const result = await app.predict("/on_srcfile_changed", [
				exampleFile, 	// blob in 'Source File(s)' File component
	]);

console.log(result.data);

Accepts 1 parameter:
[0] undefined Required

The input value that is provided in the "Source File(s)" File component.

Returns list of 2 elements
[0] undefined

The output value that appears in the "Detected faces" Gallery component.

[1] undefined

The output value that appears in the "Input faces" Gallery component.

I tried with React+Vite but it doesn't work

import { client } from "@gradio/client";

async function handlePredictClick() {
  try {
    const response_0 = await fetch("https://i.ibb.co/rQwXzgk/image7.png");
    const exampleFile = await response_0.blob();

    const app = await client("http://127.0.0.1:7860/");
const result = await app.predict("/on_srcfile_changed", [
				exampleFile, 	// blob in 'Source File(s)' File component
	]);

console.log(result.data);
 } catch (error) {
    console.error("Error fetching prediction:", error);
  }
}

function OnSrcFile() {
  return (
    <div>
      <button onClick={handlePredictClick}>Predict</button>
    </div>
  );
}

export default OnSrcFile;

OnSrcFile.jsx:34 Error fetching prediction:
{type: 'status', endpoint: '/on_srcfile_changed', fn_index: 4, time: Thu Apr 18 2024 11:12:10 GMT+0200 (hora de verano de Europa central), queue: true, …}
code
:
undefined
endpoint
:
"/on_srcfile_changed"
fn_index
:
4
message
:
"1 validation error for ListFiles\n Input should be a valid list [type=list_type, input_value={}, input_type=dict]\n For further information visit https://errors.pydantic.dev/2.6/v/list_type"
queue
:
true
stage
:
"error"
success
:
false
time
:
Thu Apr 18 2024 11:12:10 GMT+0200 (hora de verano de Europa central) {}
type
:
"status"
[[Prototype]]
:
Object

Error on Terminal

Traceback (most recent call last):
File "C:\Users\agus7\Desktop\roopUnleashed\roopUnleashed\installer\installer_files\env\lib\site-packages\gradio\queueing.py", line 527, in process_events
response = await route_utils.call_process_api(
File "C:\Users\agus7\Desktop\roopUnleashed\roopUnleashed\installer\installer_files\env\lib\site-packages\gradio\route_utils.py", line 261, in call_process_api
output = await app.get_blocks().process_api(
File "C:\Users\agus7\Desktop\roopUnleashed\roopUnleashed\installer\installer_files\env\lib\site-packages\gradio\blocks.py", line 1782, in process_api
inputs = await self.preprocess_data(
File "C:\Users\agus7\Desktop\roopUnleashed\roopUnleashed\installer\installer_files\env\lib\site-packages\gradio\blocks.py", line 1503, in preprocess_data
inputs_cached = block.data_model(root=inputs_cached) # type: ignore
File "C:\Users\agus7\Desktop\roopUnleashed\roopUnleashed\installer\installer_files\env\lib\site-packages\pydantic\root_model.py", line 73, in init
self.pydantic_validator.validate_python(root, self_instance=self)
pydantic_core._pydantic_core.ValidationError: 1 validation error for ListFiles
Input should be a valid list [type=list_type, input_value={}, input_type=dict]
For further information visit https://errors.pydantic.dev/2.6/v/list_type

How can I do a well fetch to API?

Thank you all in advance!

[bobgus39]

maybe, do I have to do a formData??