Android WebView で独自のHTTPヘッダを利用する方法

Android アプリからアクセスする際に独自のHTTPヘッダを入れたくなったので、調べてみた

	String url = "http://www.example.jp/";

	Map<String, String> extraHeaders = new HashMap<String, String>();
	extraHeaders.put("ORIGINAL_HEADER", "original data");

	WebView wv;
	wv = (WebView) findViewById(R.id.webview);
	wv.loadUrl(url, extraHeaders);

サーバ側で受け取るときは下記のようになる

<?php
echo $_SERVER['HTTP_ORIGINAL_HEADER'];

PHPUnitを試してみる

PHPユニットテストするためのPHPUnitを試してみることにする
とりあえずは自分用のメモ

インストールとかはPHPUnitのページを見ればわかるので省略
PHPUnit – The PHP Testing Framework

注意点としてはpearのupgradeをちゃんとやっておくことくらいかな

# sudo pear upgrade-all

テストを書いてみる

ドキュメントが日本語で充実しているので、そこを参考に色々書いてみる

PHPUnit – The PHP Testing Framework

んで、書いてみたの以下

<?php
class HogeTest extends PHPUnit_Framework_TestCase
{
	public $stack = array();
	/**
	 * @test
	 */
	public function Hogeをテスト(){
		$hoge = new Hoge();
		$this->assertEquals(0, $hoge->count());
		$this->assertEquals(1, $hoge->count());

		$hoge->push('hoge');
		$this->assertEquals(1, $hoge->count());
		$this->assertEquals('hoge', $hoge->pop());

		$this->assertEquals(0, $hoge->カウント());
	}

	public function testArrayPop(){

	}
}

class Hoge
{
	public $stack = array();
	public function __construct(){
		$this->stack = array();
	}
	public function push($value){
		array_push($this->stack, $value);
	}
	public function pop(){
		return array_pop($this->stack);
	}
	public function count(){
		return count($this->stack);
	}
	public function カウント(){
		return $this->count();
	}
}
  • PHPUnit_Framework_TestCaseを継承したクラスを作る
  • クラス名は〜〜〜Testにする
  • テストは testで始まるpublicのメソッドにするか、@testアノテーションをつけることでテストとして実行される
  • PHPのメソッド名に日本語が使えた!

いや、これ知らなかったんだけど・・・(常識ですか?)
PHPUnitのテストの書き方とか調べてたら普通に日本語でメソッド定義してあるのとか見て、もしかして?って思ってやってみたら動いたw

テストの実行

コマンドラインから以下を実行

# phpunit --colors HogeTest.php

実行するとテストの結果がずらずらーっと出てくる
ちなみに上のコードを実行すると以下のようになる

PHPUnit 3.7.14 by Sebastian Bergmann.

F.

Time: 0 seconds, Memory: 2.75Mb

There was 1 failure:

1) HogeTest::Hogeをテスト
Failed asserting that 0 matches expected 1.

HogeTest.php:11

FAILURES!
Tests: 2, Assertions: 2, Failures: 1.

とりあえず今日はここまで

んで、まぁ

書き方とかはわかったんだけど、実務レベルにどうやって適用するかが頭の中でもやついているので、そこをどうにかせんと・・・

CentOS5 + PHP5.3 でエラーが出ていたので対応

CentOS5にremiリポジトリからいれたPHP5.3で以下のエラーが出ていたので対応してみる

PHP Warning:  PHP Startup: Unable to load dynamic library '/usr/lib/php/modules/imagick.so' - /usr/lib/php/modules/imagick.so: undefined symbol: php_set_error_handling in Unknown on line 0

pecl upgradeをしたらいいよみたいなのをみかけたのでやってみる

$ pecl upgrade
.....
$ php -v
PHP 5.3.18 (cli) (built: Oct 18 2012 09:09:52)
Copyright (c) 1997-2012 The PHP Group
Zend Engine v2.3.0, Copyright (c) 1998-2012 Zend Technologies
    with Xdebug v2.2.1, Copyright (c) 2002-2012, by Derick Rethans

おっけー

  • 参考

帰ってきたネコブログ » phpとmysqlをアップデートしました

Androidのブラウザアプリ毎のUA情報

AndroidのブラウザアプリのUSER AGENTを調べたのでメモ

auのISW13Fで調査

  • 標準ブラウザ

Mozilla/5.0 (Linux; U; Android 4.0.3; ja-jp; ISW13F Build/V69R51I) AppleWebKit/534.30 (KHTML, like Gecko) Version/4.0 Mobile Safari/534.30

Mozilla/5.0 (Linux; Android 4.0.3; ISW13F Build/V69R51I) AppleWebKit/535.19 (KHTML, like Gecko) Chrome/18.0.1025.166 Mobile Safari/535.19
標準ブラウザと微妙に形式が違う

  • OperaMini

Opera/9.80 (Android; Opera Mini/7.5.32193/28.3590; U; ja) Presto/2.8.119 Version/11.10
但し環境変数の以下にオリジナルのUAが入ってる
HTTP_X_OPERAMINI_PHONE_UA
Mozilla/5.0 (Linux; U; Android 4.0.3; ja-jp; ISW13F Build/V69R51I) AppleWebKit/534.30 (KHTML, like Gecko) Version/4.0 Mobile Safari/534.30

OperaMiniはOperaのプロキシをかましてコンテンツの圧縮をおこなう関係上、REMOTE_ADDRが違う(オリジナルの情報は環境変数のHTTP_X_FORWARDED_FORに入ってる)
OperaMiniはHTML5非対応
Frequently asked questions for Opera for Android | Opera

  • OperaMobile

Opera/9.80 (Android 4.0.3; Linux; Opera Mobi/ADR-1301080958) Presto/2.11.355 Version/12.10
但し環境変数の以下にオリジナルのUAが入ってる
HTTP_DEVICE_STOCK_UA
Mozilla/5.0 (Linux; U; Android 4.0.3; ja-jp; ISW13F Build/V69R51I) AppleWebKit/534.30 (KHTML, like Gecko) Version/4.0 Mobile Safari/534.30

Mozilla/5.0 (Android; Mobile; rv:18.0) Gecko/18.0 Firefox/18.0

FirefoxAndroidってことしか教えてくれない・・・
「機種なんかかんけーねー!Firefoxですよ!」ってことですか?w

  • DolphinBrowser

Mozilla/5.0 (Linux; U; Android 4.0.3; ja-jp; ISW13F Build/V69R51I) AppleWebKit/534.30 (KHTML, like Gecko) Version/4.0 Mobile Safari/534.30
標準ブラウザと同じ

  • iLunascape

Mozilla/5.0 (Linux; U; Android 4.0.3; ja-jp; ISW13F Build/V69R51I) AppleWebKit/534.30 (KHTML, like Gecko) Version/4.0 Mobile Safari/534.30 iLunascape/2.1.0.0
標準ブラウザの末尾にiLunascapeと付け加えられている

Mozilla/5.0 (Linux; U; Android 4.0.3; ja-jp; ISW13F Build/V69R51I) AppleWebKit/534.30 (KHTML, like Gecko) Version/4.0 Mobile Safari/534.30
標準ブラウザと同じ

  • jigBrowser

Mozilla/5.0 (Linux; U; Android 4.0.3; ja-jp; ISW13F Build/V69R51I) AppleWebKit/534.30 (KHTML, like Gecko) Version/4.0 Mobile Safari/534.30
標準ブラウザと同じ

  • AngelBrowser

Mozilla/5.0 (Linux; U; Android 4.0.3; ja-jp; ISW13F Build/V69R51I) AppleWebKit/534.30 (KHTML, like Gecko) Version/4.0 Mobile Safari/534.30
標準ブラウザと同じ

nvmを使ってNode.jsをインストール

昨日はUbuntuにNode.jsを入れてみたけれど、色々としらべたらnvmってやつを使って入れるのが良いみたい
なので、インストールしてみた

インストールの方法とかはググればたくさん出てくるけど、ちょっとつまづいたところがあったのでメモ
・・・と思ったら、下記のページにちゃんと書いてあった orz

【Node.js】nvmをインストールして設定するまでの方法 | creator note

何がはまったかというと、新しいターミナルを開いたときにnvmコマンドが使えなくなって、あれ?ってなったのです

都度、下記のコマンド実行しないといけないらしい

source ~/.nvm/nvm.sh

でも、面倒だよねーってことで .zshrc の最後にそのまんま追加しておきました

Ubuntuでnode.jsを動かしてみた

インストールしてみる

基本的にはここのドキュメントにしたがってインストール

Installing Node.js via package manager · nodejs/node-v0.x-archive Wiki · GitHub

sudo apt-get install python-software-properties python g++ make
sudo add-apt-repository ppa:chris-lea/node.js
sudo apt-get update
sudo apt-get install nodejs npm

最初のapt-get installでパッケージリストが古いままだと怒られる場合があるので、その場合はapt-get updateしてあげる

動かしてみる

とりあえずは、サンプルコードを動かしてみる

http://nodejs.jp/nodejs.org_ja/docs/v0.8/api/synopsis.html

var http = require('http');

http.createServer(function (request, response) {
  response.writeHead(200, {'Content-Type': 'text/plain'});
  response.end('Hello World\n');
}).listen(8124);

console.log('Server running at http://127.0.0.1:8124/');

上記をexample.jsとして保存して、以下を実行

$ node example.js
Server running at http://127.0.0.1:8124/

上記でアクセス(ローカルじゃない場合は127.0.0.1を動作させているサーバのIPに変更)して「Hellow World」が表示されればおっけー

っていうか、あっさりとデター!

書き方を見るとメソッドチェーンっぽい
createServer() でサーバの基本を書けばいいのかな?
listen() で動作するポートの指定ができるのか

とりあえずの雑感

  • Ubuntuで動かしたら異常に楽チンに最初の導入ができた

とっかかりが入りやすいの重要

まぁ、日ごろフロント側で書くことがあるので、新しい言語を覚えるよりはハードル低い

  • なんか作ってみるかー

何ができるのかまだわかってないけど、とりあえずなんか書けたらいいなぁ

Android標準ブラウザの本体回転時の横幅取得に関して

Android標準ブラウザで本体を回転させた時に画面の横幅を取りたかったのだが、バージョンによって挙動が違ったのでメモ

バージョンによってresize後だったり、orientationchange後だったりする

Android 2.3
resize → 画面の幅変更 → orientationchange
orientationchange の時に $(window).width() の値をとらないと正しい値にならない

Android4.0
orientationchange → 画面の幅変更 → resize
resize の時に $(window).width() の値をとらないと正しい値にならない

※他のバージョンは未チェック

こことかの事らしい
「FlexFirm スタッフBlog」| KSKフレックスファーム
https://www.x-fit.jp/tips/70

ここではsetTimeoutを使って、幅を取るタイミングを少し遅らせてやる方法が書いてある
スマートフォン対応、気をつけたいトラブル JavaScript編 - SSSSLIDE

んで、どうしたか

結局Androidのバージョンを見て、2.3の時だけorientationchange、それ以外の場合はresizeにbindさせてみた

追記

やっぱりなんだか変だったので調査
結果イベントの順番としては orientationchange → resize っぽかったので、両方のイベントでフックするように変更した

macにgitを入れてみた

以前のエントリーmacにgitを入れるのに苦労していたが、そんな苦労をすることはなくgitのページからダウンロードして普通にインストールでけたw

インストール方法

まぁ、簡単だけど一応メモ

  • gitのページmacでアクセスすると右側にdownload for macのリンクがあるので、そこをクリック
  • ダウンロードしたファイルを開いて、pkgファイルを開く
  • インストーラーが起動するので、そのまま指示に従ってインストール
  • ターミナル起動中だったら、ターミナルを再起動する
  • gitコマンドをうってgitの使い方が出てきたらおけ
% git
usage: git [--version] [--exec-path[=<path>]] [--html-path] [--man-path] [--info-path]
           [-p|--paginate|--no-pager] [--no-replace-objects] [--bare]
           [--git-dir=<path>] [--work-tree=<path>] [--namespace=<name>]
           [-c name=value] [--help]
           <command> [<args>]

The most commonly used git commands are:
   add        Add file contents to the index
   bisect     Find by binary search the change that introduced a bug
   branch     List, create, or delete branches
   checkout   Checkout a branch or paths to the working tree
   clone      Clone a repository into a new directory
   commit     Record changes to the repository
   diff       Show changes between commits, commit and working tree, etc
   fetch      Download objects and refs from another repository
   grep       Print lines matching a pattern
   init       Create an empty git repository or reinitialize an existing one
   log        Show commit logs
   merge      Join two or more development histories together
   mv         Move or rename a file, a directory, or a symlink
   pull       Fetch from and merge with another repository or a local branch
   push       Update remote refs along with associated objects
   rebase     Forward-port local commits to the updated upstream head
   reset      Reset current HEAD to the specified state
   rm         Remove files from the working tree and from the index
   show       Show various types of objects
   status     Show the working tree status
   tag        Create, list, delete or verify a tag object signed with GPG

See 'git help <command>' for more information on a specific command.

mac portsとかから入れないのであれば、これで全然問題なかったじゃん・・・ってお話ですw

PHPのファイルアップロード数上限設定にはまった

たくさんのファイルをアップロードするフォームで片方の環境ではアップロードできるのに、もう片方ではアップロードできなくて色々と調べていたら・・・
PHP 5.2.12 からアップロードするファイル数の上限が設定に増えたようで、それに引っかかっていた

macにもgitを入れたくなったので調べた話

ちょいちょいgitを触り始めてみたので、macにも環境構築しようと思ったら・・・

  • macにgit入れたい
  • 調べた
  • MacPortsかhomebrewで入れるのが一般的っぽい
  • XCodeが必要らしい
  • Appストアから落とそう!
  • Lion以上じゃないとだめ
  • おれSnow Leopardだ orz
  • Mountain Lionにアップデートしなきゃだめかぁ・・・ ←いまここ

んーMountain Lionになって安くなったから入れてもいいけど・・・うーむ
とりあえずバックアップとってから入れて見るかぁ

ていうかむしろMBA13の特盛ほしいw

herokuにPHPをpushしてみた話

さくらのVPSを借りたので色々とgitを使ってお試し中

heroku toolbeltのインストール

herokuを使うにはtoolbeltというものを入れないといけないらしいので、それをインストール

The Heroku CLI | Heroku Dev Centerを参考にheroku toolbeltをインストール

% wget -qO- https://toolbelt.heroku.com/install.sh | sh

なんか色々出てインストール完了

herokuにログイン

まずはSSHの公開鍵の登録

% ssh-keyge -t rsa -f ~/.ssh/heroku.com
% heroku login #複数公開鍵がある場合はここで、どれにするか聞かれるので数字を入力して選択

herokuアプリの作成

下記のようにやると作れる

% heroku create --stack cedar

Creating hogehoge... done, stack is cedar
http://hogehoge.herokuapp.com/ | git@heroku.com:hogehoge.git

※オプションの意味はよくわかっていないw
hogehogeの部分はなんかheroku側で適当につけてくれる

gitのリポジトリを作ってpush

公開したいアプリのgitリポジトリをpushすることで公開してくれる

% git init
% git remote add heroku git@heroku.com:hogehoge.git
% vi index.php #なんかごにょごにょと書く
% git add *
% git commit
% git push heroku master
Enter passphrase for key '/home/hogehoge/.ssh/heroku.com':
Counting objects: 3, done.
Writing objects: 100% (3/3), 241 bytes, done.
Total 3 (delta 0), reused 0 (delta 0)

-----> Heroku receiving push
-----> PHP app detected
-----> Bundling Apache version 2.2.22
-----> Bundling PHP version 5.3.10
-----> Discovering process types
       Procfile declares types -> (none)
       Default types for PHP   -> web
-----> Compiled slug size is 9.5MB
-----> Launching... done, v3
       http://hogehoge.herokuapp.com deployed to Heroku

To git@heroku.com:hogehoge.git
 * [new branch]      master -> master

んで、さっきcreateで作ったときに表示されたURLにアクセスするとpushしたアプリが見られる

んー、なんかはじめてやってみたが簡単だった

videoタグのplayにイベントを割り当てる

HTML5のvideoタグで再生開始されたときに特定の処理を行いたかったので、playイベントにplayというメソッドを割り当ててみたときのメモ
iPhoneとかでは普通にvideoタグの部分を押したらplayイベント発生するけど、Androidの一部端末では onclick="this.play();"とかみたいにclick時にplayを実行してやら無いといけない端末もあるため、clickイベントからplay呼び出すようにしてある

<script type="text/javascript">
<!--
// playメソッドにイベントを割り当てる
jQuery.fn.play = function( fn ) {
	return (fn) ? this.bind( "play", fn ) : this.trigger( "play");
};
$(function(){
	$('video').play(function(){
		// video.play();時に実行される処理
	});
	// playイベント発生しない端末用にclickイベント発生時にthis.play()してあげる
	$('video').click(function(){
		this.play();
	});
});
-->
</script>

<video src="example.mp4">
</video>

参考にしたのはjQueryドキュメントについてたコメント欄
.trigger() | jQuery API Documentation

I have the exact same problem.
I'm trying to write a jQuery plugin for HTML 5 Video ( with fallbacks) but the problem is
the Video Element (the HTML Node) has a method ( a property ?) called "play".
So when I add a "play" method to the jQuery.fn object and then try to trigger a "play" event on a video element, the event is fired twice !

For example, I create a new method called "play" :
jQuery.fn.play = function( fn ) {
return (fn) ? this.bind( "play", fn ) : this.trigger( "play");
};
and then I try to use it :
$("video").play(function() { alert('failed') });
The browser shows two alert windows.

Can anyone help ?

まぁ、このコメントではplayイベントにplayメソッド割り当てたら、なんかよくわかんないけど2回実行されちゃうよ、助けてーってことらしいけどw

第59回PHP勉強会@東京に行ってきました

勉強会への参加は初めて!
前々から興味はあってタイミングを狙っていたんですが、ついに念願かなって(笑)参加できました〜

ざっくりと思いつきのまとめ

  • mac率高い!

会場を見渡すとmacだらけでした
むしろMacBook Airだらけ?
それだけ、WEBとmacの親和性が高いということなのでしょう

  • 参加している人たちのレベルに追いつきたい

自分の環境が自分以外にできる人がいないため、暗中模索が続いていたけれども、こういった機会に参加することで新しい発見とか交流とかができて自分の技術力も伸ばしていけるんだなぁと感じました
会場でLTの最中なのに、発表で使われているコードに対して突然レビューが始まってしまったり、テストも普通にやっている人たちばっかりだったり・・・
追いつくというよりは、基礎はしっかりやりましょうねってことでしょう

会場内では半数くらいの利用率だった気がしますがGitHubを使っている人が多くなってきているな、という感じがします
LTで感じたのは、コードを通してのコミュニケーションができるのがGitHubなんだってことですね
ha1tさんとyandoさんのCandyCaneのemojiプラグインの対応とかはまさにこれ!って感じでした

そんなこんなで

初参加のPHP勉強会は自分の中でかなり刺激的でした
今後もこういった機会に積極的に参加していきたいなぁ・・・というかします!(宣言しちゃって大丈夫?w
とうわけで、どこかでお会いしたら今後ともよろしくお願いします^-^

スマートフォン向けページ、フリックUIでのリンク動作に関して

スマートフォン向けページでフリックできる部分を作ってほしいとの要望に対応したときのメモ
jQueryを使ってフリックを実装するライブラリがいくつかあるんだけれども、ものによってはフリック部分でリンクのaタグが効かなかったりする

原因はなに?

フリック部分のタッチ開始時のイベント操作ら辺が原因じゃないかとは思うんだけど、知識不足で修正までは手がつかなかった
event.preventDefault() をどこに置くかで回避できそうなところまでは調べた

対処方法

既に動作に問題がないライブラリがあるんならば、それを使えば「いーじゃん」ってことで以下のライブラリ導入で回避
iPhone/Android/PCのブラウザ対応、フリック操作をシンプルに実装できるjQueryプラグイン - makogの日記
http://www014.upp.so-net.ne.jp/makog/js/jquery_flicksimple/

備考

ちなみにリンクが動作しなかったライブラリでも、AndroidのみだめでiPhoneは大丈夫だった
iOSの作りこみがされているのか、Androidのブラウザの実装がアレなのかはわからないけど、iOSは素直だなぁという印象でしたとさ

Windows 8 Consumer Preview が公開されたので VMware Player 4.0.2 にインストールしてみた

2月29日にWindows 8 Consumer Previewが公開されたので、さっくりダウンロードしてVMware Player 4.0.2 に入れてみた

インストール環境

Windows 7 64bit 上の VMware Player 4.0.2 にインストール

ダウンロード

下記のページの今すぐダウンロードから進んでISOイメージをダウンロードする

手元の環境ではなぜか64bit版のISOでインストールしようとしたら、こけたので32bit版をインストールした

VMwarePlayerの設定

新規仮想マシンの作成で

  • 後でOSをインストール
  • ゲストOS : Microsoft Windows
  • バージョン : Windows7
  • マシン名、場所は適当
  • ディスクサイズはデフォルトの60GB
  • ハードウェアのカスタマイズで念のためメモリを2GBに設定

インストール

作成した仮想マシンを起動して、ダウンロードしてきたISOをマウントしてインストール
ウィザードに従ってすすめれば特に難しいことなくインストール完了する

雑感

  • WindowsPhoneみたいw
  • 仮想マシンをフルスクリーンで起動しないとチャームとかスタートメニューとか画面の端っこを使う操作がやりにくい
  • 特にアプリケーション入れていないからか、VM上でも軽い
  • タッチスクリーンとかトラックパッドみたいなので操作すること前提としたUIになっている感じ
  • 使いなれれば割と操作しやすいかも