React : "DOMException: String contains an invalid character" error while encoding in base64
I’m facing a new kind of error and I’m kind of stuck here. I have a lightweight code editor in my app and I send its content (typed by the user) to my back-end, encoding it in base64.
First I used
codeContent.toString("base64"); method and it worked like a charm with this kind of testing content :
let numberTest = 52; let arrayTest = [63, 24, 75]; let sumTest = numberTest + arrayTest;
The problem here, is that I can’t decode it back to UTF-8 when I want to retrieve this code from my API, I get some gibberish.
So I tried this method instead :
atob(codeContent);. In this case, if I type a simple text like :
test, the encoded version looks fine (
µë-), but the content is still empty in my backend after my POST. And if I try this with a simple line of JS like
let testNumber = 52;, then I get this error : "DOMException: String contains an invalid character"
To sum it up : I’m a little lost, what’s the good way to encode my text to base64 and retrieve it afterwards ?
Source: React – Stack OverflowSeptember 29, 2021