Question

我的项目中遇到了一个新问题。我想通过pdfmake创建一个pdf文件。我关注this tutorial并且一切正常，除了'＆amp;'的“转型”标志。在我的'var docDefinition'中，我从mysql数据库获取内容。有一些企业名称带有'＆amp;' - 签到它。如果我在php中调用企业名称，则会正确显示“＆amp;” - 符号。但是在javascript中并通过转换为base64，生成的pdf中只显示“ampersand”。其他标志如'ö'，'ä'等正确显示。有什么想法吗？

###更新

以下是我的代码'generatePDF.blade.php'的片段：

@section('scripts')
<script type="text/javascript">
  ...
  // Create the PDF
    var docDefinition = {
        pageSize: 'A4',
        pageOrientation: 'portrait',
        ...
        content: [
          { text: 'Ausführende Firma: '},
          '{{ $report->user->enterprise->enterprise_name }}',
          ...
        ],
      };

然后是教程中的内容： //将pdf保存为base64字符串 var pdfstr; 尝试{ pdfMake.createPdf（docDefinition）.getDataUrl（function（result）{ pdfstr =结果; console.log（'结果：'+ pdfstr）;

    var pdfAsArray = convertDataURIToBinary(pdfstr);
    console.log('Array: ' + pdfAsArray);

    PDFJS.getDocument(pdfAsArray).then(function getPdf(pdf) {
        console.log('pdf var: ' + pdf.getPage(1));
      //
      // Fetch the first page
      //
      pdf.getPage(1).then(function getPdfPage(page) {
        var scale = 1;
        var viewport = page.getViewport(scale);
        //
        // Prepare canvas using PDF page dimensions
        //
        var canvas = $("#pdfviewer").get(0);
        var context = canvas.getContext('2d');

        // Check device pixel ratio and then if the browser is doubleing them
                    console.log('Pixelratio is', window.devicePixelRatio);
                    console.log('The browser is doubleing the pixels:', context.webkitBackingStorePixelRatio);

                    var factor = 1;

                    if (window.devicePixelRatio >= 2 && context.webkitBackingStorePixelRatio < 2 || context.webkitBackingStorePixelRatio == undefined) {
                        factor = 2;
                    }

        //canvas.height = viewport.height*factor;
        //canvas.width = viewport.width*factor;

        canvas.setAttribute('width', viewport.width*factor);
        canvas.setAttribute('height', viewport.height*factor);
        // context.scale(factor, factor);
        context.transform(devicePixelRatio,0,0,devicePixelRatio,0,0);

        //
        // Render PDF page into canvas context
        //
        var renderContext = {
          canvasContext: context,
          viewport: viewport,
        };


        page.render(renderContext);
        // $('#containerPDFViewer').modal({ backdrop: 'static' }); //disable backdrop so user need to make choice
      });
    });
    });
    }
    catch (e) {
    throw e;
    }

    var BASE64_MARKER = ';base64,';
    function convertDataURIToBinary(dataURI) {
    var base64Index = dataURI.indexOf(BASE64_MARKER) + BASE64_MARKER.length;
    var base64 = dataURI.substring(base64Index);
    var raw = window.atob(base64);
    var rawLength = raw.length;
    var array = new Uint8Array(new ArrayBuffer(rawLength));

    for (var i = 0; i < rawLength; i++) {
      array[i] = raw.charCodeAt(i);
      // array[i] = raw.codePointAt(i);
    }

    return array;
    }

###更新2

我发现，我的问题与javascript部分有关，但与我正在使用的laravel框架有关。我很抱歉没有告诉你，我只是忘了。因此，当我在我的刀片视图（UTF-8）中从mySQL获取数据时，一切都很好。但如果我不是在纯刀片中做同样的事情而是在javascript中我的错误发生。所以我通过dd（$ myvar-＆gt;值）检查;所以我可以看到，'$' - 符号没有转换，而是“＆符号（$ amp;）”。我该如何解决刀片问题呢？

Answer 1

好的，现在我找到了解决问题的答案： DB中的某些表的归类为utf8_general_ci，但在laravel /app/config/database.php中有'collation' => 'utf8mb4_unicode_ci'。因此解决方案是将表更改为该排序规则，然后通过{!! $myvar->field !!}和woooosh从刀片中的DB调用值，一切正常！

＆安培;到＆amp;在base64 + Javascript中

1 个答案: