Fixing emoji issues on Strapi (v4)

If you have set up your Strapi server to work with a MySQL database, and you try to add emojis into a text, whether in the admin panel or via the API, the CMS will return: Unknown Server Error.

But if you look more closely at Strapi's internal logs, you'll be able to spot an error related to the database:

Error : ER_TRUNCATED_WRONG_VALUE_FOR_FIELD: Incorrect string value: <unicode…>

The problem

In reality, the problem comes neither from Strapi nor from the database, but from what's in between the two: the MySQL client.

By default, this client used to connect to the database uses an encoding and a charset that are incompatible with certain Unicode characters, such as emojis!

But here's how to easily fix this problem.

The solution

If you try to manually change the encoding of your MySQL table, Strapi will still refuse to insert the data.

Or will return "?" instead of each emoji

The lasting solution is actually hidden in your database connector configuration, directly in Strapi's config files.

All you need to do is add the following two attributes to the "config/database.ts" file, like this:

// config/database.ts
export default ({ env }) => {
  return {
  connection: {
    client: 'mysql',
    connection: {
      host: env('MYSQL_HOST'),
      port: env.int('MYSQL_PORT'),
      database: env('MYSQL_DB'),
      user: env('MYSQL_USER'),
      password: env('MYSQL_PASSWORD'),
      ssl: env.bool('DATABASE_SSL'),
			/* Attributs à rajouter */
      collation: 'utf8mb4_unicode_ci',
      charset: 'utf8mb4',
    },
  },
}};

Once your server has restarted, you'll finally be able to save emojis and retrieve them in any text field of your favorite CMS!