Saludos tengo un inconveniente con Laravel, quiero enviar un archivo excel desde mi componente realizado en Vuejs. Deseo Importar este archivo de aprox 5Mb copn 36 registros a una tabla. Estoy usando la libreria LaravelExcel V.3, Estoy usando multipart/form-data en mi formulario y mi ruta son del tipo POST con la libreria axios. Agradezco sus respuestas y aportes.
Mi Componente - FrontEnd
<div class="body">
<form method="post" enctype="multipart/form-data">
<input
type="file"
id="file"
ref="fileupload"
class="form-control-file"
@change="onChanged"
accept=".csv, application/vnd.openxmlformats-officedocument.spreadsheetml.sheet, application/vnd.ms-excel"
>
<br>
<button
class="btn btn-success"
@click="importaexcel()">
Importar Catalogo
</button>
</form>
</div>
Mi componente - Vuejs
<script>
export default {
data(){
return{
archivo:''
}
},
methods:{
onChanged: function(event){
this.archivo = event.target.files[0];
},
importaexcel: function(){
let me = this;
let datos = this.archivo
var formData = this.toformData(datos);
axios.post(
this.ruta+"/actualizacatalogo",
formData,
{
"content-type": "multipart/form-data"
}
.then(Response =>{
alert('ok subio')
}).catch( error =>{
console.log('Tenemos errores:'+error)
})
);
},
toformData(obj){
var formData = new FormData()
for(var key in obj){
formData.append(key,obj[key])
}
return formData
}
}
}
</script>
Mis Ruta Post en Laravel
//Medicamentos (Catalogo)
Route::post('/actualizacatalogo','MedicamentoController@importarexcel');
Mi Controlador
public function importarexcel(Request $request)
{
Excel::import(new MedicamentoImport(),$request->file('file'));
return back();
}
axios.post(this.ruta+"/actualizacatalogo", formData).then(...).catch(...);
. Y no necesitas configurar el content-type, pero no creo que eso sea importante.this.ruta
que le agregas a la url que le pasas a axios. Viendo tu ruta de LaravelRoute::post('/actualizacatalogo','MedicamentoController@importarexcel');
, esta llamada axios debería funcionaraxios.post('/actualizacatalogo', formData).then(function (response) { console.log(response); alert('ok subio'); }).catch(function (error) { console.log(error); });
tal cual como está en la documentación