Download file via laravel API in Vue js

 

Method 1: 

<?php

namespace App\Http\Controllers;

use Illuminate\Http\Request;

class PdfController extends Controller

{

    public function index()

    {

        return view('pdf.index');

    }

    public function create()

    {

        $pdf = public_path('pdf/test.pdf');

        return response()->download($pdf);

    }

}

<template>

    <div id="app">

  <button @click="onClick()">DownLoad</button>

</div>

</template>

<script>

    import axios from 'axios'

    export default {

        methods: {

             onClick() {

            axios({

                  url: 'api/downloadPdf',

                  method: 'GET',

                  responseType: 'arraybuffer',

              }).then((response) => {

                   let blob = new Blob([response.data], {

                            type: 'application/pdf'

                        })

                        let link = document.createElement('a')

                        link.href = window.URL.createObjectURL(blob)

                        link.download = 'test.pdf'

                        link.click()

              });

          }

        }

    }

</script>

Method 2: 

Axios.post('api/scope-pdf-download', {arguments}).then(({data})=>{

var url = data.success.file;

var a = document.createElement("a");

a.href = url;

a.setAttribute('download', url.split("/").pop());

document.body.appendChild(a);

a.click();

window.URL.revokeObjectURL(url);

a.remove();

})

.catch(({response}) => {

});

  public function scopePdfDownload(Request $request)

  {

return response()->json(['success' => ['file' => env('APP_URL') . '/files/' . $pdfTitle . '.pdf']], 200);

  }