phpfogサーバに.htaccessでベーシック認証を設定する

さくっとステージング環境を作るのに最近はほぼPHPFogを利用しています。
リリース前のものであったらベーシック認証くらいはかけておきたいので、設定したメモ。

作業は.htaccessと.htpasswdを作成し、git pushするだけ。

.htaccessからhtpasswdを取得するのに絶対パスで記述します。ディレクトリ構造はこちら。

/var/fog/apps/app[各アプリに割り振られたID]/[設定したサブドメイン].phpfogapp.com/

各アプリに割り振られたIDは、PHPFog管理画面の「App Console」のURLから確認できます。

https://phpfog.com/apps/[各アプリに割り振られたID]

設定したサブドメインはphpfogでアプリケーションを作成した際に入力した、自身のサブドメインを入れて下さい。

.htaccessはこちら。

AuthUserFile /var/fog/apps/app[各アプリに割り振られたID]/[設定したサブドメイン].phpfogapp.com/.htpasswd
AuthGroupFile /dev/null
AuthName "Please enter your ID and password"
AuthType Basic
require valid-user

.htpasswdの作成等は、この辺のツールを使って作成して下さい。
.htaccess による認証用 パスワード暗号化ツール

後は作ったファイルをgit pushするだけで、サイトにアクセスするとベーシック認証が確認できます。
なんとなく新サービスのモック作って、情報フルオープンとかしないようにご注意を。

2012年3月14日 Webニュース記事まとめ

気まぐれ過ぎて約2ヶ月ぶりの…2012年3月14日の気になったWebのニュース、記事まとめ。

Androidやスマートフォン関連の記事が多い日でした。

iOS/Android向けのHTML5対応JavaScriptフレームワーク「jqMobi」、早くも正式版登場


http://sourceforge.jp/magazine/12/03/13/0358223

iOS/Android向けのHTML5対応JavaScriptフレームワーク「jqMobi」、早くも正式版登場

AndroidやiPhoneのHTML,CSS,JavaScriptのバグまとめ


http://blog.webcreativepark.net/2012/03/13-093853.html

AndroidやiPhoneのHTML,CSS,JavaScriptのバグまとめ


各スマホブラウザのバグまとめ。

Sencha Touch 2


http://www.sencha.com/products/touch/

Sencha Touch 2


iOSとAndroidのネイティブアプリ出力も備えて大幅に性能向上を行ったVer2がリリースされたみたいです。

PhotoshoperにAndroidアプリのデザインをお願いする際の失敗例


http://greety.sakura.ne.jp/redo/2012/03/photoshoperandroid.html

PhotoshoperにAndroidアプリのデザインをお願いする際の失敗例

モバイルWeb開発での実機検証をサポートする「Adobe Shadow」

モバイルWeb開発では各デバイスでの実機検証が欠かせない。
今まではFirefoxのFireMobileSimulatorや、1つ1つのデバイスをUSBで接続してデバッグ、
Chrome to phone(Androidのみ)等を使って端末に転送してデバッグしてきたが、これからは違う。

Adobeが提供するモバイルWeb開発向けの「Adobe Shadow」の登場によって実機検証の環境は変わる。

Adobe Shadow

Adobe Shadow

まずはAdobe Shadowをダウンロードし、インストール。
http://labs.adobe.com/technologies/shadow/
※Windows版とmac版

次にChromeのエクステンションをインストールします。
https://chrome.google.com/webstore/detail/ijoeapleklopieoejahbpdnhkjjgddem

最後に実機検証を行う対象デバイスにアプリをインストール。

iPhoneアプリ
http://itunes.apple.com/app/adobe-shadow/id498621426
Androidアプリ
https://play.google.com/store/apps/details?id=com.adobe.shadow.android

各デバイスでアプリを起動すると番号が表示されますので、それをChromeエクステンション側で入力すると接続が完了します。

試しにWebページをChromeで開いてみると…各デバイスで同じページが開くき、見え方の違いなどデザイン的な確認をすることができました。

これだけでも導入する価値がありますが、これだけに留まらないのがAdobe Shadow。
もう1つの機能で最大に嬉しい機能が「リモートインスペクション」という、Firefoxで有名なデバッグツール「Firebug」やWebkitブラウザ標準のデベロッパーツールのように、モバイルデバイス上に表示されたWebページのHTML構造や、CSSなどをPCのChromeから確認することができ、Firebugなどと同様に値を変更、編集して反映させることもできます。

なお、会社環境によってはアクセス制限している場合もあるので使えないかもしれないです。

chromeでのモバイル開発がまた便利になりましたね。

codeigniterのmemcached driverが使い方わからなすぎるので情報整理

codeigniterでmemcachedを使う場合にあらかじめドライバーが用意されています。

説明ページは下記なんですが…説明が少なすぎてわかりづらい!w

http://codeigniter.jp/user_guide_ja/libraries/caching.html

この中に、
『複数の Memcached サーバは、application/config/ ディレクトリに置いた memcached.php 設定ファイルで指定することができます。』
とあるのですが設定ファイルの書式は全く説明されていません。困ったものです。

ひとまず、使えるところまでやったので備忘録として残しておきます。

まずはmemcachedのインストール。php拡張のpeclで提供されているmemcachedも一緒に入れます。
!! ここで注意 !! php-pecl-memcache を入れると動きません!!!

peclにはmemcachとmemcachedという2つの拡張クラスが用意されているのですが、
codeigniterのドライバでサポートされているのは「memcached」の方です。お間違いなく。

# インストール
$ yum install memcached php-pecl-memcached
# memcached起動
$ /etc/init.d/memcached start
# 自動起動設定
$ chkconfig memcached on

# 確認
$ memcached-tool localhost
$ php -i | grep memcached

# apache再起動
# /etc/init.d/httpd restart

※確認用なのでmemcachedをデフォで起動しています。

そして問題の設定ファイル。これはコアソースで書式が確認できます。
設定例は下記です。

<?php if ( ! defined('BASEPATH')) exit('No direct script access allowed');

$config['memcached'] = array(
    'hostname' => '127.0.0.1',
    'port'     => 11211,
    'weight'   => 1
);

#複数のサーバを設定する場合の例
$config['memcached2'] = array(
    'hostname' => '127.0.0.2',
    'port'     => 11211,
    'weight'   => 1
);
?>

複数のサーバへ接続する場合は配列のキーを変えて複数設定します。
キー名はネームスペースなので任意の命名で大丈夫なようです。

テスト用のコントローラからアクセス。「memcached test」と表示されれば成功です。

<?php if ( ! defined('BASEPATH')) exit('No direct script access allowed');

class test extends CI_Controller {
        public function test()
        {
                $this->load->driver('cache', array('adapter' => 'memcached'));
                $this->cache->save('memcached test', 111, 3600);
                var_dump($this->cache->get('memcached test'));exit;
        }
}

これでひとまずmemcachedが容易に使えるようになりましたね。
モデルから取得した情報やWebAPIから取得した情報など、色々キャッシュしてみてください。

では、良いCodeigniter & Memcachedライフを。

Mac OS XにSpiderMonkey 1.8.5 をインストールする

MacにSpiderMonkeyをインストールする方法はいくつかある。

1. Homebrewでインストール(ver.1.8.5)
2. macportsでインストール(ver.1.7.0)
3. ソースでインストール

brewインストールを使う場合は非常に簡単にインストールできる。
homebrewが入っていない場合はインストールから

$ ruby -e "$(curl -fsSLk https://gist.github.com/raw/323731/install_homebrew.rb)"

SpiderMonkeyを入れる。

$ brew install spidermonkey

!! Error: MD5 mismatch が出るときは

$ brew update

してから再度インストールを実行して下さい。

次にMac Portsの場合。これも簡単。

$ sudo port install spidermonkey

ただし、現在はバージョン1.7.0がインストールされるのでバージョンを上げたい場合は、
自力でアップデートする必要がある。
portsからhomebrewへの以降が面倒で、ひとまず動きを確認したい方はこれで十分。

自分はコンパイルオプションをカスタマイズしてインストールしたかったので、
ソースから入れました。

手順はこちら。

#インストール下準備
$ sudo port selfupdate
$ sudo port sync
$ sudo port install libidl autoconf213 yasm
#ここからSpiderMonkeyのインストール
$ wget http://ftp.mozilla.org/pub/mozilla.org/js/js185-1.0.0.tar.gz
$ tar xvzf js185-1.0.0.tar.gz
$ cd js-1.8.5/js/src/
$ autoconf213
# デバッグを有効にしてオプティマイズを無効にしてコンパイル
$ ./configure --enable-debug --disable-optimize
$ make
$ sudo make install

これでインストール完了。
js と打つとコンソールが起動するので、ハローワールド打ってみましょう。

$ js
js> print('hello world!!');
hello world!!
js> quit();

問題なく表示されたら動作の確認もOKです。

楽しいJSライフを。