Estoy tratando de enviar imágenes desde mi formulario a mi servicio web php. Por ahora, solo estoy tratando de ver si lo recibo bien.
y con este código:
html:
<input type="file" multiple name="images" id="images" /> <button class="bouton" id="valider">envoi</button>js:
const sample_image = document.getElementById('images'); const valider = document.getElementById('valider'); valider.addEventListener('click', () => { upload_image(sample_image.files[0]); }) const upload_image = (file) => { const form_data = new FormData(); form_data.append('sample_image', file); console.log(form_data); fetch(host+"add.php", { method: "POST", body:form_data }).then(response => response.json()) .then(response => { console.log(response); }); }PHP:
echo json_encode($_FILES['sample_image']);Está funcionando pero solo para 1 imagen, pero necesito enviar muchas.
y cuando trato de cambiar mi JS a:
upload_image(sample_image.files);(sin el [0]) no funciona.
Solo quería enviar una serie de archivos y luego usarlos en mi php, pero dice
Aviso: índice indefinido: muestra_imagen
¿Existe una manera de hacerlo?
Gracias.
está trabajando con:
const upload_image = (files) => { const form_data = new FormData(); let compt = files.length; for(let i=0;i<compt;i++) { form_data.append('sample_images[]', files[i]); } console.log(files.length); console.log(form_data); fetch(host+"add.php", { method: "POST", body:form_data }).then(response => response.json()) .then(response => { console.log(response); }); }gracias a todos !
Debe cambiar FormData para recibir una matriz en lugar de un solo elemento:
const upload_image = (files) => { const form_data = new FormData(); form_data.append('sample_images[]', files); console.log(form_data); fetch(host+"add.php", { method: "POST", body:form_data }).then(response => response.json()) .then(response => { console.log(response); }); }