JasperReports 库自定义可视化未正确呈现 UTF8 组件答案

【问题标题】：JasperReports Library Custom Visualization not rendering properly UTF8 componentsJasperReports 库自定义可视化未正确呈现 UTF8 组件
【发布时间】：2021-08-09 00:27:19
【问题描述】：

我正在使用 JasperReports 库从自定义 Java 应用程序生成 pdf。但是，当在自定义可视化组件中呈现 € 符号时，生成的 pdf 会显示一个 � 符号（PhantomJs 和 Chromium 都会发生这种情况）。尽管使用相同的字体，但报告中的其余 € 符号（TextFields）仍会正确显示在所有这些中。

另一方面，如果使用 PhantomJs 从 JasperStudio 呈现相同的报告，则会显示正确的符号。

我已经检查了传递给 chrome 的 html 文件，因为它临时存储在 temp 文件夹中，并且似乎以 UTF-8 正确编码（见下文），所以我认为这可能是与字体文件有关的问题jasper 提供给 Chrome 或 PhantomJs。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>

<head>
  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
  <link rel="stylesheet" type="text/css" href="jr_script_3615012621213017572_feeRenderer.css" title="Style">
  <script src="jr_res_12941692111646429500_require.js"></script>
  <script src="jr_res_14211739430443032080_cv-component_static.js"></script>
  <script src="jr_res_10307871901394985341_feeRenderer.min.js"></script>
</head>

<body>
  <div id="element423553011047886097313196921978673211730" class="jr_cvc_element" style="width: 389px; height: 290px;" />
  <script class="jasperreports">
    require(["cv-component"], function(Comp) {
      new Comp({
        "id": "element423553011047886097313196921978673211730",
        "renderer": "d3Circle",
        "instanceData": {
          "series": [
            [{
              "Currency_symbol": "€",
              "Currency_height": "0.5",
              "Cents_height": "0.25",
              "Separation": "0",
              "Cents": "0",
              "Currency_margin": "0",
              "Units_height": "1",
              "Units": "8",
              "Margin": "0"
            }]
          ],
          "module": "d3Circle",
          "css_uri": "D:\\Dhom\\Documents\\Projects\\Myreport\\Test5\\feeRenderer.css",
          "width": 389,
          "id": "element423553011047886097313196921978673211730",
          "height": 290,
          "script_uri": "D:\\Dhom\\Documents\\Projects\\Myreport\\Test5\\feeRenderer.min.js",
          "animation": false
        }
      });
    });
  </script>
</body>

</html>

以前有人遇到过这个问题吗？

提前致谢

编辑 20/5/2021 11:35：

我已经能够找到发送到 chrome 的 svg 文件，它包含替换字符 (\ufffd) 而不是 € 符号，因此问题似乎发生在 svg 生成阶段：

<?xml version=\"1.0\" encoding=\"UTF-8\" standalone=\"no\"?>
<!DOCTYPE svg PUBLIC \"-//W3C//DTD SVG 1.1//EN\" \"http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd\"><svg xmlns=\ "http://www.w3.org/2000/svg\" id=\ "element66576560284652498011372360525284671058svg\" width=\ "389\" height=\ "240\" style=\ "fill: transparent;\" version=\ "1.1\"><defs><style type=\"text/css\">\nsvg circle { fill: rgb(240, 0, 255); }\n.number-text { fill: white; font-family: arial; }</style></defs><text dominant-baseline=\"hanging\" aligment-baseline=\"hanging\" x=\"389\" y=\"0\" text-anchor=\"end\" class=\"number-text\" style=\"font-size: 60px;\">.95</text><text dominant-baseline=\"hanging\" aligment-baseline=\"hanging\" x=\"305.578125\" y=\"0\" text-anchor=\"end\" class=\"number-text\" style=\"font-size: 240px;\">8</text><text dominant-baseline=\"hanging\" aligment-baseline=\"hanging\" x=\"172.09375\" y=\"0\" text-anchor=\"end\" class=\"number-text\" style=\"font-size: 120px;\">\ufffd</text></svg>

编辑 20/5/2021 13:24：

通过记录包含货币符号的变量，javascript 解释器似乎正在更改它。因此，如果报告导出为 html 并在 Chrome 中打开，它会正确呈现，但是当 javascript 代码被解释为 pdf 报告生成例程的一部分时，解释器无法识别字符并将其更改为 Unicode 替换特点。该变量的记录值显示在 java 程序下面提供的日志中的 10547 行：

3587 [main] DEBUG net.sf.jasperreports.customvisualization.export.ChromeCVElementImageDataProvider  - wrote CV render HTML page to C:\Users\Dhom\AppData\Local\Temp\cv_1203404104433554074.html
3589 [main] DEBUG net.sf.jasperreports.chrome.BrowserService  - page evaluation at file:/C:/Users/Dhom/AppData/Local/Temp/cv_1203404104433554074.html
3595 [main] INFO net.sf.jasperreports.chrome.ChromeInstance  - Launching Chrome instance 1 with configuration executable: D:\Dhom\Documents\Projects\Myreport\Test5\chrome.exe, headless: true, arguments: {}, idle timeout: 900000, live timeout: 7200000
3601 [main] INFO com.github.kklisura.cdt.launch.ChromeLauncher  - Launching chrome process D:\Dhom\Documents\Projects\Myreport\Test5\chrome.exe with arguments {no-first-run=true, remote-debugging-port=0, mute-audio=true, disable-client-side-phishing-detection=true, disable-popup-blocking=true, disable-default-apps=true, disable-extensions=true, metrics-recording-only=true, no-default-browser-check=true, disable-background-timer-throttling=true, disable-translate=true, safebrowsing-disable-auto-update=true, headless=true, hide-scrollbars=true, disable-background-networking=true, disable-prompt-on-repost=true, user-data-dir=C:\Users\Dhom\AppData\Local\Temp\cdt-user-data-dir3328865212396958053, disable-hang-monitor=true, disable-sync=true, disable-gpu=true}
8633 [main] DEBUG net.sf.jasperreports.chrome.ChromeInstanceRepository  - schedule chrome instance 1 idle timeout check after 900000
8635 [main] DEBUG net.sf.jasperreports.chrome.ChromeInstanceRepository  - schedule chrome instance 1 timeout after 7200000
8637 [main] DEBUG net.sf.jasperreports.chrome.ChromeInstance  - using chrome instance 1
9724 [main] DEBUG net.sf.jasperreports.chrome.StandardPageCreator  - created tab 902F248522DDE30E16DE2D3CD552FBD9
10020 [main] DEBUG com.github.kklisura.cdt.services.impl.WebSocketServiceImpl  - Connecting to ws server ws://localhost:1906/devtools/page/902F248522DDE30E16DE2D3CD552FBD9
10350 [Grizzly(1)] INFO com.github.kklisura.cdt.services.impl.WebSocketServiceImpl  - Connected to ws ws://localhost:1906/devtools/page/902F248522DDE30E16DE2D3CD552FBD9
10438 [main] DEBUG com.github.kklisura.cdt.services.impl.WebSocketServiceImpl  - Sending message {"id":1,"method":"Log.enable","params":{}} on ws://localhost:1906/devtools/page/902F248522DDE30E16DE2D3CD552FBD9
10443 [Grizzly(2)] DEBUG com.github.kklisura.cdt.services.impl.WebSocketServiceImpl  - Received message {"id":1,"result":{}} on ws://localhost:1906/devtools/page/902F248522DDE30E16DE2D3CD552FBD9
10462 [main] DEBUG com.github.kklisura.cdt.services.impl.WebSocketServiceImpl  - Sending message {"id":2,"method":"Runtime.enable","params":{}} on ws://localhost:1906/devtools/page/902F248522DDE30E16DE2D3CD552FBD9
10466 [Grizzly(1)] DEBUG com.github.kklisura.cdt.services.impl.WebSocketServiceImpl  - Received message {"method":"Runtime.executionContextCreated","params":{"context":{"id":1,"origin":"://","name":"","uniqueId":"-1037893551376530969.-1504717943394719259","auxData":{"isDefault":true,"type":"default","frameId":"902F248522DDE30E16DE2D3CD552FBD9"}}}} on ws://localhost:1906/devtools/page/902F248522DDE30E16DE2D3CD552FBD9
10467 [Grizzly(1)] DEBUG com.github.kklisura.cdt.services.impl.WebSocketServiceImpl  - Received message {"id":2,"result":{}} on ws://localhost:1906/devtools/page/902F248522DDE30E16DE2D3CD552FBD9
10483 [main] DEBUG com.github.kklisura.cdt.services.impl.WebSocketServiceImpl  - Sending message {"id":3,"method":"Page.enable","params":{}} on ws://localhost:1906/devtools/page/902F248522DDE30E16DE2D3CD552FBD9
10484 [Grizzly(2)] DEBUG com.github.kklisura.cdt.services.impl.WebSocketServiceImpl  - Received message {"id":3,"result":{}} on ws://localhost:1906/devtools/page/902F248522DDE30E16DE2D3CD552FBD9
10486 [main] DEBUG com.github.kklisura.cdt.services.impl.WebSocketServiceImpl  - Sending message {"id":4,"method":"Page.navigate","params":{"url":"file:/C:/Users/Dhom/AppData/Local/Temp/cv_1203404104433554074.html"}} on ws://localhost:1906/devtools/page/902F248522DDE30E16DE2D3CD552FBD9
10489 [Grizzly(1)] DEBUG com.github.kklisura.cdt.services.impl.WebSocketServiceImpl  - Received message {"id":4,"result":{"frameId":"902F248522DDE30E16DE2D3CD552FBD9","loaderId":"82EC151841E6F98D209D3B011A2A2FBF"}} on ws://localhost:1906/devtools/page/902F248522DDE30E16DE2D3CD552FBD9
10490 [Grizzly(2)] DEBUG com.github.kklisura.cdt.services.impl.WebSocketServiceImpl  - Received message {"method":"Page.frameStartedLoading","params":{"frameId":"902F248522DDE30E16DE2D3CD552FBD9"}} on ws://localhost:1906/devtools/page/902F248522DDE30E16DE2D3CD552FBD9
10494 [Grizzly(1)] DEBUG com.github.kklisura.cdt.services.impl.WebSocketServiceImpl  - Received message {"method":"Runtime.executionContextsCleared","params":{}} on ws://localhost:1906/devtools/page/902F248522DDE30E16DE2D3CD552FBD9
10495 [Grizzly(1)] DEBUG com.github.kklisura.cdt.services.impl.WebSocketServiceImpl  - Received message {"method":"Page.frameNavigated","params":{"frame":{"id":"902F248522DDE30E16DE2D3CD552FBD9","loaderId":"82EC151841E6F98D209D3B011A2A2FBF","url":"file:///C:/Users/Dhom/AppData/Local/Temp/cv_1203404104433554074.html","domainAndRegistry":"","securityOrigin":"file://","mimeType":"text/html","adFrameType":"none","secureContextType":"Secure","crossOriginIsolatedContextType":"NotIsolated","gatedAPIFeatures":["SharedArrayBuffers","SharedArrayBuffersTransferAllowed"]}}} on ws://localhost:1906/devtools/page/902F248522DDE30E16DE2D3CD552FBD9
10497 [Grizzly(2)] DEBUG com.github.kklisura.cdt.services.impl.WebSocketServiceImpl  - Received message {"method":"Runtime.executionContextCreated","params":{"context":{"id":2,"origin":"file://","name":"","uniqueId":"-4551564477363548089.1093106506060346497","auxData":{"isDefault":true,"type":"default","frameId":"902F248522DDE30E16DE2D3CD552FBD9"}}}} on ws://localhost:1906/devtools/page/902F248522DDE30E16DE2D3CD552FBD9
10497 [main] DEBUG net.sf.jasperreports.chrome.BrowserService  - waiting for result, timeout 60000
10514 [Grizzly(1)] DEBUG com.github.kklisura.cdt.services.impl.WebSocketServiceImpl  - Received message {"method":"Page.loadEventFired","params":{"timestamp":247828.898653}} on ws://localhost:1906/devtools/page/902F248522DDE30E16DE2D3CD552FBD9
10515 [Grizzly(1)] DEBUG com.github.kklisura.cdt.services.impl.WebSocketServiceImpl  - Received message {"method":"Page.frameStoppedLoading","params":{"frameId":"902F248522DDE30E16DE2D3CD552FBD9"}} on ws://localhost:1906/devtools/page/902F248522DDE30E16DE2D3CD552FBD9
10516 [Grizzly(2)] DEBUG com.github.kklisura.cdt.services.impl.WebSocketServiceImpl  - Received message {"method":"Page.domContentEventFired","params":{"timestamp":247828.898826}} on ws://localhost:1906/devtools/page/902F248522DDE30E16DE2D3CD552FBD9
10521 [pool-1-thread-1] DEBUG com.github.kklisura.cdt.services.impl.WebSocketServiceImpl  - Sending message {"id":5,"method":"Runtime.evaluate","params":{"expression":"renderResult(true)"}} on ws://localhost:1906/devtools/page/902F248522DDE30E16DE2D3CD552FBD9
10522 [Grizzly(1)] DEBUG com.github.kklisura.cdt.services.impl.WebSocketServiceImpl  - Received message {"id":5,"result":{"result":{"type":"object","subtype":"promise","className":"Promise","description":"Promise","objectId":"-3590625203254494070.2.1"}}} on ws://localhost:1906/devtools/page/902F248522DDE30E16DE2D3CD552FBD9
10547 [Grizzly(2)] DEBUG com.github.kklisura.cdt.services.impl.WebSocketServiceImpl  - Received message {"method":"Runtime.consoleAPICalled","params":{"type":"log","args":[{"type":"string","value":"\ufffd"}],"executionContextId":2,"timestamp":1.621509394264413e+12,"stackTrace":{"callFrames":[{"functionName":"","scriptId":"6","url":"file:///C:/Users/Dhom/AppData/Local/Temp/jr_res_8667172309765663436_feeRenderer.min.js","lineNumber":4,"columnNumber":19892},{"functionName":"","scriptId":"4","url":"file:///C:/Users/Dhom/AppData/Local/Temp/jr_res_8570279741294855884_cv-component_static.js","lineNumber":47,"columnNumber":16},{"functionName":"execCb","scriptId":"3","url":"file:///C:/Users/Dhom/AppData/Local/Temp/jr_res_8609129502099932916_require.js","lineNumber":1695,"columnNumber":32},{"functionName":"check","scriptId":"3","url":"file:///C:/Users/Dhom/AppData/Local/Temp/jr_res_8609129502099932916_require.js","lineNumber":882,"columnNumber":50},{"functionName":"enable","scriptId":"3","url":"file:///C:/Users/Dhom/AppData/Local/Temp/jr_res_8609129502099932916_require.js","lineNumber":1175,"columnNumber":21},{"functionName":"init","scriptId":"3","url":"file:///C:/Users/Dhom/AppData/Local/Temp/jr_res_8609129502099932916_require.js","lineNumber":787,"columnNumber":25},{"functionName":"","scriptId":"3","url":"file:///C:/Users/Dhom/AppData/Local/Temp/jr_res_8609129502099932916_require.js","lineNumber":1459,"columnNumber":35}]}}} on ws://localhost:1906/devtools/page/902F248522DDE30E16DE2D3CD552FBD9
10552 [pool-1-thread-1] DEBUG com.github.kklisura.cdt.services.impl.WebSocketServiceImpl  - Sending message {"id":6,"method":"Runtime.awaitPromise","params":{"returnByValue":true,"generatePreview":false,"promiseObjectId":"-3590625203254494070.2.1"}} on ws://localhost:1906/devtools/page/902F248522DDE30E16DE2D3CD552FBD9
10574 [Grizzly(1)] DEBUG com.github.kklisura.cdt.services.impl.WebSocketServiceImpl  - Received message {"id":6,"result":{"result":{"type":"string","value":"<?xml version=\"1.0\" encoding=\"UTF-8\" standalone=\"no\"?><!DOCTYPE svg PUBLIC \"-//W3C//DTD SVG 1.1//EN\" \"http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd\"><svg xmlns=\"http://www.w3.org/2000/svg\" id=\"element1445529659355478804511607219085981653206svg\" width=\"389\" height=\"240\" style=\"fill: transparent;\" version=\"1.1\"><defs><style type=\"text/css\">\nsvg circle { fill: rgb(240, 0, 255); }\n.fee-text { fill: white; font-family: arial; }</style></defs><text dominant-baseline=\"hanging\" aligment-baseline=\"hanging\" x=\"389\" y=\"0\" text-anchor=\"end\" class=\"fee-text\" style=\"font-size: 60px;\">.95</text><text dominant-baseline=\"hanging\" aligment-baseline=\"hanging\" x=\"305.578125\" y=\"0\" text-anchor=\"end\" class=\"fee-text\" style=\"font-size: 240px;\">8</text><text dominant-baseline=\"hanging\" aligment-baseline=\"hanging\" x=\"172.09375\" y=\"0\" text-anchor=\"end\" class=\"fee-text\" style=\"font-size: 120px;\">\ufffd</text></svg>"}}} on ws://localhost:1906/devtools/page/902F248522DDE30E16DE2D3CD552FBD9
10577 [main] INFO com.github.kklisura.cdt.services.impl.WebSocketServiceImpl  - Web socket connection closed NORMAL_CLOSURE,
10581 [pool-1-thread-1] DEBUG net.sf.jasperreports.chrome.BrowserService  - Page console LOG: ?

【问题讨论】：

你可以试试用html编码€ ?
使用 &euro 只会导致生成的 pdf 文件中显示文本“&euro”，因为我使用的是 d3.js，并且它不允许在 svg 元素中包含 html 元素。但是，我不确定是否可以使用该 html 编码与 RaphaelJs 等其他库或仅使用纯 javascript 来解决此问题，或者这是由于 jasper 生成的文件需要是一个svg 组件（我的问题中显示的网页是由 jasper 自动生成的，因此我无法修改它）
可能是字体问题，你能看看这个jasperstarter.cenote.de/unicode-pdf-export.html stackoverflow.com/questions/40402377/…。要查看第一个是否有效，请将字体更改为 DejaVu Sans
最初我想到了这一点，但在 CVC 组件的情况下它只是失败了（在报告的文本字段中，符号被正确呈现，并且 CVC 和那些文本都使用 Arial，它是 Unicode 字体）。此外，符号的 Unicode 代码在将其传递给 Chrome 之前已被更改，因此它似乎与使用的字体无关（请参阅编辑）。我也尝试过使用其他字体，但问题仍然存在

标签： javascript jasper-reports

【解决方案1】：

这个问题最终导致 Jasper Reports Library 最高版本 6.17 中的一个错误，原因是未正确设置 Chrome 和 Jasper 之间的通信流以使用 UTF-8（请参阅 https://github.com/TIBCOSoftware/jasperreports/issues/189#issuecomment-845341796 和 @ 987654322@)。因此使用了JVM默认的字符编码，使用部分字符会导致数据损坏。

解决方法 1： 找到原因的 Jasper Reports 维护者（github 用户 dadza）建议了一种解决方法来解决它，直到发布更正的版本，包括通过在运行程序时添加以下选项来设置正确的字符编码：-Dfile.encoding=UTF-8

解决方法 2： 根据https://stackoverflow.com/a/14987992/15974273 的说法，在某些 JVM 版本中，可以在运行时使用肮脏的 hack 更改默认字符编码。虽然强烈不推荐使用它，但在主程序中添加以下代码行可能会使这些符号正确呈现（根据某些 cmets 可能需要关闭安全管理器）提供此解决方案的原始答案）：

System.setProperty("file.encoding","UTF-8");
Field charset = Charset.class.getDeclaredField("defaultCharset");
charset.setAccessible(true);
charset.set(null,null);

【讨论】：