File upload to Laravel

aquinch

I want to post an excel file which is on my local drive into a Laravel app. I have tested the Laravel API through Postman and even through excel’s vbs script. So the API doesn’t seem to be the issue. But through Quasar all I get is a Not Updated response from Laravel. I’ve seen a couple of similar queries on this forum where people are having issues with multi-part forms and Quasar, and no answers to those queries. Seems a like a trend…?

Here is my Javascript file:

import Pusher from 'pusher-js'
import { PythonShell } from 'python-shell'
import axios from 'axios'
const FormData = require('form-data')
const fs = require('fs')
const path = require('path')

const options = {
  // mode: 'text',
  // pythonPath: 'path/to/python',
  // pythonOptions: ['-u'], // get print results in real-time
  scriptPath: path.join(__dirname, '/../rpa')
  // args: ['value1', 'value2', 'value3']
}

const exportDir = 'C:\\TEMP\\TFMCH\\'

export const rpa = {
tfmch_LX02 (warehouse, filePath, truncate) {
    console.log('Updating LX02 on TFMCH')
    const URL = 'http://localhost/tfmch_LARAVEL/public/api/' + 'rpa/lx02'
    const formData = new FormData()
    formData.append('lx02', fs.createReadStream(filePath))
    formData.append('truncate', truncate)
    const formConfig = {
      headers: { 'Content-Type': 'multipart/form-data' }
    }
    console.log(URL)
    console.log(fs.createReadStream(filePath))
    // console.log(filePath)
    // console.log(formData)
    // console.log(formConfig)

    axios.post(URL, formData, formConfig)
      .then((response) => {
        console.log(response.data)
        // if (warehouse === 805) {
        //   rpa.sap_LX02_wh(804, false)
        // }
      })
      .catch((e) => {
        console.log(e)
        // console.log('error')
      })
  }
}

And this is my Laravel API:

// import lx02
Route::post('import/lx02', function(Request $request){

    ini_set('max_execution_time', 300);

    // dd($request->lx02);
    // return response()->json($request->lx02); 

    if($request->hasFile('lx02')){

        if ($request->truncate) {
            LX02::query()->truncate();
        }
        
        Excel::import(new LX02Import, request()->file('lx02'));
        
        $config = new Upload;
        $config->table_name = 'LX02';
        $config->save();

        // $deletedRows = lx02::where('sloc', 'LIKE', 'S%')->delete();

        return response()->json("Updated"); 
    }
    return response()->json("Not Updated"); 
});

metalsadman

@aquinch nothing to do with quasar, go to axios docs and see how to properly do it. Also check out this post https://forum.quasar-framework.org/topic/6468/using-qfile-with-laravel-7-example.

aquinch

@metalsadman, thanks for the comment but not very helpful though. I have already done that and that’s why I’m posting a question here. I can’t seem to see the diference from the example you’ve posted to mine - although I would assume there could be one hence the help request.

dobbel

@aquinch try to debug and compare the requests in Laravel send by Postman( works) and Axios(not working). Must be some difference.

Or build your app around the working example… you can figure out later what’s the difference.

The answer will be found in Axios not Quasar…

aquinch

@dobbel, I’ve tried with plain javascript XHR and it also doesn’t work. I’ve used form-data on both tests, so there could be something there.

aquinch

I’ve got it working by using Quasar’s file picker instead of the fs.createReadStream, so that seems to be the issue. But I can’t figure out why it’s not working:

<template>
  <div class="q-pa-md q-gutter-sm">
    <q-btn color="purple" label="IW73" @click='runIW73' />
    <q-btn color="primary" label="LX02" @click='runLX02' />
    <q-file v-model="model" label="Standard" />
    <q-btn color="primary" label="LX02 Upload" @click='lx02Upload' />
  </div>
</template>

<script>
import { rpa } from 'src/scripts/rpa'
import FormData from 'form-data'
const fs = require('fs')

export default {
  name: 'tfmch_updates',
  data () {
    return {
      model: null
    }
  },
  methods: {
    runIW73 () {
      console.log('Running test.py')
      rpa.sap_IW73()
    },
    runLX02 () {
      console.log('Running LX02')
      rpa.sap_LX02()
    },
    lx02Upload () {
      console.log('LX02 Upload')
      const data = new FormData()
      data.append('truncate', 'true')
      data.append('lx02', fs.createReadStream('C:/Users/Ingo/Downloads/LX02_805_2020726_94611.xlsx')) // <- NOT WORKING
      const config = {
        method: 'post',
        url: 'http://localhost/tfmch_LARAVEL/public/api/import/lx02',
        headers: { 'Content-Type': 'multipart/form-data' },
        data: data
      }
      this.$axios(config)
        .then((response) => {
          console.log(JSON.stringify(response.data))
        })
        .catch((error) => {
          console.log(error)
        })
    }
  }
}

</script>

dobbel

@aquinch Good you found a work a round.

Something is wrong with the request. I often use something like
https://postb.in to intercept and debug my requests.

aquinch

@dobbel , I don’t think the issue is on the request but on electron’s access to the file system through the fs library.

dobbel

@aquinch
Then createReadStream should give an error

 let stream = fs.createReadStream(fileName);
 stream.on("error", err => console.log(err));
 data.append('lx02', stream ) // <- NOT WORKING

found that here:
https://www.codota.com/code/javascript/functions/fs/createReadStream

aquinch

I don’t get any errors, but Laravel tells me that the lx02 param is being passed as a String instead of a file object:

      const stream = fs.createReadStream('C:/Users/Ingo/Downloads/LX02_805_2020726_94611.xlsx')
      stream.on('error', err => console.log(err))
      data.append('lx02', stream)

No More Posting New Topics!

File upload to Laravel