AndroidのWebViewでassetsに置いたhtml内のjavascriptが動かない

この記事は次のブログに引っ越しました。

ポイント "script"タグ内のJavaScriptが呼び出された時点で、"id"や"class"がすでに宣言されていることを確認する。 そのため"body"の終了タグの前に"script"を設置するのが確実 ■動かない例 <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Local html with javascript test</title> <script> var elem = document.getElementById("test"); elem.textContent = "Hello world."; </script> </head> <body> <p id="test">dummy</p> </body> </html> ■動く例(scriptの位置に注意) <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Local html with javascript test</title> </head> <body> <p id="test">dummy</p> <script> var elem = document.getElementById("test"); elem.textContent = "Hello world!"; </script> </body> </html> ■所感 Android StudioでWebViewを使ったシンプルなWebブラウザを持ったAndroidアプリを作ったのですが、アプリのローカル(assets)内に設置したhtmlファイルに記述したJavaScriptが動きませんでした。 上記htmlを見ればわかるように、単純に"p"タグに"id"をつけて、textContentで内容を書き換えているだけなのですが。 Android Studioには実行状況をモニターできるAndroid Monitarというのがあり、動きをトレースしていると下記エラーが。 I/chromium: [INFO:CONSOLE(8)] "Uncaught TypeError: Cannot set property 'textContent' of null", source: file:///android_asset/index.html (8) これはドキュメント内のノードが読み込めない仕様、、、面倒だなぁと思いながら調べて続けてみると同じ現象で悩んでいる方が。単純にJavaScriptが実行された時点で該当・参照する"id"もしくは"class"が読み込まれていないので「"null"には"textContent"プロパティもないから書き込めないよ」ということでした。 参考URL: http://stackoverflow.com/questions/29843397/js-error-message-textcontent-set-as-null jQueryもbodyタグ直前に設置するケースなども同じ理由か。

Kindle FireがMacのAndroidStudioで認識されない

この記事は次のブログに引っ越しました。

MacAndroid StudioにUSB接続でAmazonKindle Fire HD(第5世代)をつなげても認識されない あらかじめKindle本体に隠されいる開発者オプションでFire開発者にUSBデバッグを許可する必要があります。 Android Studioでアプリの開発中に動作テストを実行する際、USB接続したAndroidバイスを検知すると、デバイス本体で実行するかエミュレーターで実行するか選択できるので簡単に実機で動作検証出来ます。 しかし、Android File Transfer.appなどのファイル転送アプリでデバイスは認識はされているのに、Android Studioからは認識されない(選択肢に表示されない)場合、デバイス側がUSBデバッグ用のモードが有効になっていない可能性があります。 Mac( OSX )の場合、Windowsと違いUSBドライバを別途入れる必要がないのですが、いずれのOSにしてもAndroidバイスを開発に使う場合は事前に隠しモードの開発者設定を行う必要があります。「設定」内の「セキュリテイ」詳細設定にある「不明ソースからのアプリ」をオンにしただけでは認識されません。 大抵のAndroid端末は端末情報のビルド番号を7回以上タップして開発者オプションを有効にするのですが、Kindle Fire HDの第5世代はAndroid 5.x Lollipopをベースにした Fire OS 5.x が入っており、ちょくちょく細かいところで他のAndroidと項目の表記が違います。 以下はKindle Fireでの具体的な設定です。 「設定」に入る 「端末オプション」に入り「シリアル番号」を7回以上タップする 「開発者オプション」が現れるので「ADBを有効にする(Fire開発者にUSBデバッグを許可する)」をオンにします 確認ダイアログが表示されるので「有効にする」を選択します PCがつながっていると「USBデバッグを許可しますか?」と聞いてくるので「OK」を選びます。この時「このコンピューターを常に許可」にチェックを入れておくと以後聞いてこなくなります。 同開発者オプション画面にある「USB接続でアプリを検証」がオンになっていることを確認します 以上でAndroid Studioでも認識されるようになると思います。 Kindle Fire(FireOS Ver.5.3.x)の「開発者オプション」で設定出来る項目 「USBでコンピューターに接続」USBの接続タイプが選べます。タイプは、メディア・ファイル転送モード(MTP)か外部カメラモード(PTP)で、後者はデジカメをつなげた時と同じモードになります。 「スリープモードにしない」充電中・USB接続中に画面をスリープモードにしない設定にできます。 「Bluetooth HCIスヌープ ログを有効にする」Bluetoothでファイルを転送する際に利用されるHCIプロトコルのパケットをキャプチャしてファイルに保存できます。 「プロセスデータ」実行中のプロセスの詳細情報がみれるようになります。 「ADBを有効にする」開発用にUSB接続でデバッグを許可できます。 「USBデバッグ権限を取り消し」USBに接続された相手のデバッグ作業をリセットできます。実行中にハング/フリーズした場合など。 「仮の位置情報の使用を許可する」GPSなどの検証で、仮想のGPS情報を渡した場合の動作の検証ができるようになります。 「表示属性検査を検証する」Viewクラスの属性情報を監視して、現在のViewに何が設定されているか見えるようになります。 「デバッグアプリを選択」アプリの起動処理のデバッグに利用するようです。 「デバッガーを待機」上記でデバッグアプリを選択していると、onCreateを実行する前にデバッガーと接続してくれます。 「USB接続でアプリを検証」上記ADB(デバッグ)やADT(データ転送)の接続でインストールしようとするアプリが怪しい挙動をしないか(悪質アプリとみなされないか)事前に確認します。 「ワイヤレスディスプレイ証明書」ワイヤレスモニタ(Miracast)の互換オプションを表示します。 「Wi-Fiの詳細ログを有効にする」"LogCat"ビューにWiFi通信時の詳細なログを表示します。 「Wi-Fiからモバイル接続への強制的なハンドオーバー」モバイル接続を優先します。 「Wi-Fiローミングのスキャンを常に許可」アクセスポイントの自動切り替えを常に行わせることができます。 「ロガーバッファサイズ」"LogCat"でログを取る際のバッファサイズを指定できます。指定できるサイズ値はは"64K,256K,1M,4M,16M"です。 「タップを表示」画面上にタップ情報を表示します。 「ポインターの表示」画面上にタップ時の詳細なポインターの情報を表示します。 「サーフェスの更新を表示」画面上の更新箇所を点滅で表示してくれます。 「レイアウトの境界を表示」マージン(余白)やレイアウトの調整をするために境界線を表示します。 「RTLレイアウトの方向を指定」右から左へ文字を読む文化圏のモードで表示します。 「ウィンドウアニメーションのスケール」ウィンドウのアニメーション速度を変更できます。 「トランジションアニメーションのスケール」トランジッション時のアニメーション速度を変更できます。 「アニメーター持続時間のスケール」アニメーションの速度を変更できます。 「セカンドディスプレイをシミュレート」2次画面(セカンドディスプレイ)を仮想表示します。 「GPUレンダリングを使用」2D描画であっても常にGPUを利用します。 「GPUの更新を表示」GPUによるレンダリング(描画)箇所を点滅で知らせてくれます。 「ハードウェアレイヤーの更新を表示」ハードウェアレイヤーによるレンダリング(描画)箇所を緑色の点滅で知らせてくれます。 「GPUオーバードローをデバッグGPUによる重ね書きされた箇所を別の色で知らせてくれます。 「非長方形のクリップ操作をデバッグ」非矩形(長方形)の操作できるクリップ領域を表示します。 「4x MSAAを強制」OpenGL ES 2.0でのアンチエリアシング(4x MSAA)を有効にします。 「ハードウェアオーバーレイを無効にする」オーバーレイの合成にGPUを使います。 「色空間をシミュレート」画面上の色が色弱向けの見え方に変わります。 「AwesomePlayerを使用(廃止)」メディアの再生にNuPlayerでなく、代わりに最新のプレーヤーを使います。 「USBオーディオルーティングを無効にする」USBオーディオ接続時に自動検知しないようにできます。 「厳格モード有効」メインスレッドの処理が長い場合に点滅で遅延を知らせてくれます。 「CPU使用状況を表示」アプリのCPU使用状況を画面にオーバーレイ表示します。 「プロフィールのGPUレンダリングGPUのダンプ情報を確認できます。 「OpenGLトレースを有効にする」OpenGL利用時、"LogCat", "Systrace(グラフィック)", "glGetErrorでコールスタック"のいずれかの方法で利用情報をトレースできます。 「アクティビティを保存しない」ユーザー側のアクティビティを直ちに破棄し記憶しないようにします。 「バックグラウドプロセスの上限」バックグラウントで使用するプロセス数を制限できます。最大4。 「すべてのANRを表示」バックグラウンドのANRも検知し、バックグラウンドのアプリが応答しない場合に通知してくれます。

PHPで数字の先頭に 半角スペース を付ける方法

この記事は次のブログに引っ越しました。

PHPで数値の前に空白を入れる 文字と数字が空白なしで並ぶ文字列は時として読みづらいことがあります。 空白なし:スバラシティビル3階104号室 空白あり:スバラシティビル 3階 104号室 読みづらい以外にWebAPI系に住所データを渡す際にもAPI側が区切りがわからず精度が下がるというデメリットもあります。 例えば、GoogleMapsなどに住所を渡す際、該当するビル名が地図情報に含まれていると精度が上がるのですが、そのビル名に階数や部屋番号などが「スペースなし」で繋がっている場合に正常に認識できなかったりします。 お客様の入力した住所からGoogleMapでも表示してGPSなどの座標情報も取得したいといった場合、これだけの差で精度が下がるのはもったいない。しかし、入力フォームに項目を細かく分けすぎてしまうことでお客様の利便性を損なうという、トレードオフ的なジレンマがあると思います。 さて、このような空白を加える処理はPHPでも正規表現を使うのが楽なのですが、その場合単純に"preg_replace"を使うと脆弱性が発生するので"preg_replace_callback"を使ってみます。 変換前:スバラシティビル3階104号室 変換後:スバラシティビル 3階 104号室 <?php function fAddSpaceBeforeNum( $s ){ $s = preg_replace_callback( '|(\d+)|', function( $matches ) { return " " . ( $matches[0] ); //頭に空白を足す }, $s ); return $s; } 注意点としては「5-4-3」という場合に「 5- 4- 3」という結果になることです。

Chromeの拡張機能でマルウェア(Video HTML5 Downloader)

この記事は次のブログに引っ越しました。

Chromeでリンクをクリックするたび「ウィルスに感染した」ページ("app.desktop-info.site"とMacKeeper)に飛ぶ app.desktop-info.siteドメインに翻弄される MacOSX 10.11(El Capitan)のChromeを使っていたのですが、なんとGoogleAmazonWikipediaなどの(ドメイン名の正しい)サイト上でもリンクをクリックするたびに「ウィルスに感染しました!」のページに飛ぶようになってしまいました。 原因はChrome拡張機能プラグイン)の「Video HTML5 Downloader」でした。特にヤバイ・サイトを見ていないのに(いつも見ているサイトばかりなのに)という方は、拡張機能を疑いください。 ■所感 ページの閲覧や検索をしていると「ウィルスに感染しました!」バナー広告だけでなく、普通のリンクをクリックすると「感染しました!」系ページに飛ばされ「またまた〜」(舌打ち)と言う事があるのですが、なんとGoogleの検索結果からのクリックでも現象が。URL(アドレス)を見ても、"goolge"とか"amason"とかではない。ちゃんと"google"や"amazon"になっている。 しかも、ページを戻ろうとするとまた飛ばされるので履歴を見ると複数ページに渡って飛ばされている模様。 この「感染しました!」ページのURLのドメインは"http://app.desktop-info.site/"。当然のようにアンチ・ウィルスソフトを入れろと言ってくるのですが、お勧めされるのがMac版アンチ・ウィルスソフトでは、あの手・この手で購入させようと悪名高い"MacKeeper"。 落ち着いて現象が出るパターンを検証したところ、 リンク先をペーストすると現象が発生しない。 リンク・クリックをした場合に発生する。 シークレット・ウィンドウでも現象が発生する。 Firefoxでは発生しない。 ChromeMacAvast!アンチ・ウィルスソフトでチェックするも、すでにブロック済みのキャッシュ内データを発見・削除するも、リンクの問題は変わらず。 ポップアップやdmgのダウンロードが促された場合は、Avast!がブロッックしてくれるが、リンクの問題は変わらず。 アチョンブリケ。 これは、、、「こっち(ローカル)側に原因がある?」と「いよいよ検知できないMacOSXのウィルスに感染したか(初)」と悩んでしまいました。 次に、それまでに取った行動を見直したところ、思い当たる節が。 Flashが使えなくなることからHTML5でのメディア・ファイルの動作をチェックするために、普段はオフにしている拡張機能の"Video HTML5 Downloader"をオンにしたことでした。拡張機能設定を見るとシークレットモードでの動作にもチェックが。 「これか」 早速オフにしてみたところ、元の動きに戻りました。(ホッ) これは報告しなければ、と拡張機能のページに行ったところ逃げやがって(削除されて)おりました。 Chromeの設定からログインにアカウントを追加すると、ブックマークや追加した拡張機能を他のChromeを使った環境でも同期して使えて、Web制作に便利な拡張機能もいちいち環境ごとにダウンロードしなくてもチェックのオン・オフで使えるので便利なのでが、その際の拡張機能は毎回提供元からダウンロードしているわけではないんですね。 私はオフラインで動画を見たいので、FLVダウンロードと合わせてHTML5の動画ダウンロードに重宝していたのですが、無料アプリによくある経済難からのアドウェア導入による二次災害ですな。 ソースを見てメディア探すの面倒なのよねぇ。(本音)

iSnapの完全アンインストール手順

この記事は次のブログに引っ越しました。

Windowsの「スナップ」機能をMacOSXにも再現する"iSnap"を完全に削除(アンインストール)する方法です。 "iSnap"(v1.6.x)のアプリをゴミ箱に移動しただけでは実は完全には削除されずゴミ・ファイルが残るようなので、それらを含めた完全アンインストールの仕方の備忘録です。 常駐タイプの簡易ツールの場合、こういったアンインストールの際にゴミを残す事が多いので、他のアプリでも応用できると思います。 iSnapのアンインストール手順 サービスの停止 管理者権限のあるユーザーでログインしていることを確認します。 ”iSnap”が起動していたら終了する。(フリーズしている場合はアップルメニューから「強制終了」を選び強制終了します) 「アップルメニュー」→「ユーザとグループ」の各ユーザーの「ログイン項目」に”iSnap”がいたら「-」(マイナス)ボタンで削除します。 「アクティビティモニタ」を起動します。(「アプリケーション」→「ユーティリティ」フォルダ内にあります) 裏で動いているサービス(プロセス)の一覧が、起動した画面内に表示されるので名前の見出しをクリックして名前順に並べます。 一覧の中から”iSnap”を含む項目(プロセス)を選び、終了します。 アプリのアンインストール アプリーケーションフォルダにある”iSnap”をゴミ箱に捨てます。(AppStoreからインストールした場合は、ロケット・アイコンのLaunchpadを開き”iSnap”を長押しすると表示される「×」(バツ)マークを押下してアンインストールします) ゴミファイルの削除 Finderを開いて上部メニューの「移動」→「フォルダへ移動」を選ぶと「フォルダの場所を入力」と聞かれるので、下記フォルダを各々開いてファイル名に”iSnap”を含むものを削除(ゴミ箱へ移動)していきます。 /Library/Preferences/ /Library/Application Support/ /Library/Caches/ ~/Library/Preferences/ ~/Library/Application Support/ ~/Library/Caches/※もしくはHDD全体を”iSnap”を含むファイル名で検索して、自分と関係ないiSnapファイルを削除してもいいかもしれませんが、一括削除は意図しないファイルも削除してしまう危険をともなうので注意してください。 ゴミ箱を空にして、再起動して完全削除は完了です。 ■所感 以前の記事にも書いたのですが、Windows7以降に標準で実装された「スナップ」という、ウィンドウを画面の淵や端に持っていくと分割表示してくれたり、上部に持っていくと全画面になるという以外と便利な機能があります。 これは、ブラウザを開きながらエディタも開いて左右に並べたり、FirefoxChromeを左右に並べて違いを比較したり、フォルダを整理する際に移動元と移動先を左右に並べたりするのに重宝しています。 周りのMacユーザーにはウィンドウは1つ1つマウスで大きさを整える人が多く、Windowsユーザーがせっかちなのか私がせっかちなのか、MacOSXで作業しているとこの機能がとても欲しくなります。 この「スナップ」に近い機能をMacでも実現してくれる有名なアプリで「BetterSnapTool」というのがあるのですが、AppStoreで380円程度ではあるものの有償なので、無償のアプリ「iSnap」を使っていました。 Chromeなどスナップされないものがあるものの無料だしという事で、だましだまし使っていたのですが、El Capitan(OSX 10.11)にしてから気づいたらアプリが落ちている事が多く、Windowsのスナップほど便利ではありませんでした。 結局El Capitanにも公式対応している「BetterSnapTool」をAppStoreから購入し、Chromeも問題なくスナップできるし、今の所、満足しているのでした。

GitHub Desktopを独自Gitサーバーで使う(SSH接続)

この記事は次のブログに引っ越しました。

GitHub Desktopを自前のGitリモートサーバーでSSH接続で使う@さくらレンタルサーバー (Windows版/Mac版) GitHubを使うのにGitHub Desktopアプリがシンプルで便利なので、自分専用のGitサーバーにも使いたいと思った。 GitHubだと基本的に不特定多数にソース・コードが見られてしまうのでGitHubの有料アカウントを使うのもいいのだけれど、すでにお金を払っている自分のサーバーに入れたGitサーバーでGitHubDesktopアプリが使えないかなと。 ここでは、さくらレンタルサーバー(さくらインターネット)に自前のGitサーバーを建てていることが前提ですが、そのリポジトリGitHub Desktopを使いたいと思い試行錯誤の末できました。これは、その備忘録です。 ポイントはGitHubDesktopからSSH経由でローカルにクローンしてサーバとSyncできるか、なので他のサーバーでも同様に利用可能だと思います。 1行でまとめると、Mac版はGitリンクを作成してGitHubDesktopに追加。Windows版はGitShellでローカルにクローン後、GitHubDesktopに追加します。 簡単なのはMac版の方で、面倒なのはWindows版です。 MacGitHub Desktopに自前のGitリモートサーバのリポジトリを追加する方法 リポジトリ追加(クローン)用のリンクを用意し、リンクを開いたのちSSHのパスワードを入力。以降は、GitHub.comと同様にSyncなどもできる。 ■MacGitHub Desktopのクローン(リポジトリ)作成リンクのフォーマット ・さくらレンタルサーバーの場合 github-mac://openRepo/ssh://<アカウント名>@<アカウント名>.sakura.ne.jp/home/<アカウント名>/<path_to_your_remote_git_repository>/ ・上記リンクの使用例 <html> <body> <a href="github-mac://openRepo/ssh://hoge@hoge.sakura.ne.jp/home/hoge/my_git/my_repo/test.git/"> Clone to GitHubDesktop(Mac) </a> </body> </html> ■WindowsGitHub Desktopのクローン(リポジトリ)作成手順 Windows版はアプリをインストールしても、リンクにアプリを紐づけないようです。 アプリをインストールするとWindowsPowerShellベースの"Git Shell"が一緒にインストールされアイコンがデスクトップに出来ると思うのですが、GitShellからコマンドで一回クローンを行った後、クローンされたローカル側のリポジトリGitHub Desktopに追加する流れになります。 問題は、コマンドでクローン時にSSH接続のパスワードを聞いてくるのですがGitHubDesktopには影響がないらしく、そのままだとSyncしてもパスワードが通らないのでエラーがでます。 解決法としては、SSH公開鍵・秘密鍵による接続です。 GitShellでSSHキー(公開鍵・秘密鍵)のペアを作成する 公開鍵をxxxx.sakura.ne.jpサーバーの $HOME/.sshにコピーする アップした公開鍵を"cat"コマンドで"authorized_keys"に追加する クライアントからのSSH接続でパスワードを聞かれなくなったらOK GitShellでリモートサーバ(xxxx.sakura.ne.jp)からローカルへクローンする ローカルにクローンされたリポジトリをGitHubDesktopに追加する Windows版は試行錯誤して動くようになったので、まだ詳細な手順は整理できていませんが1つ1つの工程はネットに落ちています。 忘れたころ(OSの再インストールするころ)に必要になるので整理しておかねば。

Use of undefined constant item - assumed ’xxx in...

この記事は次のブログに引っ越しました。

PHP5.xで"Use of undefined constant item - assumed 'xxxx' in..."エラーが出るようになった エラー内容としては「定義されていない定数を使用しようとしています」という意味なので当然と言えば当然なのですが、配列の添え字を指定する際にクォーテーションで囲っていない場合にでます。 NGな例 $sample = $array[ hoge ]; OKな例 $sample = $array[ 'hoge' ] ; $sample = $array[ "hoge" ] ; ちょっとはまりました。疲れているのかも。とほほ。