0

Estoy intentando subir archivos al servidor, enviándolos con axios. En el título aclaro que uso Vuetify, pues la etiqueta de formulario es un v-form y no un form como lo es "convencionalmente". Estuve indagando en foros anglosajones y encontré una posible respuesta:

axios.post(this.$store.state.ruta + 'recepcionAreasConocimiento.php', {actualizarAreaConocimiento: true, icono: this.editedItem.icono_area}, {headers: { 'Content-Type': 'multipart/form-data' }}).then(response => {

    console.log(response.data);

});

Pero, en la consola, me muestra lo siguiente:

Muestra del error en consola.

Esto es lo que tengo en el servidor (PHP):

Cómo recibo el dato en el lado del servidor.

Quisiera saber porqué da ese error y cómo podría enviar el archivo (independiente de su extensión) con axios, junto a los demás datos del formulario.

De antemano, agradezco la ayuda.

1
  • Por favor, todo el código (incluido mensajes de error y advertencias) debe ir en formato texto. Saludos el 19 dic. 2020 a las 16:36

1 respuesta 1

1

Lo que puedes usar para enviar el archivo y llegue al servidor es por medio de FormData, ya que si enviar un archivo por medio de una estructura json, este no lo interpreta bien y cuando lo tratar de parsear, el contenido.

Para usar FormData y enviarlo al servidor seria de la siguiente forma:

// Envió de información al servidor

const form = new FormData();
form.append('actualizarAreaConocimiento', true);
form.append('icono', this.editedItem.icono_area); // encapsula el archivo

axios.post(this.$store.state.ruta + 'recepcionAreasConocimiento.php', form, {headers: { 'Content-Type': 'multipart/form-data' }}).then(response => {
    console.log(response.data);
});

Ya en servidor lo recibiría como si de un form html se tratara.

if ($_SERVE['REQUEST_METHOD'] == 'POST'){
   $c = new controladorAreaConocimiento();
   if (isset($_POST['actualizarAreaConocimiento']) && actualizarAreaConocimiento == true ){
      $file = $_FILE['icono'] // ya podrías manejar el archivo normalmente
   }
}

Así podrías enviar el archivo, como comente al inicio, al enviar un archivo dentro de un json, el servidor no lo interpreta bien y al decodificarlo este se pierde y causa errores.

5
  • Lo había intentado antes. Gracias, pero ahora, con esas líneas, me aparece este error: <br /> <b>Warning</b>: extract() expects parameter 1 to be array, null given in <b>C:\xampp\htdocs\redtt_sistema\recepcion\recepcionAreasConocimiento.php</b> on line <b>16</b><br /> <script type="text/javascript"> window.close(); </script>
    – Saco04
    el 19 dic. 2020 a las 16:11
  • 1
    Quité el exctract y simplemente ignoraba el if, como si el $_POST['actualizarAreaConocimiento'] no existiera.
    – Saco04
    el 19 dic. 2020 a las 16:12
  • Justo después del $_POST = json_decode(file_get_contents("php://input"), true); he puesto var_dump($_POST) y me devolvió NULL.
    – Saco04
    el 19 dic. 2020 a las 16:19
  • como ya no envias un json, al hacer el decode de file_get_contents("php://input"), este retorna vacío, puedes ver lo que te envía si hacer un var_dump al file_get_contents("php://input") directamente sin usar el decode y no guardándolo en el $_POST.
    – tecnobyte
    el 19 dic. 2020 a las 16:28
  • Vale. Ahora sí. Muchísimas gracias. Califico tu respuesta.
    – Saco04
    el 19 dic. 2020 a las 16:36

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.