I met a problem today, the expression of the input input method kept reporting errors, resulting in errors of submission. Later, I checked the reason because utF-8 encoding may be two, three or four bytes. Emoji are four bytes long, and MySql utF8 encodes up to three bytes long, so data cannot be inserted.

Solution (2 ways in total)

1. Convert Mysql encoding from UTF8 to UTf8MB4

Here we choose js to filter, the code is as follows

let oIpt = document.querySelector('#iptVal');

oIpt.value = oIpt.value.replace(/[\uD83C|\uD83D|\uD83E][\uDC00-\uDFFF][\u200D|\uFE0F]|[\uD83C|\uD83D|\uD83E][\uDC00-\uDFFF]|[0-9|*|#]\uFE0F\u20E3|[0-9|#]\u20E3|[\u203C-\u3299]\uFE0F\u200D|[\u203C-\u3299]\uFE0F|[\u2122-\u2B55]|\u303D|[\A9|\AE]\u3030|\u A9|\uAE|\u3030/ig, '');
Copy the code

It is ok to directly assign the value after removing the expression to the input. The above re can match all emoji in iOS10.2.1 and before. There may be some omissions due to the large number of Android expressions.

let oIptVal = document.querySelector('#iptVal').value; console.log(escape(oIptVal)); // escape gets %uD83C%u......... Format encoding, can correspond to \u... Format is okCopy the code

The above is basically solved. If there are mistakes or omissions, please give us more advice