Chinese characters showing as "?" question mark

Freee4U

To check the CKEditor configuration and ensure server-side processing scripts handle UTF-8 properly, follow these steps:

—

1. Identify the Server-Side Processing Script

CKEditor sends its data to a server-side script for saving content (e.g., in a database or file). Common file names might be:

save.php
upload.php
processor.php

Check your application’s routes or backend logic to identify the script handling the form submission.

—

2. Review the Server-Side Script

Open the script responsible for processing CKEditor data. Look for how the data is:

Retrieved:
Ensure the script retrieves data as UTF-8:
```
   $content = $_POST['content'];
```
Stored:
- When saving data to the database, ensure the connection uses utf8mb4. For example:
```
     $mysqli->set_charset("utf8mb4");
```
Handled:
- If you’re using htmlspecialchars() or similar functions, specify the charset:
```
     htmlspecialchars($content, ENT_QUOTES, 'UTF-8');
```

—

3. Ensure UTF-8 in Form Submission

CKEditor data is usually submitted as part of a form. Ensure the form uses UTF-8 encoding by checking the <form> tag for:

<form method="post" action="your_script.php" accept-charset="UTF-8">

—

4. Verify CKEditor Configuration

In your CKEditor setup, ensure it’s not interfering with character encoding. Check the JavaScript configuration:

ClassicEditor
    .create(document.querySelector('#editor'), {
        toolbar: ['heading', '|', 'bold', 'italic', 'link', 'save']
    })
    .then(editor => {
        console.log('Editor initialized:', editor);
    })
    .catch(err => {
        console.error(err.stack);
    });

The editor itself doesn’t typically change encoding but ensure the backend script can properly process the posted data.

—

5. Debug the Workflow

Use debugging tools to trace data from the client-side to the server-side:

Client-Side:
Open the browser’s Developer Tools (Network tab) and inspect the form submission payload. Ensure Chinese characters are being sent correctly (not garbled or replaced by ?).
Server-Side:
Add debug statements to log the received data:
```
  error_log($content);
```

—

6. Test Saving and Retrieving Data

Enter Chinese characters in CKEditor and save them.
Retrieve and display the data in a test script:
```
  echo $storedContent;
```

If Chinese characters display correctly during saving and retrieval, the CKEditor configuration and server-side processing are working as expected.

—

7. Check the Database

If Chinese characters are stored as ?, the issue lies in the database configuration. Ensure the table and column are set to utf8mb4:

ALTER TABLE table_name MODIFY column_name TEXT CHARACTER SET utf8mb4 COLLATE utf8mb4_unicode_ci;

—

8. Summary

Ensure CKEditor sends data with UTF-8 (most likely the default).
Verify the server-side script processes and saves data as UTF-8.
Confirm the database connection and table configuration are set to utf8mb4.
Test and debug using logging and browser developer tools.