フォーラム一覧   -   トピック一覧
   AIR for PC
     HTMLコンポーネントの文字化け
投稿するにはまず登録を

スレッド表示 | 新しいものから 前のトピック | 次のトピック | 下へ
投稿者 トピック
nakaya82
投稿日時: 2008-2-6 11:49
お馴染みさん
登録日: 2006-12-31
居住地:
投稿: 13
HTMLコンポーネントの文字化け
Re: Apolloダウンロード開始!

上記スレッドでも少し話が出ていますが、HTMLコンポーネントで文字化けしてしまいます。

HTMLのmetaタグで文字コードを指定しても、全部が全部化けるわけではないのですが、一部の文字が化けます。
例えば・・・

-普通のブラウザの表示-
Adobe マイクロソフトを買収

-AIRのHTMLコンポーネント-
Adobe マイクロソフト□□□

上記の様に、metaでShift_JIS指定されているページの一部の文字が□となって表示されちゃってます。

私の環境だけでしょうか?

また、下記スレッドと同義かも知れませんが、
EUC からUTF8 へ変換時に文字化け

WebからHTTPLoaderなどで読んできたUTF-8の文字列もiso-8859-1のように認識されてしまいます。
ByteArrayのwriteMultiByteやreadMultiByteを使って文字コードを変換しようと試みるもうまく行きません。
bytesAvailableメソッドは0しか返してくれませんし・・・
以下のような感じで化けてます。

会議(社内):開発定例会(

こういうのは結構なインパクトだと思うのですが、皆さんの環境では起きていないのでしょうか?
AIRの文字化けを検索しても、数件しかヒットしないので、解決方法があるのではないかと考えています。

他に解決方法がありましたら、
このド素人にご教授いただけませんでしょうか?
よろしくお願いいたします。
suama
投稿日時: 2008-2-8 10:30
ご主人様
登録日: 2006-9-27
居住地:
投稿: 92
Re: HTMLコンポーネントの文字化け
こんにちは。

私は、社内のHTMLコンテンツや、Ajaxを利用したコンテンツをAIRで表示した際に、この問題にぶち当たりました。
この件で、社内のエンジニアの方のご意見を伺ったりしたので、参考になればと。

---

文字化けの原因は、AIRで使用しているWebKitというレンダリングエンジンにあります。
WebKitは、Appleが開発したWebレンダリングエンジンです。
Appleは、KDEに付属のWebブラウザKonquerorのレンダリングエンジンであるKHTMLとJavaScriptエンジンKJSをベースにしてWebKitを作り、それを利用してSafariというWebブラウザを作りました。

AIR関連では情報が少ないかもしれませんが、Safariだと、Ajax+文字化けというキーワードで、色々事例が出てくるようです。

で、これも、Safariが悪いというのではなく、エンジン部分のKHTMLに由来する問題のようです。
WebKit(あるいはKHTML/KJS)には、Ajax で使われるXMLHttpRequest のレスポンスの Content-Type ヘッダのエンコーディング指定を無視して、レスポンスのエンコーディングを iso-8859-1 と誤認するというバグがありました。
ただし、少なくとも最新のSafariではJevoの文字化けは起こりませんので今は直っているようです。

問題はAIRで、これは古いバージョンのWebKitを使っているからのようです。


ちなみに、私の使っているAIRの環境だと、ブラウザのエンジンは、こういう表示になります。

User-Agent: Mozilla/5.0 (Windows; U; en) AppleWebKit/420+ (KHTML, like Gecko) AdobeAIR/1.0


AIRの次のリリースで、AppleWebKitのバージョンが最新のSafariと同等のものであれば、たぶん文字化け問題は解決するんじゃないかと思っています。

さて、現状での対策ですが、Beta3のAIRは、HTTPヘッダのContent-Typeは無視しているようなので、
(1)通常のHTMLコンテンツであれば、<meta>タグで指定する
(2)Ajax(XMLHttpRequestをあつかう)の場合は、レスポンスにXMLヘッダをくっつける
(<?xml version='1.0' encoding='utf-8'?>)
ということをすればなんとかなるようです。

この辺も教えてもらっています。
http://wiki.rubyonrails.com/rails/pages/HowToUseUnicodeStrings

でも、
引用:

ページの一部の文字が□となって表示されちゃってます

というのは、AIR固有の問題かもしれません。

どちらにしても、AIRのエンジンのバグ(バージョン)のせいだとして、しかも、対策はサーバサイドにお願いするしかないのが現状だと、AIRの次のリリースを待つしかないのかもしれません....。

ご自身で対処できる範囲内でのコンテンツなら、上記の対策をしていただくので、乗り切れるかと思いますが、リリースが間近でしたら、それを待つ方が早いかもしれませんね。


----------------
Suama

Pepe
投稿日時: 2008-2-8 12:25
モデレータ
登録日: 2006-1-10
居住地: 千葉県市川市南部(浦安との境)
投稿: 1274
Re: HTMLコンポーネントの文字化け
ちなみに文字化けが発生するサイトのURLとかを
教えていただけないでしょうか...(・・?


----------------
2013年4月から勤務できる常駐案件募集中!!
サンプル作成や有償サポートは随時!!
http://shigeru-nakagaki.com/

nakaya82
投稿日時: 2008-2-9 0:09
お馴染みさん
登録日: 2006-12-31
居住地:
投稿: 13
Re: HTMLコンポーネントの文字化け
suamaさん、Pepeさん

ご返答ありがとうございます。
よくコメントをお見受けするFlex賢者にお声掛けいただいて光栄です。

suamaさんから提示して頂いた解決策(1)ですが、
以下のサイトなどをHTMLコンポーネントで表示して
みていただけませんでしょうか?
(面倒なことを持ちかけて申し訳ないです)

niftyのニュースサイト

pepeさんから頂いたご質問の回答にもなると思います。

□□□がいっぱい出てきませんか?
(出てこなかったら教えてください!環境を見直します!)

このぺーじはmetaタグでcharsetが設定されています。

<meta http-equiv=Content-Type content="text/html; charset=shift_jis">


以下のコードで確認してます。


<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
	layout="vertical">
	<mx:HBox  width="100%">
		<mx:Text text="http://"/>
		<mx:TextInput id="input"  width="100%"/>
		<mx:Button label="Go" click="http.location = 'http://' + input.text"/>			
	</mx:HBox>
	<mx:HTML id="http" width="100%" height="100%" />
</mx:Application>

何もいらないことはしていないと思うのですが・・・

HTTPで取ってくる情報も他所のサーバなので、metaタグを埋め込むことも難しい状態なんです。

suamaさんより
引用:

>(<?xml version='1.0' encoding='utf-8'?>)
> ということをすればなんとかなるようです。


という情報を頂いたことですので、かなり手間ですが
中継するWebサーバを立て、そいつに対象Webサーバからコンテンツを取得させ、xmlタグをつけたものをAIRから取得しようかなぁ・・・と考えています。


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




suama
投稿日時: 2008-2-12 12:48
ご主人様
登録日: 2006-9-27
居住地:
投稿: 92
Re: HTMLコンポーネントの文字化け
こんにちは。
私の環境で、Airアプリを作ってためしてみました。

なお、コードは、<mx:Application/>ではなく、<mx:WindowedApplication/>でも良いですよね?

ご指定のURLでは、ざっと見たところ、文字化けは置きませんでした。
一応、環境の参考になればと思い、AirからのHTTPリクエストのヘッダを添付します。


GET /news/td/td__itmedia-mobile_20080207093.htm HTTP/1.1
Referer: app:/test2.swf
User-Agent: Mozilla/5.0 (Windows; U; en) AppleWebKit/420+ (KHTML, like Gecko) AdobeAIR/1.0
x-flash-version: 9,0,99,0
Accept: text/xml,application/xml,application/xhtml+xml,text/html;q=0.9,text/plain;q=0.8,image/png,*/*;q=0.5
Host: newsflash.nifty.com
Proxy-Connection: Keep-Alive


ただ、作成したAirアプリを、他の環境(違うOSとか)のAirランタイムでは実行していません。
もしかしたら、違う結果になるかもしれないですね。

その他の補足ですが、
Flex2については、eclipseを使っていますが、Flex3(Air)については、FlexBuilder3(単体)を使っています。
(Adobe Flex Builder Localized Standalone Feature 3.0.190133)


----------------
Suama

Pepe
投稿日時: 2008-2-12 14:17
モデレータ
登録日: 2006-1-10
居住地: 千葉県市川市南部(浦安との境)
投稿: 1274
Re: HTMLコンポーネントの文字化け
う〜ん、これ怪しいかも ^_^;

たぶん、Windows であれば "shift_jis" は問題ないと思います。

例えば
 ・Windows で "euc-jp" とか
 ・Mac で "shift_jis" とか

は、ひょっとして化けるかも ^_^;
どっかのサイトで試せると良いんだけど
ただ、今回のリリースでは日本語は完璧でないかも...

#AIR ではなく FlashPlayer 側にバグがあるみたいだから ^_^;


----------------
2013年4月から勤務できる常駐案件募集中!!
サンプル作成や有償サポートは随時!!
http://shigeru-nakagaki.com/

Pepe
投稿日時: 2008-2-12 14:48
モデレータ
登録日: 2006-1-10
居住地: 千葉県市川市南部(浦安との境)
投稿: 1274
Re: HTMLコンポーネントの文字化け
ちょうど、FxUGのサイトが euc-jp だったので
試したのですが、うまく表示できているように思えます。

ただ、別の痛いバグを見つけました...

日本語入力ができないwwwwwww

半角英数はOKなんですけどね...

# う〜ん、RC5でこれだと、
# リリース時点ではアウトかも (;一_一)


----------------
2013年4月から勤務できる常駐案件募集中!!
サンプル作成や有償サポートは随時!!
http://shigeru-nakagaki.com/

Pepe
投稿日時: 2008-2-12 15:03
モデレータ
登録日: 2006-1-10
居住地: 千葉県市川市南部(浦安との境)
投稿: 1274
Re: HTMLコンポーネントの文字化け
「mx.controls.HTML に日本語入力ができない」件について
こちらにバグ登録しました。
https://bugs.adobe.com/jira/browse/SDK-14625

「vote」よろしくです m(__)m


----------------
2013年4月から勤務できる常駐案件募集中!!
サンプル作成や有償サポートは随時!!
http://shigeru-nakagaki.com/

suama
投稿日時: 2008-2-12 15:19
ご主人様
登録日: 2006-9-27
居住地:
投稿: 92
Re: HTMLコンポーネントの文字化け
Pepeさん、こんにちは!

引用:

例えば
 ・Windows で "euc-jp" とか
 ・Mac で "shift_jis" とか

は、ひょっとして化けるかも ^_^;


という言葉をヒントに、社内で思いつくサイトにアクセスしてみました。(UNIX系のサーバはeuc-jpも多いので)

まだ特定できていないんですが、こんな挙動がありました。

- "euc-jp"のサイトに、Airアプリで最初の「一回目」のアクセスをすると、文字が四角に化けている。
- アプリをいったんクローズして、もう一回起動。
- 上記と同じURLにアクセス。サーバからのレスポンスはステータスコードが304になっていて、Airアプリは、表示の際にキャッシュを利用している模様。
- この場合は化けずに正常(^^;
- キャッシュのせいかも、と思って、Temporary Internet Filesを全部削除してみたのですが、今度は文字化けは無し。

...といった具合で、発生の症状が一定しません。


あと、日本語が入力できない件は、mx.controls.HTMLに限ってなんでしょうか。
TextInputでもダメな場合があったので、なんだかまだ実用に耐えられないな...という気がします(^^;


----------------
Suama

sera
投稿日時: 2008-2-14 2:26
やや 常連さん
登録日: 2007-9-27
居住地:
投稿: 24
Re: HTMLコンポーネントの文字化け
ちょっと強引ですし、
解決策となるかはわかりませんが、
こんなのはどうでしょうか?
試していないので、実装に問題があったらごめんなさい。

1.EUC 形式のHTML ファイルをバイナリとして取得
2.ShiftJIS へ変換し、UTF8 へ変換
3.<meta>等でEUC が指定してあればEUC の文字列を
  UTF-8 の文字列へ置換
4.ローカルにファイル保存
5.location にapp-storage:/またはfile:////
4のファイルを指定


EUC->UTF8 の変換は面倒だったので手抜きしましたが、
2の処理を作成してみました。
<mx:Script source="jcode.as"/>
をソースに追加する。
以下のコードをjcode.as として保存すると
EUCtoSJIS という関数が使えます。

System.useCodePage=true;

import flash.utils.ByteArray;

private function EUCtoSJIS(tmpByte:ByteArray):String
{
var retStr:String="";
var len:uint=tmpByte.length;
var ui1:uint;
var tmpByteArray:ByteArray = new ByteArray();

	for(var i:uint=0;i < len;i++){ 
		ui1=tmpByte.readUnsignedByte();
		if(ui1 < 0x80){
			tmpByteArray[0]=ui1;
			retStr+=tmpByteArray.toString();
		}else if( (i+1)!=len ){
			retStr+=EUCtoSJIS1(ui1,tmpByte.readUnsignedByte());
			len--;
		}
	}

	return retStr;

}

private function EUCtoSJIS1(ui1:uint,ui2:uint):String
{
var retByteArray:ByteArray=new ByteArray();

	ui1-=0x80;
	ui2-=0x80;

	if(ui1 % 2){
		ui1 = ((ui1 + 1) / 2) + 0x70;
		ui2 = ui2 + 0x1f;
	} else {
		ui1 = (ui1 / 2) + 0x70;
		ui2 = ui2 + 0x7d;
	}
	if (ui1 >= 0xa0) { ui1 = ui1 + 0x40; }
	if (ui2 >= 0x7f) { ui2 = ui2 + 1; }

	retByteArray[0]=ui1;
	retByteArray[1]=ui2;

	return retByteArray.toString();

}


EUCtoSJIS 関数にByteArray で渡すと
System.useCodePage=true;のおかげで
UTF8 のString が返ってきます。
(関数名に偽りありですね。)
このコードは多分、Windows 専用です。
Mac 版では動くのかな?
Linux 版のAIR が出た場合このコードは動かないと思われます。

テストが不十分でなのでEUCtoSJISにバグがあったらごめんなさい。

スレッド表示 | 新しいものから 前のトピック | 次のトピック | トップ

投稿するにはまず登録を