score:1
here is the documentation about the file upload it can help you https://strapi.io/documentation/3.x.x/guides/upload.html#file-upload.
so first you have to create your book
entry without your image.
and then you have to upload your files and set the entry you want to link.
so it will be 2 request for that.
here is an example https://strapi.io/documentation/3.x.x/guides/upload.html#examples we link an image to an existing article.
score:1
took a while to work out but here's how i did it:
const submitupload = e => {
e.preventdefault();
const formdata = new formdata(e.target);
axios.post("http://localhost:1337/images", {})
.then(res => {
console.log(res);
formdata.append('refid', res.data.id);
axios.post(`http://localhost:1337/upload`, formdata, {
headers: { 'content-type': 'multipart/form-data' },
})
.then(res => {
console.log(res);
})
.catch(err => {
console.log(err);
});
})
.catch(err => {
console.log(err);
});
}
return (
<form id='form' onsubmit={e => submitupload(e)}>
<input type="file" name="files" />
<input type="text" name="ref" value="image" />
<input type="text" name="field" value="image" />
<input type="submit" value="submit" />
</form>
)
the ref
and refid
input values' meanings are given here https://strapi.io/documentation/3.x.x/guides/upload.html#examples.
Source: stackoverflow.com
Related Query
- Error 500 Upload image to strapi with Axios
- Upload Image and indicating response in a table with axios and JavaScript
- react node passing file through axios with multer error 500
- React Hooks and Axios Image Upload with Multer
- Upload Image with Axios Post request
- axios POST request to strapi image upload [Internal Server Error]
- Uploading image to Strapi /upload with axios and React
- append image with form data using axios patch giving error
- Link upload image with content with strapi api in reactjs
- AXIOS post method with image returning 500 (Internal Server Error)
- How to upload image with Strapi and FormData.append
- ReactJS: How to handle Image / File upload with Formik?
- Catch return json from POST with Axios when error 400 (Bad Request) occurs
- How to solve TypeScript error with axios response in React app
- react with Rails 5, getting CSRF error for post with axios
- Issues while uploading an image to firebase storage with Antd upload action
- Axios - Uncaught (in promise) Error: Request failed with status code 500
- Get axios Response object when error occurred with Redux Saga
- Preview image upload with React Functions
- How to send image to server with Blob type using Axios in React Native?
- how to upload image or pdf file with form-data in react-native?
- CKEditor 5 image upload error in React Js
- ASP.Core Uploading image with Axios
- Error 413 payload too large when upload image
- Not able to upload Image with ImageField in EDIT mode for react-admin
- Handling multiple image upload with React JS & Laravel
- Change file name in React-Dropzone image upload with cloudinary
- Axios mock adapter giving error 'Error: Request failed with status code 404'
- upload an image with a token to a fastAPI route using POST from reactJS
- Upload Multiple Image in React using axios
More Query from same tag
- How to set state after data fetch complete in React
- How to implement multi role based authorization in React
- If condition to change route using React Router V4
- Trouble passing props to imported component
- Display Links from text in react
- React-leaflet LayersControl throws error when moving code into function
- removing value from array not working NEXT.JS
- React.PropType with two possible shapes
- Why does the setTimeOut not being cleared by using clean up function in React (useEffect)?
- useState array and async scope lookup
- How to change nested object value inside of an array in JavaScript?
- Unable to require component conditionally inside another
- Code from react-dnd docs
- TypeError: Cannot read property 'map' of undefined - how to access an array in a local json API
- How to use use-supercluster with Typescript
- Redux returning an empty arrays in store - Reducer not working correctly?
- How to quickly navigate to Redux reducer from an Action in WebStorm?
- Display multiple dynamic input fields in react, based on a changing state variable?
- Deploy production build of ReactJS with Node express as backend
- Node.js & Express: How to create many app.get calls with Express.js through "for loop"?
- How to create a JS object and append it to an array
- Handling authentication in Relay Modern
- Cannot get Typeahead value
- React Error - Cannot read property 'state' of undefined
- Why does react-table Column not accept a function as accessor?
- Approaches for using RTK-Query hooks inside functions?
- React component not rendering on with latest version
- TypeError: Cannot read properties of undefined (reading 'map')( Existing solution dint help)
- Custom Labels for Pie Charts in React
- React performance: bind vs anonymous function