Laravel + Vue.js - 下载的 docx 文件已损坏

Question

我的项目使用 Laravel 10.x 和 Vue.js 3.x 以及 PHPWord 包。我想下载生成的 docx 文件。下载成功，但我无法打开该文件 - 它已损坏。

我尝试添加 ob_end_clean() ，因为在许多有关从 Laraval 存储下载损坏文件的问题和答案中都提到了它，但问题并未解决。 我还使用 scp 下载了生成的文件，并且它没有损坏。所以问题显然出在响应中的某个地方，而不是使用模板和保存文件。

Vue.js

const getFile = async () => {
   try {
      let response = await axios.get('api/docx', { responseType: 'blob' });
      let blob = new Blob([response.data]);
      let link = document.createElement('a');
      link.href = window.URL.createObjectURL(blob);
      link.download = 'test.docx';
      document.body.appendChild(link);
      link.click();
   } catch (e) {
      alert(e);
   }
}

拉拉维尔

public function getFile() {
   $doc = new TemplateProcessor(storage_path() . '/app/public/test_template.docx');
   $doc->setValue('random_text', 'Foo');
   $doc->saveAs(storage_path() . '/app/public/test.docx');
   
   ob_end_clean();
   $headers = array('Content-Type: application/vnd.openxmlformats-officedocument.wordprocessingml.document');
   return response()->download(storage_path() . '/app/public/test.docx', 'test.docx', $headers);
}

Answer 1

    $writer = \PhpOffice\PhpWord\IOFactory::createWriter($this->word, 'Word2007');

    $fileName = 'example.docx';

    $response = new StreamedResponse(
        fn() => $writer->save('php://output')
    );

    $response->headers->set('Content-Type', 'application/vnd.openxmlformats-officedocument.wordprocessingml.document');
    $response->headers->set('Content-Disposition', 'attachment;filename="' . $fileName .'"');
    $response->headers->set('Cache-Control','max-age=0');
    $response->headers->set('Content-Description','File Transfer');

    return $response;