在最新版本的 html2canvas 中，我遇到了阿拉伯语被错误地呈现为不可读的混乱的问题

Question

错误报告：

我正在使用 bootstrap 4 和 Angular 11，尽管这个问题似乎与软件包直接相关，而不是与其中任何一个相关，但我已经尝试过：

• 将 css text-align 更改为 left、right 和 center
• 将 中的 lang 更改为 ar 并将编码设置为 utf-8
• 将 css direction 更改为 ltr 和 rtl

这是 HTML：

<div class="container-fluid">
    <div class="row">
        <div class="col-md-12">
            <div id="text_card" class="card p-5">

                <h1  >السلام عليكم</h1>
            
            </div>
        </div>
        <div class="row my-3">
            <div class="col-md-12">
                <div class="btn btn-primary" (click)="saveTable()">تخزين</div>
            </div>
        </div>
    </div>

    <div class="row">
        <div class="col-12">
            <div class="card">
                <div id="display_card">
                    
                </div>
            </div>
        </div>
    </div>
</div>

这是我写的打印方法：

  saveTable() {
    html2canvas(document.querySelector("#text_card"))
      .then(canvas => {
        document.querySelector("#display_card").appendChild(canvas);
      });
  }

规格：

• html2canvas 版本测试使用：html2canvas 1.0.0-rc.7
• 浏览器和版本：Chrome 版本 86.0.4240.198 和 Firefox 81.0（64 位）
• 操作系统：Windows 10

Answer 1

我在版本 1.4.1 中遇到了同样的问题，并通过使用修复了它

letter-spacing: normal;

在包装元素中