DOMException：使用html2pdf js创建PDF时无法阅读

Question

这真令人沮丧，为什么我无法弄清在Edge上渲染时“无法读取”的原因。但是在谷歌浏览器上，它可以正常工作。错误“读取失败，语法错误”未指出错误所在的位置。现在，我正在使用Laravel 5.8，Fetch API，html2pdf.js，

我有一些代码供您参考：

create_new_order.blade.php

//call API to upload the pdf using base64 data
        function fetchPDF(pdfAsString, file_name, dt){        
            let headers = {};
            headers['X-Requested-With'] = "XMLHttpRequest";

            var data = new FormData();
            data.append('pdf_name', file_name);
            data.append('output', pdfAsString);

            fetch("{{ secure_url('/admin/invoices/upload') }}", {
                headers: headers,
                method: "POST",
                body: data,
                credentials: "same-origin"
            }).then((res) => {
                if(res.status !== 200){
                    hideLoadingIcon();
                    showErrorModal('Alert', 'Failed to create Invoice PDF', 'error');
                }

                return res.json();
            }).then((data) => {
                if(data.errors.length !== 0){
                    hideLoadingIcon();
                    showErrorModal('Alert', 'Failed to upload Invoice PDF', 'error');
                }

                if(dqs('.js-action').value === 'quote'){
                    fetchOrderQuoteSave(dt.order.id);
                }

                else if(dqs('.js-action').value === 'checkout'){                            
                    fetchSendNewProjectNotifs(dt.order.id);
                }

            }).catch((errors) => {
                hideLoadingIcon();
                showErrorModal('Alert', 'Failed to upload Invoice PDF', 'error');
                console.log(errors);
            });
        }

        /************************************************************/

        <?php
            $config = new Config();

            $merchant = new \App\Classes\Merchant();

            $merchantInfo = $merchant->getInfo();
        ?>

        function generateInvoicePDF(data){
            pdf_name = data.invoice.invoice_number + '.pdf';

            console.log('Generating PDF');

            var pdf = new jsPDF('p','pt','letter');

            var opt = {
              margin:       [ 0.5, 0.5, 1, 0.5 ],
              filename:     pdf_name,
              image:        { type: 'jpeg', quality: 1 },
              html2canvas:  { scale: 1 },
              pagebreak:    { mode: 'css'},
              jsPDF:        { unit: 'in', format: 'letter', orientation: 'portrait' }
            };

            source = data.html_invoice;

            //var html_pdf = html2pdf().set(opt).from(source);

            var html_pdf = html2pdf().from(source).set(opt).toPdf().get('pdf').then(function (pdf) {
              var totalPages = pdf.internal.getNumberOfPages();

              for (i = 1; i <= totalPages; i++) {   
                var footer_text = ["{{ $merchantInfo['business_name'] }}", "{{ $merchantInfo['address'] }}, {{ $merchantInfo['city'] }} {{ $merchantInfo['postal_code'] }} {{ $merchantInfo['country_code'] }}", "+{{ $merchantInfo['phone_country_code'] }}{{ $merchantInfo['phone'] }}"];
                var footer_text_number = ["", "", 'Page ' + i + ' of ' + totalPages];

                pdf.setPage(i);
                pdf.setFontSize(10);
                pdf.setTextColor(51,51,51);
                pdf.text(footer_text, 0.5, pdf.internal.pageSize.getHeight() - 0.75);
                pdf.text(footer_text_number, 7.2, pdf.internal.pageSize.getHeight() - 0.75);
              } 

            });

            var output;

            var html_pdf_output = html_pdf.output('datauristring').then((pdfAsString) => {
                // The PDF has been converted to a Data URI string and passed to this function.
                // Use pdfAsString however you like (send as email, etc)! For instance:
                fetchPDF(pdfAsString, pdf_name, data);
            });
        }

PDFController.php

<?php



namespace App\Http\Controllers\Dashboard;



use Illuminate\Http\Request;

use App\Http\Controllers\BaseController as BaseController;



class PDFController extends BaseController
{

//
public function handle(Request $request){

    $pdf_name = $request->input('pdf_name');
    $output = $request->input('output');

    if($pdf_name === null){
        \Log::info('PDF upload error: no pdf name');

        return response()->json([
            'errors' => ['invalid pdf name']
        ]);
    }


    if($output === null){
        \Log::info('PDF upload error: no pdf output');

        return response()->json([
            'errors' => ['invalid pdf output']
        ]);
    }


    list($type, $output) = explode(';', $output);
    list($type, $output) = explode(',', $output);
    $output = base64_decode($output);

    try{            
        file_put_contents(storage_path().'/invoices/'.$pdf_name, $output);
    }catch(\Exception $e){
        \Log::info('PDF upload error: '.$e->getMessage());

         return response()->json([
            'errors' => ['PDF Upload Error, please try again']
        ]);
    }



    return response()->json([
        'message' => 'upload PDF success',
        'errors' => []
    ]);
}
}

Answer 1

这是身份验证问题。这将导致提取API重定向到另一个页面。我只是在我的web.php文件中删除了中间件，然后将响应恢复为正常。