我正在尝试使用表单将图像文件上传到CDN。我可以让它工作使用获取API，但我不想这样做的客户端。下面的方法似乎是正确的，但似乎不起作用。

export async function action({request}: ActionArgs) {
    const body = await request.formData();

    await fetch(`${API}/${body.get("fileName")}`, {
        method: 'PUT',
        body: body.get("file"),
        headers: {}
    }).then((response) => response.json());

    return json({});
}

export default function UploadImage() {
    const fetcher = useFetcher();
    
    const handleChange = async (e: any) => {
        const file = e.target.files[0];
        const fileData = new FormData();

        fileData.append('file', file);
        fileData.append('fileName', file.name);

        fetcher.submit(
            fileData,
            { method: 'POST' }
        );
    }

    return (
        <>
            <input type="file" onChange={handleChange} />
        </>
    );
}

我知道我应该使用unstableMultipartFormData，但文档没有解释如何编写上传处理程序的情况下，你会想上传文件到CDN。我发现的例子和教程似乎已经过时了，使用的是不再工作的旧版本。我甚至不确定上传者期望的参数或行为。
任何帮助将不胜感激！