文字化けへの対処

1,854 views
Skip to first unread message

mapple

unread,
Feb 8, 2007, 11:20:21 AM2/8/07
to Google-Maps-API-Japan
どれほどGoogleMapに関連があるのかわかりませんでしたが
こちらで質問させて頂きました。どうか力をお貸し下さい。

現在javascriptからGoogleMapを操作し、
ユーザーが任意に配置したマーカーの位置情報(緯度・経度)を
付随する情報としてフォームに入力されたデータ(場所名など)と共に
データベースへ保存、再度マップページにアクセスした際に
初期表示する、といったものを作成しています。
(GoogleMap ⇔ javascript ⇔ PHP[4.4.2] ⇔ DB[mySQL])

問題はDBへ位置情報(マルチバイト文字)を保存する時と画面へ表示する
時とで文字化けをしてしまうことです。
いろいろなページを参考に調べていくと「文字コードの不統一が原因」とされていて
ファイルの文字コードを変換してアップロードする、またはエンコード処理を行う、
など書かれているのですが、私のケースで何をどう処理を施せばいいのかわからないのでどうか教えて下さい。

・統一する文字コードは?
:参考にしているGoogleMapの本のサンプルでは
PHPでDB操作を行い、javascriptへのデータ受け渡しをJSONで行っています。
その関係で文字コードは「UTF-8」に統一、的な図式になっているのですが、
UTF-8でなければならないのでしょうか?どこかでxmlを使うならUTF-8
というような記述があったような気がしますが、JSONの場合でも関係あるのでしょうか?

・どこで設定?
:PHPで発効するSQL問い合わせ結果はJSON形式でjavascriptへ受け渡されていますが
PHP内でmb_convert_encodingなどの処理が必要なのでしょうか?
本のサンプルでは処理の始めに以下の記述があることでOKというような
感じで書かれているのですが...
header("Content-type: application/json");
ini_set("mbstring.script_encoding", "utf-8");
ini_set("default_charset", "utf-8");

あとinfo.phpでmbstring項目を確認すると
mbstring.internal_encoding=no valueになっていますが
これによる影響はあるのでしょうか?

・対象となるファイルは?
:html,js,phpすべての関連ファイルの文字コードを変換してアップロードしなければならないのでしょうか?

Masashi.K

unread,
Feb 9, 2007, 12:43:03 AM2/9/07
to Google-Maps-API-Japan
>mappleさん

こんにちは。エンコード関連で苦労されているようですね。
少しだけ助け舟を出しますので、参考にしてみてください。

Q1:統一する文字コードは?
A1:基本的にはUTF-8に全部統一するのが無難です。
ただ、PHPやSQLなどでUTF-8以外を使うのならば
(または使わなければならないならば)
mb_convert_encodingなどでエンコード/デコード処理してあげる必要があります。

結論を言えば、全てのエンコード文字列が統一されていれば何でも良いのです。
ただGoogle Mapsでは、APIライブラリがUTF-8で作られているので
「UTF-8で統一するのが一番ベスト」というわけです。

Q2:どこで設定?
A2:PHPであればini_setで設定するもよし、mb_convert_encodingなどでもよし、
JavaScript側で変換処理するもよし、なんでもありです。

Q3:対象となるファイルは?
A3:"Google Maps APIで扱う2バイト文字を含む全てのテキストファイル"と認識しておけば良いでしょう。
A1でも書きましたが、APIライブラリで扱う際にUTF-8になっていれば、
PHPをUTF-8エンコードにする必要はないですよ。

mapple

unread,
Feb 11, 2007, 12:06:49 AM2/11/07
to Google-Maps-API-Japan
>Masashi.Kさん

丁寧にアドバイスありがとうございます。
具体的にどうすべきかわからない部分がありますが、
とりあえず方向性が確認できたのでUTF-8に統一する形で
関連するすべてのファイルをアップロードし直してみました。
結果として文字化け自体は解消できないのですが、
少し具体的に問題点が見えてきました。

まずこちらの環境と流れをわかりやすい形に変えて説明しておくと


GoogleMap ⇔ javascript ⇔ PHP[4.4.2] ⇔ DB[mySQL]

であり、
<データ抽出>
1. GoogleMap[map.htm] → 登録済みで画面に表示されている任意のマーカーをクリック
2. javascript[map.js]:「経度」「緯度」をもとにデータ抽出(PHP)を実行
3. PHP[select.php]:SQLにてデータを抽出、結果を返す(JSON形式)
4. javascript[map.js]:JSON形式で受け取り「場所名」をhtml上に表示
5. html[map.htm]:フォーム上に「場所名」を表示

<データ更新>
(前提:任意のマーカーの情報表示済み)
1. html[map.htm]:フォームの「場所名」を変更→「更新」ボタンを押下
2. PHP[update.php]:「緯度」「経度」をもとにデータを特定しSQLにて更新処理

文字化けはデータ"更新処理"で起こっているようです。
というのは「phpMyAdmin」にて「場所名」を直接データ変更し、map.htm上で呼び出すと
文字化けは起こらず、そのデータをページ上で変更し更新ボタンをクリックして
「phpMyAdmin」で確認すると文字化けしているためです。
しかも文字化けが奇妙な形で起こります。

例.「111」 → 「あああ」と変更 → phpMyAdminでは「ああぢ size=」
「いいい」 → 「ううう」と変更 → phpMyAdminでは「ぁE??ぢ size=」
「えええ」 → 変更なしで更新ボタン押下 → phpMyAdminでは「ええぢ size=」
「おおお」 → 「テスト」と変更 → phpMyAdminでは「チE??モ size=」

ご覧のように必ず語尾にタグの一部のような決まったものがくっついてきます。
何か文法的な間違いで紛れ込むのかとも疑いましたが、関連するどのファイルにも
"size="という記述自体ないのです。
これらのパターンから何か心当たりのある方がいらしたら情報頂けないでしょうか?

<その他気になる点>
・info.phpのmbstring欄
mbstring.internal_encoding 「ISO-8859-1」「no value」
mbstring.language 「neutral」 「neutral」
・phpMyAdminは「ja-utf-8」に変更しても毎回開き直すたびに「ja-euc」になっている
・コード上での文字コード操作は「select.php」「update.php」の冒頭に以下の記述のみ

れつ

unread,
Feb 11, 2007, 6:20:02 PM2/11/07
to Google-Maps-API-Japan
ここの掲示板ってあまり助けてくれる人いないみたいですね``r(^^;)ポリポリ
まあ、google maps api使うような人が人に聞くなって感じなんでしょうが・・・
私も以前同じようにはまったことがあるので、ちょっとだけ助け舟です。

'SET NAMES utf8'

という、クエリー(SQL文)をPHPでDBに接続後、発行していますでしょうか?
(普通にUPDATEを実行するのと同じようにやります)

DB更新で文字化けしているみたいですので、その辺が怪しいかと。

UPDATE処理の前に、printを入れて、そこで文字化けしていないなら、
ビンゴだと思います。

お役に立てれば幸いです。。

to...@asobicreate.com

unread,
Feb 12, 2007, 5:04:31 AM2/12/07
to Google-Maps-API-Japan
tommyです

> ここの掲示板ってあまり助けてくれる人いないみたいですね``r(^^;)ポリポリ
> まあ、google maps api使うような人が人に聞くなって感じなんでしょうが・・・

ポリポリ(^^;。実は少しアドバイスめいた事を投稿しようと書き出してはみたんですが、
どうも話が長くなってうまくまとまらないので辞めたクチです。どーもすみません。

とりあえず質問の内容は確かにGoogleMapの問題ではなく、PHPとMySQLの
文字コードの問題がメインだと思います。PHPの内部エンコードと出力エンコード
の関係、MySQLの文字コードの設定、JavaScriptの文字コード関係の挙動、
まず最初にこれら一つ一つを切り分けて理解をする必要があると思います。
PHPやMySQLで日本語などのマルチバイト文字を扱う場合は、文字エンコードが
その箇所その箇所でどうなっているのかを意識する必要があります。今回は
基本的に全部utf-8だそうですので、理解さえすれば難しい話ではないはずです。
自分がやってるのは、既存のSJISページ(PHPはEUC-JP)にGoogleMapを組み
込んだので相当苦労しましたが(^^;。

・出力時のエンコード
・フォームから値を受け取った時のエンコード
・PHPスクリプト内でのエンコード
・スクリプトファイルそのもののエンコード
・MySQLにSQL文を発行する時のエンコード
・MySQLのエンコード

http://www.php.net/manual/ja/ref.mbstring.php
http://iandeth.dyndns.org/mt/ian/archives/000108.html
http://www.atmarkit.co.jp/bbs/phpBB/viewtopic.php?topic=16539&forum=28&4

その他、"PHP 文字エンコード""MySQL 文字エンコード"あたりでぐぐると
有用な情報が出てくると思います。

Masashi.K

unread,
Feb 12, 2007, 5:14:56 AM2/12/07
to Google-Maps-API-Japan
>mappleさん

そのまま答えを出してしまうと、mappleさんの経験値向上につながらないので、またヒントだけ出しますね。
参考にして試行錯誤してみてください。

今回の問題ですが、「文字コードの不一致」が原因でしょう。
ちなみにphpmyAdminが設定してもeuc-jpに戻ってしまうのは、phpmyAdminの設定ファイルの問題だと推測します。
手作業でphpmyAdminをインストールしてみれば、たぶん答えは見えてくると思いますよ。
ということで、今回の問題とは別の問題です。

さて、「文字コードの不一致」とはどこが不一致なのか?という点がポイントになってきます。
一つの答えとしては「れつさん」の方法が良いと思います。
(私は試してないですが、たぶん合っていると思います。)

事象を整理してみましょう。
1.phpmyAdminで場所名を編集すると、文字化けせずに表示する。
2.フォームから更新処理をして、phpmyAdminで見ると、文字化けしている
3.phpmyAdminはeuc-jpになっている(utf-8にならない)
4.htmlはutf-8

まず「1」と「2」から「データの更新処理で問題が起きている」までは正解です。
あとは「3」と「4」の間のデータのやり取りの文字コードが一致すれば良い訳です。
(たぶんココまでは推測できているのだと思います。)

そしたら、あとは簡単です。
SQLサーバーとデータのやり取りをする際に、全データを「euc-jp」で行い、
Google Maps APIとやり取りする際には、UTF-8でやればよいわけです。

図に表すと、以下のような形になります。
---------------------------------------------------------------------------------
Google Maps API
↓↑
(UTF-8でやりとり)
↓↑
phpやJavaScript等のプログラム
(ここにeuc-jp⇔utf-8の変換処理を追加する)
↓↑
(euc-jpでやりとり)
↓↑
SQLサーバー
---------------------------------------------------------------------------------

ちなみにれつさんの方法だと、以下のようになります。
---------------------------------------------------------------------------------
Google Maps API
↓↑
(UTF-8でやりとり)
↓↑
phpやJavaScript等のプログラム
↓↑
(utf8でやりとり)
↓↑
SQLサーバー
(SQL文でutf-8を出力するように設定)
---------------------------------------------------------------------------------

ということで、あとは「文字コードの変換をどうすればよいか」という点に焦点が移ります。
[代表的な方法]
1.phpで文字コードを変換する関数を使い、変換する(mb_convert_encodingなど)
2.javascriptで文字コードを変換する
3.phpの設定を変更することでカバーする。(ini_setなど)
4.その他

どの方法でも良いでしょう。
また、その方法はいくつもインターネット上にあるので、調べてみてください。
(「1」が普通の方法だとは思いますが。)

具体的なコードを示すことはたやすいですが、たぶんそれをすると、
コピー&ペーストで終わってしまうと思うので、あえてこのような書き方をしてみました。

今回の「文字列コードの統一」というのは、WEBのプログラムであれば、普通に行う処理の一つです。
とはいえ、経験がないと陥りやすい問題の一つでもあります。
ヒントを参考に試行錯誤して、がんばってください。

mapple

unread,
Feb 13, 2007, 11:59:51 AM2/13/07
to Google-Maps-API-Japan
なかなか都合がつかず遅くなってしまいました。
みなさま色々なアドバイスをありがとうございます。

結論から言うと・・・ 文字化け解消いたしました!
しかしその内容的に問題アリでしたので報告させて頂きます。

まずこれまでもいくつかの方法を個々には試してみていたものの
解決できなかった経緯と現状の時間的な限りから
"どこで何を"ではなく全部の方法を一度に試してみよう、と考え
・関連するすべてのファイルの文字コードをutf-8に変更しアップロード
・PHPにてmb_convert_encoding
・SET NAMES utf8
・ini_set("mbstring.script_encoding", "utf-8");


ini_set("default_charset", "utf-8");

のすべてを組み込んでテストしました。
皆さんそれぞれのアドバイス=経験者のお墨付きを組み合わせるのだから
とりあえず、これまでにあったであろう「穴=見落とし」はないはずだ、
と期待しましたが、見事に予想は外れて文字化けを起こしました。
同じ目的の処理を何重にもほどこしているはずなのになぜ?
という疑問から、ひょっとして文字コード以外に問題があったのかも、と
PHPの更新処理を細かくデバッグしていきました。
すると更新処理のPHPに渡った時点で既にパラメータが文字化けしていることが発覚。
フォームからの更新処理であるにも関わらず、
不正な値の引渡しをしていた点が原因だとわかり、
html側の処理を改善することで解決しました。

散々文字化けが原因だと言って皆さんに細かいアドバイスまでして頂いて
原因がまったく違う箇所であったとはお粗末なのはとても申し訳なく思います。
ただ私が目的のものを作り上げるには文字コードをutf-8へ変更する必要があったこと、
また初期の段階で文字化けの問題が発生していたことは事実なので
私にとっては何一つ無駄になっていないのだけは確かです。
知識、経験不足に加え時間的焦りから
思い込みによるミスに気づかず皆さんを振り回してしまいましたが、
貴重な知識を頂きとても助かりました。
ありがとうございました。

ちなみに・・・
普段ブラウザはIEの私ですが、firefoxはutf-8で不都合が生じるものなのでしょうか?
そのままだとfirebugが使えないような・・・
このような事情もあり、手当たり次第にutf-8化を行っている部分を
最低限必要な部分に最適な処理だけを書けばよいように
時間をかけて改めていきます。(現状ではまだ多くを理解できていません)

GoogleMapAPIを知り、「こんなことができるのか」という興味本位で
参考書を手に取った結果、意外なほど簡単な手続きで利用できることを知り、
未修得だったPHPの勉強も兼ねてのコミュニケーションツール作りを始めましたが
結果的にjavascriptも含めてのそれぞれの処理、記述方法、データの受け渡し等が
複雑に絡まる、今の自分に見合わないレベルの領域に踏み込んでしまいました。
今回の問題が解決してもJSONからのデータ受け取りに失敗する問題や
処理の制御など前途多難ですが、地道に完成目指して頑張ってみようと思います。

Masashi.K

unread,
Feb 13, 2007, 12:20:29 PM2/13/07
to Google-Maps-API-Japan
>mappleさん

そうですか。文字化けが解消してよかったですね。

私も「こんなことができるのか」でGoogle Maps APIを使い始めたクチです。
意外と奥が深いですよ。
最近は色々と機能もアップしてきていますし。
(v1のころから比べたら使いやすくなりました。)

せっかく足を踏み入れたGoogle Mapsの世界ですから、
PHPとAjax等の勉強がてらに遊んでみると面白いですよ。
意外なことから学ぶことも多いです。

mappleさんも地道に完成を目指してがんばってください。

れつ

unread,
Feb 14, 2007, 8:52:18 AM2/14/07
to Google-Maps-API-Japan
問題解決してよかったですね。

> フォームからの更新処理であるにも関わらず、
> 不正な値の引渡しをしていた点が原因だとわかり、
> html側の処理を改善することで解決しました。

ちょっとご気分を害されたらなんですが・・みなさんせっかくここまで丁寧に対応してくださっているのですから、html側のどのような処理が問題でどう
直されたら問題が直ったのかをお時間があれば書かれるべきだと思います。技術的に可能な範囲で結構ですので。

ちなみに、のちのち読む方が誤解をまねかないように、補足しますと、firefoxがutf-8でおかしくなるという話は聞いたことがありません。(っ
て私がしらないだけなのかなぁ)

ALL UTF-8でなんら問題ないはずなのですが・・・。さまざまな本でも、おすすめは必ずALL UTF-8ですよ。

特に、google maps api自体はutf-8必須ですので、文字化けが起こったら迷わずutf-8化するべきだと思います(私もそうして日本
語表示DB登録問題なしです)

Reply all
Reply to author
Forward
0 new messages