みんなの「教えて(疑問・質問)」にみんなで「答える」Q&Aコミュニティ

こんにちはゲストさん。会員登録(無料)して質問・回答してみよう!

解決済みの質問

base64encodeでの文字化けについて

先日、PHPとjavascriptのエンコードについて質問をしました。
http://okwave.jp/qa/q8512040.html

その後いろいろと試してみたところ、javascript上で
日本語の文字列に対してbase64_encodeをして、
base64_decodeをすると文字化けが起こりました。
ソースは以下の通りです。

<html>
<head>
<title>サンプル</title>
<script type="text/JavaScript" src="base64.js"></script>
</head>
<body>
<script type="text/javascript">
<!--
str="abcde12345あいうえお";
encode_str=base64encode(str);
decode_str=base64decode(encode_str);
document.write("元の文字列:"+str+"<br>変換後の文字列:"+decode_str);
// -->
</script>
</body>
</html>

base64.jsは以下のサイトのものを使用しています。
http://www.onicos.com/staff/iz/amuse/javascript/expert/

結果は以下の通りです。

元の文字列:abcde12345あいうえお
変換後の文字列:abcde12345BDFHJ

文字コードはUTF-8を使用しているのですが、他の文字コードで
試してみても文字化けします。
原因や対処方法がおわかりの方がいらっしゃれば、教えて下さい。
よろしくお願いします。

投稿日時 - 2014-03-17 11:56:17

QNo.8517290

困ってます

質問者が選んだベストアンサー

バイナリデータではなく文字列ですか。

IE10以上なら、JavaScript組み込み関数にbtoa()、atob()というBASE64変換する関数(メソッド)がありますよ。
https://developer.mozilla.org/ja/docs/Web/API/window.btoa

JavaScriptでUnicode文字列をBASE64に変換する場合は、概ね他のエンコード方式で変換してから改めてBASE64にしなければなりません。
たぶんJavaScriptの文字列はバイト単位ではなく、1文字ずつの扱いだから変換できないんでしょう。

MDNではencodeURIComponentとescapeの両方を使っていますが、片方だけで良いと思います。

投稿日時 - 2014-03-17 21:07:27

補足

最初の質問との関連がわかりづらくてすみません。
最終的な目的はバイナリのエンコード、デコードです。

前回の回答を参考にして作成ミスなどを疑い、原因の
切り分けをしていたのですが、その中でjavascriptで
日本語をエンコード、デコードして元の文字列に
戻らなかったので、疑問に思って今回の質問をさせて
いただきました。
前回にひきつづき、わかりやすい回答をしていただき
大変助かりました。ありがとうございました。

投稿日時 - 2014-03-18 10:03:20

お礼

回答ありがとうございました。

投稿日時 - 2014-03-18 09:49:19

ANo.4

このQ&Aは役に立ちましたか?

8人が「このQ&Aが役に立った」と投票しています

回答(4)

ANo.3

結局、PHPは関係ないということは分かったのですね。
はいはい、なるほど…。

説明は省きますが、そのサイトから「utf.js」もDLし、
以下の様に修正すればいいでしょう。それだけの事です。

…という感じで、抽象的な質問をするより
具体的なソースを張ったほうが解決は早いですよ。


<html>
<head>
<title>サンプル</title>
<script type="text/JavaScript" src="utf.js"></script>
<script type="text/JavaScript" src="base64.js"></script>
</head>
<body>
<script type="text/javascript">

str = "abcde12345あいうえお";
encode_str = base64encode(utf16to8(str));
decode_str = utf8to16(base64decode(encode_str));
document.write("元の文字列:" + str + "<br>変換後の文字列:" + decode_str);

</script>
</body>
</html>

投稿日時 - 2014-03-17 16:33:29

補足

回答で書いていただいた処理でうまくいきました。
最初の質問に戻りますが、PHPでエンコードしてjavascriptで
デコードする場合も、同様にPHP側でUTF16からUTF8変換を
してからエンコードすると解決するということになるでしょうか。
また最終的な目的はバイナリデータをエンコード、デコードする
ことなので、バイナリでも同じようにいくかどうか、この辺りは
また試してみたいと思います。
いずれにしても大きなヒントになりました。ありがとうございました。

投稿日時 - 2014-03-18 09:47:59

お礼

回答ありがとうございました。

投稿日時 - 2014-03-17 18:38:28

ANo.2

base64.js が日本語に対応できてないようですね。

投稿日時 - 2014-03-17 12:42:22

お礼

回答ありがとうございました。
base64.jsでは日本語のエンコード、デコードは
できないということですね。残念です。

投稿日時 - 2014-03-17 14:13:23

ANo.1

base64は無関係ですね。

>変換後の文字列:abcde12345BDFHJ

UNICODEの第一バイトが落ちているように見えます。

あ:UNICODE 0x3042
B:UNICODE 0x0042

い:UNICODE 0x3044
D:UNICODE 0x0044

う:UNICODE 0x3046
F:UNICODE 0x0046

え:UNICODE 0x3048
H:UNICODE 0x0048

お:UNICODE 0x304A
J:UNICODE 0x004A

投稿日時 - 2014-03-17 12:27:34

お礼

回答ありがとうございました。
参考になりました。

投稿日時 - 2014-03-17 14:04:54

あなたにオススメの質問