Java/JS 中的字符编码问题，字段中带有“é”字符答案

【问题标题】：Character encoding issue in Java/JS with the 'é' character in a fieldJava/JS 中的字符编码问题，字段中带有“é”字符
【发布时间】：2021-02-22 14:10:19
【问题描述】：

数据库 (Postgresql) 有一个表，其中有一列名为 streetaddress1 (varchar(50))，其中条目为 'Amelié'

用户界面（React/JS）：

var streetAddress1 = event.target[1].value;

if (valProductDescription && valModelNumber && valAssemblyNumber && valName) {
      url = url + "&streetAddress=" + streetAddress1 + " " + streetAddress2;

<div>
          <Modal
            isOpen={openCfcOverlay}
            style={customStyles}
            contentLabel="modal"
                <div>
                  <Input
                    errorMessage='Please enter a valid Street Address'
                    error={cfcDeclaration.companyAddress1Error}
                    title="Street Address"
                    type="text"
                    name="Street Address"
                    value={typeof selectedCompany == 'undefined' ? "" : selectedCompany.streetAddress1}
                    disabled='edit'
                  />

然后在 index.template.html 文件中，我都尝试了

<!DOCTYPE html>
<html lang="en">
  <head>
    <title>Home</title>
    <meta charset="utf-8">

和

<!DOCTYPE html>
<html lang="en">
  <head>
    <title>Home</title>
    <meta charset="utf-16">

在后端（JAVA）：

public CompanyRequest(JSONObject jsonObject)
        this.streetAddress1 = (String) jsonObject.get("streetAddress1");
        this.streetAddress2 = (String) jsonObject.get("streetAddress2");

此“街道地址”字段将出现在允许下载 pdf 的弹出窗口中。在这里，名字“Amelié”将显示为

public void generatePdf(String filePath, List<CfcRequest> cfcRequestList, String companyName, String streetAddress) throws IOException {
        Document document = new Document(PageSize.A4, 36, 36, 36, 72);
        try {
            PdfWriter writer = PdfWriter.getInstance(document, new FileOutputStream(filePath));

            document.open();
            if (image != null) {
                Image img = Image.getInstance(image, null);
                img.setAbsolutePosition(36f, 775f);
                img.scaleToFit(150, 40);
                document.add(img);
            }
            String modifiedRegionAddress = "";
            String country = "";
            boolean zipcodeAdded = false;
            String[] address = regionAddress.split(" ");
            for (int i = 0; i < address.length; i ++) {
                if (!zipcodeAdded) {
                    try {
                        Integer.parseInt(address[i]);
                        zipcodeAdded = true;
                    } catch(NumberFormatException e) {}

                    modifiedRegionAddress += address[i] + " ";
                } else {
                    country += address[i] + " ";
                }
            }
            Paragraph header = new Paragraph("PDF Download", headerFont);
            header.setAlignment(Element.ALIGN_CENTER);
            header.setSpacingAfter(20);
            document.add(header);


            // Date and additional stuff
            DateFormat df = new SimpleDateFormat("MM/dd/yy");
            Date dateobj = new Date();
            PdfPTable basicInfoTable = new PdfPTable(new float[]{3, 2});
            PdfPCell dateTitleCell = new PdfPCell(new Paragraph("Date Issued:", tableHeaderFont));
            PdfPCell dateCell = new PdfPCell(new Paragraph(df.format(dateobj), titleFont));
            PdfPCell authorizedCell = new PdfPCell(new Paragraph("Authorized Signature:", tableHeaderFont));
            PdfPCell companyNameCell = new PdfPCell(new Paragraph(companyName, titleFont));
            PdfPCell streetAddressCell = new PdfPCell(new Paragraph(streetAddress, titleFont));
            PdfPCell regionAddressCell = new PdfPCell(new Paragraph(modifiedRegionAddress, titleFont));
            PdfPCell countryAddressCell = new PdfPCell(new Paragraph(country, titleFont));
            PdfPCell emptyCell = new PdfPCell();
            emptyCell.setBorder(Rectangle.NO_BORDER);
            dateTitleCell.setBorder(Rectangle.NO_BORDER);
            dateCell.setBorder(Rectangle.NO_BORDER);
            authorizedCell.setBorder(Rectangle.NO_BORDER);
            companyNameCell.setBorder(Rectangle.NO_BORDER);
            streetAddressCell.setBorder(Rectangle.NO_BORDER);
            regionAddressCell.setBorder(Rectangle.NO_BORDER);
            countryAddressCell.setBorder(Rectangle.NO_BORDER);
            basicInfoTable.addCell(dateTitleCell);
            basicInfoTable.addCell(authorizedCell);
            basicInfoTable.addCell(dateCell);
            basicInfoTable.addCell(emptyCell);
            basicInfoTable.addCell(companyNameCell);
            basicInfoTable.addCell(emptyCell);
            basicInfoTable.addCell(streetAddressCell);
            basicInfoTable.addCell(emptyCell);
            basicInfoTable.addCell(regionAddressCell);
            basicInfoTable.addCell(emptyCell);
            basicInfoTable.addCell(countryAddressCell);
            basicInfoTable.addCell(emptyCell);

            document.add(bodyTop);
            document.add(reachTable);
            document.add(bodyBottom);
            final int FIRST_ROW = 0;
            final int LAST_ROW = -1;
            //Table must have absolute width set.
            if (basicInfoTable.getTotalWidth() == 0)
                basicInfoTable.setTotalWidth((document.right() - document.left()) * basicInfoTable.getWidthPercentage() / 100f);
            basicInfoTable.writeSelectedRows(FIRST_ROW, LAST_ROW, document.left(), document.bottom() + basicInfoTable.getTotalHeight(), writer.getDirectContent());
            document.close();
            writer.close();
        } catch (DocumentException e) {
            e.printStackTrace();
        } catch (FileNotFoundException e) {
            e.printStackTrace();
        }
}

这是 utf-8/utf-16 的问题吗？为什么“é”字符在最后一张图片的字段中显示不正确？我该如何解决？是后端更改还是 UI 更改？

【问题讨论】：

标签： javascript java reactjs encoding

【解决方案1】：

PostgreSQL 中模板数据库的默认编码设置为 SQL_ASCII。在检索该信息之前，您是否将其更改为 utf8？

【讨论】：

如果你的回答比问你如何做会更有用