The international conference on the API Platform Framework
The API Platform Conference 2024 is happening soon, and it's close to selling out.
API Platform 4, Caddy web server, Xdebug, AI... Enjoy two days of inspiring talks with our friendly community and our amazing speakers.
If you need to handle the file upload in the server part, please follow the related documentation.
This documentation assumes you have a /media_objects
endpoint accepting multipart/form-data
-encoded data.
To manage the upload in the admin part, you need to customize the create form or the edit form.
Add a FileInput as a child of the guesser. For example, for the create form:
import {
HydraAdmin,
ResourceGuesser,
CreateGuesser,
} from "@api-platform/admin";
import { FileField, FileInput } from "react-admin";
const MediaObjectsCreate = props => (
<CreateGuesser {...props}>
<FileInput source="file">
<FileField source="src" title="title" />
</FileInput>
</CreateGuesser>
);
export default () => (
<HydraAdmin entrypoint="https://demo.api-platform.com">
<ResourceGuesser name="media_objects" create={MediaObjectsCreate} />
{/* ... */}
</HydraAdmin>
);
And that’s it!
The guessers are able to detect that you have used a FileInput
and are passing this information to the data provider, through a hasFileField
field in the extraInformation
object, itself in the data.
If you are using the Hydra data provider, it uses a multipart/form-data
request instead of a JSON-LD one.
In the case of the EditGuesser
, the HTTP method used also becomes a POST
instead of a PUT
, to prevent a PHP bug.
You can also help us improve the documentation of this page.
Made with love by
Les-Tilleuls.coop can help you design and develop your APIs and web projects, and train your teams in API Platform, Symfony, Next.js, Kubernetes and a wide range of other technologies.
Learn more