ApacheでSSIを使えるようにする

Options +Includes
AddHandler server-parsed html

execを有効にしない場合

Options +IncludesNOEXEC

拡張子がshtmlのファイルのみSSIを有効にしたい場合

AddHandler server-parsed shtml

htmlファイルにコードを記述

<!--#include file="Include.html" -->
<!--#include virtual="../include/Include.html" -->

<!--#include file="../file/oooo.html" -->

<!--#include file="oooo.html" -->
<!--#include file="file/oooo.html" -->

<!--#include virtual="../file/oooo.html" -->
<!--#include virtual="/file/oooo.html" -->

RewriteEngine On
RewriteBase / # 1.No enter except MOBILE(SMART)
RewriteCond %{REQUEST_URI} ^/mb/
RewriteCond %{HTTP_USER_AGENT} ^.*(iPhone|iPod|Android).*$
RewriteRule ^mb(.*)$ sm$1 [R]
# 2.No enter except MOBILE(PC)
RewriteCond %{REQUEST_URI} ^/mb/
RewriteCond %{HTTP_USER_AGENT} !^(DoCoMo|J-PHONE|KDDI|DDIPOKET|UP\.Browser|J-PHONE|Vodafone|SoftBank).*$
RewriteRule ^mb(.*)$ $1 [R]
# 3.No enter except SMART(MOBILE)
RewriteCond %{REQUEST_URI} ^/sm/
RewriteCond %{HTTP_USER_AGENT} ^(DoCoMo|J-PHONE|KDDI|DDIPOKET|UP\.Browser|J-PHONE|Vodafone|SoftBank).*$
RewriteRule ^sm(.*)$ mb$1 [R]
# 4.No enter except SMART(PC)
RewriteCond %{REQUEST_URI} ^/sm/
RewriteCond %{HTTP_USER_AGENT} !^(DoCoMo|J-PHONE|KDDI|DDIPOKET|UP\.Browser|J-PHONE|Vodafone|SoftBank|.*iPhone|.*iPod|.*Android).*$
RewriteRule ^sm(.*)$ $1 [R]
# 5.No enter except PC(MOBILE)
RewriteCond %{REQUEST_URI} !^/mb/
RewriteCond %{REQUEST_URI} !^/sm/
RewriteCond %{HTTP_USER_AGENT} ^(DoCoMo|J-PHONE|KDDI|DDIPOKET|UP\.Browser|J-PHONE|Vodafone|SoftBank).*$
RewriteRule ^(.*)$ mb/$1 [R]
# 6.No enter except PC(SMART)
RewriteCond %{REQUEST_URI} !^/mb/
RewriteCond %{REQUEST_URI} !^/sm/
RewriteCond %{HTTP_USER_AGENT} ^.*(iPhone|iPod|Android).*$
RewriteRule ^(.*)$ sm/$1 [R]

FacebookボタンがあるAndroidアプリをよく見かけると思いますが、その組込み方の紹介をしたいと思います。
今回は、Facebook認証からウォール投稿できるまでの処理を組み込んでいきます。
設置の流れとしては、以下の流れとなります。

(1)Facebook-sdk-androidのダウンロード（ライブラリのダウンロード）
(2)Eclipseでライブラリプロジェクトの作成
(3)Androidアプリプロジェクトの生成
(4)FacebookにAndroidアプリを登録
(5)ソースの組込

(1)Facebook-sdk-androidのダウンロード（ライブラリのダウンロード）

ライブラリをダウンロードページからダウンロードします。（保存先は任意の場所でいいです。）

(2)Eclipseでライブラリプロジェクトの作成

(1)のライブラリプロジェクトの作成をします。

(3)Androidアプリプロジェクトの生成

EclipseでFacebookのAPIを使うAndroidアプリを作成してください。
[ファイル] > [新規] > [Ａｎｄｒｏｉｄプロジェクト] を実行します。

作成出来たら(2)で作成したライブラリを読み込ませます。
[プロジェクト右クリック] > [プロパティ] > [Android] を実行。
ライブラリーの追加ボタンを押して、(2)のライブラリを選択してください。

(4)FacebookにAndroidアプリを登録

1 Create New App選択

2 App名登録

3 必要情報を登録(特にデフォルトで何も変更しなくてもよいです。APPIDを控えておく）

(5)ソースの組込

1 AndroidManifest.xmlに次のソースを組みこむ

＜uses-permission android:name="android.permission.INTERNET"＞＜/uses-permission＞

2 FacebookのアプリにKey Hashを記入する

●デバッグキーハッシュを確認する

[ウィンドウ（W）] > [設定] > [Android(ビルド) ]を実行。
「デフォルト・デバッグ・キーストア」の箇所を確認。控えておきます。 ●コマンドプロンプトを立ち上げて、以下のキーを起動

        keytool -exportcert -alias androiddebugkey -keystore "上記のデバッグキーハッシュパス" | openssl sha1 -binary | openssl base64
        

Activityファイルのサンプルコード

      package face.gp;
      
      import com.facebook.android.AsyncFacebookRunner;
      import com.facebook.android.DialogError;
      import com.facebook.android.Facebook;
      import com.facebook.android.FacebookError;
      import com.facebook.android.Facebook.DialogListener;
      
      import android.app.Activity;
      import android.content.Intent;
      import android.content.SharedPreferences;
      import android.os.Bundle;
      import android.preference.PreferenceManager;
      import android.util.Log;
      import android.widget.Toast;
      
      public class Facetest2Activity extends Activity {
      
      Facebook facebook = new Facebook("アプリID"); // Facebookアプリの登録されたIDを入れる
      AsyncFacebookRunner masync = new AsyncFacebookRunner(facebook);
      
      private int mAuthAttempts = 0;
      private String mFacebookToken;
      
      /** Called when the activity is first created. */
      @Override
      public void onCreate(Bundle savedInstanceState) {
      super.onCreate(savedInstanceState);
      setContentView(R.layout.main);
      auth();	// 認証
      }
      
      /*
      * セッションの保存
      */
      private void saveFBToken(String token, long tokenExpires){
      SharedPreferences prefs = PreferenceManager.getDefaultSharedPreferences(this);
      prefs.edit().putString("FacebookToken", token).commit();
      }
      
      
      /*
      * 認証部分
      */
      private void fbAuthAndPost(){
      if(mFacebookToken.equals("")){
      facebook.authorize(this, new String[]{"publish_stream"}, new DialogListener() {
      
      @Override
      public void onComplete(Bundle values) {
      Log.d(this.getClass().getName(),"Facebook.authorize Complete: ");
      saveFBToken(facebook.getAccessToken(), facebook.getAccessExpires());
      updateStatus(values.getString(Facebook.TOKEN));
      }
      
      @Override
      public void onFacebookError(FacebookError error) {
      Log.d(this.getClass().getName(),"Facebook.authorize Error: "+error.toString());
      }
      
      @Override
      public void onError(DialogError e) {
      Log.d(this.getClass().getName(),"Facebook.authorize DialogError: "+e.toString());
      }
      
      @Override
      public void onCancel() {
      Log.d(this.getClass().getName(),"Facebook authorization canceled");
      }
      });
      }
      }
      
      @Override
      protected void onActivityResult(int requestCode, int resultCode,Intent data) {
      super.onActivityResult(requestCode, resultCode, data);
      switch (requestCode){
      case Facebook.DEFAULT_AUTH_ACTIVITY_CODE:
      facebook.authorizeCallback(requestCode, resultCode, data);
      }
      }
      
      /*
      * 最初に動く処理
      */
      private void auth(){
      
      mAuthAttempts = 0;
      
      SharedPreferences prefs = PreferenceManager.getDefaultSharedPreferences(this);
      mFacebookToken = prefs.getString("FacebookToken", "");
      
      if(mFacebookToken.equals("")){
      fbAuthAndPost();
      }else{
      updateStatus(mFacebookToken);
      }
      
      }
      
      /*
      * ウォール投稿を表示する処理
      * 
      */
      public void updateStatus(String accessToken){  
      
      /************
      * ウォールに投稿
      ************/
      Bundle bundle = new Bundle();
      
      bundle.putString("message", "");
      bundle.putString("link", "URL");
      bundle.putString("name", "テスト");
      bundle.putString("caption", "キャプション");
      bundle.putString("picture", "<img URL>");	
      bundle.putString("description", "アプリ説明");
      
      /*　Facebookダイアログ表示 */
      facebook.dialog(Facetest2Activity.this, "feed", bundle, new DialogListener() {
      
      public void onComplete(Bundle values) {   
      
      }
      
      public void onFacebookError(FacebookError e) {
      }
      
      public void onError(DialogError e) {
      }
      
      public void onCancel() {
      }
      });    	
      } 
      }
      
      

各関数の説明

ウォール投稿部分のソースの説明

bundle.putString("link", "リンクURL");
bundle.putString("name", "題名");
bundle.putString("caption", "キャプション名");
bundle.putString("picture", img URL);	
bundle.putString("description", "説明");

サンプルコード

ダウンロード

サンプル

1.Getting Jumpy

2.Sunshine and Sailing

3.Ferris Wheel and Roller Coaster

4.Solar System

5.Planet Earth

6.Time Clock

Adobe Edge を使ってみた

早速プレビュー版をダウンロードして簡単なものを作ってみました。
今回作るものは、よくあるサイトトップの画像が切り替わるフラッシュと同じものです。

1.起動画面

2.新しくプロジェクトを作成します

3.画像追加

4.イベント追加

5.完成

デモを見てみる


Flashを作るような感覚で、すごく楽に作ることが出来ました。
書き出したJSファイルも割りと整理されている印象を受けました。
これらのファイルを直接編集することも十分出来そうです。
Adobe Edgeの今後の動向に注目です。

ちなみに、HTML5なのでIEをどうするかは悩みどころですね。

(tsubasa)

function main(){

	// 初期処理
	$inputData = getData();

	// 検索ボタン押された場合
	if(isset($inputData['search'])){

		//入力情報GET
		$inputData = getData();

		//入力内容チェック
		$error = check ($inputData);

		if ($error['flg']){
			//エラー表示
			disp($inputData,$error);
			return;
		}

		//郵便番号APIのURLを設定
	  	$url = 'http://zip.cgis.biz/xml/zip.php?zn='.$inputData['zipnum1'].$inputData['zipnum2'];

	    //郵便番号APIから入力された郵便番号の情報を取得
	    $xmlData  =file_get_contents($url);
	    $xmlParser = xml_parser_create();
	    xml_parse_into_struct($xmlParser,$xmlData,$addressData);
	    xml_parser_free($xmlParser);

	    //取得データをセット
	    $setData = setData($addressData,$inputData);

	    //セットされたデータをチェック
	    $error = check($setData);

		if ($error['flg']){
			//エラー表示
			disp($setData,$error);
			return;
		}

		disp($setData);
	}else{
		disp($inputData);
	}

}

//郵便番号APIのURLを設定
$url = "http://zip.cgis.biz/xml/zip.php?zn=".$inputData["zipnum1"].$inputData["zipnum2"];
//郵便番号APIから入力された郵便番号の情報を取得
$xmlData  =file_get_contents($url);

	    $xmlParser = xml_parser_create();
	    xml_parse_into_struct($xmlParser,$xmlData,$addressData);
	    xml_parser_free($xmlParser);
	    //取得データをセット
	    $setData = setData($addressData);

Flash CS4 でデフォルトのスクリプトフォントは、「MS UI Gothic」となっています（Windows）。
このフォントは等幅ではないので、コードが見づらくなります。

例えば、エディタで綺麗に記述していたコードをCS4に貼り付けた場合、
整列がばらばらになったりします。

そこで、環境設定でフォントを変えるとこのような問題はなくなります。

1.メニューバーの「編集」=>「環境設定」を選択

2.カテゴリ「ActionScript」のフォントを「_等幅」に変更

これで、整列されたコードを記述できます。

デフォルトの「MS UI Gothic」フォントの場合


「_等幅」に変更した場合

デフォルトのままだと、カンマやドットといった文字を見落としてしまう場合があるので、

変更しておくことをオススメします。

(tsubasa)

ブログ等でよく紹介されているクラスですが、
細かい解説サイトなどがなかったので、こちらで紹介してみようと思います。
（誤りや訂正等ございましたら情報をお寄せ下さい）

PHP+GDライブラリを使用し、画像変換の処理をかんたんに行ってくれるクラスです。

上記サイトから圧縮ファイルをダウンロードし、
解凍をすると下記のようなディレクトリ構成になっています。

index.phpを開いてみましょう。

下記のPHPスクリプトに注目です。

上から順に見てみますと、
最初にクラスファイルを読み込み、
その後に「$imgSizer->」で画像リサイズの詳細設定をしています。

各項目設定の内容を下記に簡単にご紹介します。

$imgSizer->type = "width";
画像をリサイズする縦横の基本設定を行います。
設定できるタイプは、「width」と「height」です。

$imgSizer->max = 100;
リサイズするピクセルサイズを指定します。
$imgSizer->type = "width"の場合、幅が100ピクセル
"height"の場合は高さが100ピクセルになります。

$imgSizer->quality = 8;
画質の調整が行えます。
1〜10までの設定が可能です。
数字が高ければ画質が高くなります。

$imgSizer->square    = true;
画像のリサイズ方法に関する設定です。
設定できる値は、「true」と「false」です。
true:画像の中心を基本とし、正方形で画像をリサイズする。
false:縦横の比率を維持してリサイズする。

$imgSizer->prefix    = "sml_";
リサイズした画像名の先頭に付加する名称を指定できます。
例：元画像が「test.jpg」→リサイズ後「sml_test.jpg」

$imgSizer->folder    = "_sized/";
リサイズした画像を保存するディレクトリを指定します。
デフォルトでは、リサイズ元の画像と同階層のディレクトリにフォルダが作成されます。

以上が基本の設定になります。

そして、最後にリサイズ元の画像を設定します。
$imgSizer->image     = "/PHP_ImageSizer/images/test.jpg";
デフォルトの状態では画像のパス指定は、ルートパス指定になります。

各設定が完了しましたら、
「$imgSizer->resize()」を実行します。

実行後は、リサイズされた画像のパスが返ってきます。
この値を、「<img>」タグに設定すると画像が表示できます。

PHPの記述最後の部分は、画像を配列変数に登録し、
それぞれ画像のリサイズ処理をして出力している。
というスクリプトになります。

次にclassファイルの方も少し見てみましょう。

下記の部分ですが、

この記述により「index.php」で設定した項目を、
分解・結合等を行い、最後に画像リサイズ処理を行っています。

$_SERVER['DOCUMENT_ROOT']で、パス指定を行っていますので、
ドキュメントルートの指定を外したい場合は、
この部分を修正し、カスタマイズ等を行うと、
自分の仕様で画像処理スクリプトを作成する事が可能です。

簡単な説明になりましたが以上になります。

今回紹介させて頂きましたクラス以外にも、
画像リサイズ処理は数多く配布されていると思いますので、
いろいろ試してみて、自分にあったスクリプトを見つけるのもいいかもしれないです。

その他のライブラリ
・Image Resizing Made Easy with PHP 
・target="_blank"Icebeat | class.image

 (hirohito)

// ボタン格納配列
var btn_array:Array = new Array(btn1_mc, btn2_mc, btn3_mc, ...);

for(var i:int=0; i<btn_array.length; i++){
    // マウスイベント登録
    btn_array[i].addEventListener(MouseEvent.CLICK, onMouseClickHandler);
}

/**
 * マウスイベント
 */
function onMouseClickHandler(e:MouseEvent):void
{
    var btn_mc:MovieClip = MovieClip(e.target);
    // "btn_mc"って、btn_array配列のどのボタンが押された？
}

for(var i:int=0; i<btn_array.length; i++){
    // 識別id追加
    btn_array[i]._id = i;
    // マウスイベント登録
    btn_array[i].addEventListener(MouseEvent.CLICK, onMouseClickHandler);
}

/**
 * マウスイベント
 */
function onMouseClickHandler(e:MouseEvent):void
{
    // btn_array[e.target._id] が押されました！
}

// 画像ファイル名格納配列
var img_array:Array = new Array('img1.jpg', 'img2.jpg', 'img3.jpg', ...);

for(var i:int=0; i<img_array.length; i++){
    var myLoader:Loader = new Loader();
    myLoader._id = i;    // プロパティを追加できない、※エラー
    myLoader.contentLoaderInfo.addEventListener(Event.COMPLETE, onCompleteHandler );
    // 読み込み開始
    myLoader.load(new URLRequest(img_array[i]));
}

/**
 * 読み込み完了イベント
 */
function onCompleteHandler(e:Event):void
{
    // どの画像が読み込み完了した？
}

この関数は、次の例のように、Event オブジェクトを唯一のパラメータとして受け取り、
何も返さないものである必要があります。
function(evt:Event):void

/**
 * リスナー関数
 */
function(e:Event):void
{
    
}

for(var i:int=0; i<img_array.length; i++){
    var myLoader:Loader = new Loader();
    myLoader.contentLoaderInfo.addEventListener(Event.COMPLETE, onCompleteHandler(i));
    
    // 読み込み開始
    myLoader.load(new URLRequest(img_array[i]));
}

/**
   * 読み込み完了イベント
   */
function onCompleteHandler(_num:int):Function
{
    // img_array[_num] 画像が読み込み完了しました！
    
    return function(e:Event):void;
}