0

Подскажите пожалуйста, как скачать excel-файла, который берется по api ссылке. само api написано на laravel, а библиотека для создания excel файла maatwebsite/excel. Если ссылку вставлять сразу в браузер, то файл скачивается, как надо и с правильным содержимым. "Погуглив", много где предлагают решение такого вида(используя blob):

 fetch("http://localhost:7777/api/v1/organizations/export", {
            responseType: "blob",
            method: "GET",
            headers: { "Content-Type": "application/vnd.ms-excel" }
        }).then(response => {
            const url = window.URL.createObjectURL(new Blob([response.data]));
            const link = document.createElement("a");
            link.href = url;
            link.setAttribute("download", "template.xls");
            document.body.appendChild(link);
            link.click();
        });

Но если это делаю через fetch, то файл пустой(не знаю почему). Смотрел в консоле: response.data - undefined. А сам response выглядит так:

Response
   body: ReadableStream { locked: false }
   bodyUsed: false
   headers: Headers {  }
   ok: true
   redirected: false
   status: 200
   statusText: "OK"
   type: "basic"
   url: "http://localhost:7777/api/v1/organizations/export"

Контроллер на laravel выглядит так:

class OrganizationsExportController extends Controller
{
    public function export()
    {
        return (new OrganizationsExport)->download('organizations_export.xls');
    }
}

А таблица "рисуется" тут с нужными параметрами:

class OrganizationsExport implements FromCollection, ShouldAutoSize, WithEvents, WithMapping, WithHeadings
{
    use Exportable;
    /**
     * @return \Illuminate\Support\Collection
     */
    public function collection()
    {
        return ScheduledInspectionModel::all();
    }

    private $count = 0;

    public function map($organizations): array
    {
        return [
            ++$this->count,
            $organizations->name_smp,
            $organizations->name_control,
            $organizations->verification_start . ' - ' . $organizations->verification_end,
            $organizations->verification_duration,
        ];
    }

    public function headings(): array
    {
        return [
            '№',
            'Проверяемый СМП',
            'Контролирующий орган',
            'Период плановой проверки',
            'Плановая длительность',
        ];
    }

    public function registerEvents(): array
    {
        return [
            AfterSheet::class => function (AfterSheet $event) {
                $event->sheet->getStyle('A1:F1')->applyFromArray([
                    'font' => [
                        'bold' => true
                    ]
                ]);
            }
        ];
    }
}

1 ответ 1

0

Еще раз погуглив, понял что крутится все вокруг этого new Blob(). И сделал вот так:

const exportDataToFile = async () => {
    try {
        await fetch("http://localhost:7777/api/v1/organizations/export")
            .then(response => {
                if ((response.ok === true) & (response.status === 200)) {
                    return response.blob();
                }
            })
            .then(data => {
                const url = window.URL.createObjectURL(data);
                const link = document.createElement("a");
                link.href = url;
                link.setAttribute("download", "organizations_export.xls");
                document.body.appendChild(link);
                link.click();
                document.body.removeChild(link);
            });
    } catch (error) {
        console.log(error);
    }
};

ps: exportDataToFile ф-я которая просто вешается на клик кнопки.

Так же, а может и проще было воспользоваться библиотекой file-saver, но мне было интересно знать почему у меня самого не получалось.

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.