Qiita Teams that are logged in
You are not logged in to any team

Log in to Qiita Team
Community
OrganizationEventAdvent CalendarQiitadon (β)
Service
Qiita JobsQiita ZineQiita Blog
3
Help us understand the problem. What are the problem?

More than 1 year has passed since last update.

posted at

NFCとNFDに気をつける

自分のサイト(AAHub)で起きた問題の備忘録的内容です。NFCとNFDについてです。

NFCとNFDについては以下の文字列をどこかのtextareaに貼り付けてみてみてください。
NFDと書かれた方は「ギ」がキと濁点の組み合わせになっており、例えばバックスペースで削除する時は最初に濁点が削除されてキだけになると思います。

NFD:3月ウサギ
NFC:3月ウサギ

起きた問題

AAHubのユーザーからタイトルをコピペしてWindowsのエディタに貼り付けたら表示が崩れたと言われてしまいました。どうやらタイトルがNFDだったからのようです。
usagi.png

なぜ発生したか?

このタイトルはGCSに置いているファイル名を使っています。どうやらMacから直でファイルをアップロードしていたため起きたみたいです。
Screen Shot 2018-12-22 at 14.14.57.png

Macだとフォルダに置かれるファイルはNFDで扱っているようでそれを例えば以下のようなスクリプトでGCSにアップするとこうなってしまうようです。

gsutil -m cp -r out/folders/* gs://example/folders/

修正

不便に感じる方がいるのは間違いないし濁点が分割してるなんてマニアックな動きをするのもエンジニア以外は面食らうと思いますので修正しました。JavaScript上だと以下の処理で変換することができます。

str = str.normalize("NFC");

まとめ

こ知らないと対策わからないし、言われないと気づかないところです。けど不便に感じるユーザーが確実にいると思うので対処していきたいですね。
それでは。

Why not register and get more from Qiita?
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away
3
Help us understand the problem. What are the problem?