Encoding Accented Characters in React JS

Question

The user uploads CSV with accented characters like émily, ástha which I need to encode and pass to the backend. I have tried updating the file type in FormData between type: 'text/plain' and type: 'text/csv'.

const data = new FormData()
data.append('file', new Blob([params.file], { type: 'text/csv' }))

Passed encoding in FileReader's method readAsText with params ISO-8859-1, ISO-8859-4, ISO-10646-UCS-Basic, and a couple of other examples from http://www.iana.org/assignments/character-sets/character-sets.xhtml. Needless to say, tried other unhelpful methods readAsArrayBuffer and readAsBinaryString.

reader.readAsText(file, 'ISO-8859-4')

Printing using ISO-8859-1 gives me Žmily and ‡stha which are not close enough. I need to be able to receive the exact characters (backend uses ascii folding filter to convert these into ascii).

I am relying on How to encode & decode non Ascii characters? as the last solution.

Any pointers on how can I attempt encoding non ascii characters?

Anthony Liu · Accepted Answer · 2020-08-09 21:10:03Z

1

This might be related with the csv encoding issue. You can prepend the Byte-Order-Mark (BOM) to csv content first, try

const BOM = "\uFEFF"; 

new Blob([BOM + params.file], { type: 'text/csv;charset=utf-8' })

edited Aug 9, 2020 at 21:10

answered Aug 9, 2020 at 21:03

Anthony Liu

3222 silver badges6 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

A_G Over a year ago

Thanks, @anthony. Turns out the file uploaded was not in utf-8 format. It worked after updating the encoding.

Collectives™ on Stack Overflow

Encoding Accented Characters in React JS

1 Answer 1

1 Comment

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Linked

Related