ラベル php の投稿を表示しています。 すべての投稿を表示
ラベル php の投稿を表示しています。 すべての投稿を表示

2011年6月26日日曜日

PHPで写真共有サイト構築 -5 写真ダウンロード

最後は写真ダウンロード処理。

実はこれはまだ途中。
本当はダウンロードボタンを押した際にプログレスバーを表示したいが、その対応はまだ・・・。

ま、とりあえず今回の対応のポイントは1つ。

  1. systemコマンドでファイルを圧縮してダウンロード
systemコマンドでファイルを圧縮するために、圧縮元のファイルと圧縮後のファイル名を引数で取得。
//ダウンロードするファイル
$selectFiles = $_POST["selectFiles"];
$zipFile = $_POST["zipFile"];

// zipファイル文字列作成
$fileCnt = count($selectFiles);
for($i=0; $i<$fileCnt; $i++){
  $zipFiles .= $selectFiles[$i];
  $zipFiles .= " ";
}
あとはそれをもとにsystemコマンドを発行。
// 圧縮
$re = system("zip -r $zipFile $zipFiles");
これだけで複数ファイルのダウンロード可能。
まー、プログレスバー出したりいろいろ使い勝手よくする方法はあるとおもうけど、
とりあえずやりたいことはこれで完成!!

PHPで写真共有サイト構築 -4 写真アップ表示

今回はthumbnail画像をクリックした際の実際のimage用(target)写真の表示。

実は前回のList表示のソースで以下のように画像クリック時にimgview.phpという処理を呼び出すようにしていた。その処理。
echo "";
  echo "";
thumbnail画像をクリックしてやりたいことは、

  • target画像(大きい画像)の表示
  • List表示時の前後のファイルへの移動
で、ポイントは
  1. target写真のパスと、image用写真ディレクトリパスを引数で受け取る
  2. image用写真ディレクトリパスから全ファイルを取得し、mageファイルをソート順で取得
  3. 2で取得した情報とtarget写真パスで、target写真の前後の写真パスを取得
まず、1のパスの取得は今まで通り取得し2のファイルソートも前回のList表示時のソート処理と同様に取得。
 read())){
  //ファイル名配列に順に入れていく
  array_push($array_file, $file_name);
}
sort($array_file);
$ch_dir -> close();
つづいて3のtargetの前後写真のパス取得は、以下のような簡単なロジック。
$getFlg = FALSE;
//ディレクトリ内の画像を一覧表示
foreach ($array_file as $key => $val) {
  $file_name = $val;
  if ($file_name !== "." && $file_name !== "..") {
    $image_path = $dir_path .$file_name;

//    echo $image_path ."
";
    if ($getFlg) {
      $next_file = $image_path;
      break;
    }
    if ($target_file == $image_path) {
      $getFlg = TRUE;
    }
    if (!$getFlg) {
      $before_file = $image_path;
    }
  }
}
最後に、それらの情報を表示する。
if ($before_file){
  echo "前の写真";
}

//画像かどうか?
if (@getimagesize($target_file)){
  echo "";
}

if ($next_file){
  echo "次の写真";
}
ダウンロードボタンを作ってよかったけど、今回は画像Listからの一括ダウンロード処理を対応するようにしたので、ここにはなし。

ということで、次回は最後のファイルダウンロード処理。

2011年6月20日月曜日

PHPで写真共有サイト構築 -3 ファイルリスト表示

今回はアップロードされたファイル一覧を表示する。

一覧表示するまえの画面からは写真アップされたDir(photoDir)が
渡される。

ディレクトリ構成としては、

photoDir/images

              /thumbs
以下ポイント。
  1. サムネイル画像ディレクトリ内のファイルを検索して取得
  2. ソート処理でファイル名をソート
  3. サムネイル画像クリック時にimages画像を表示できるようにリンクをつける
  4. cssのclear='left'で5枚ごとにサムネイルを改行

まず、1.のサムネイル画像ディレクトリのファイル検索方法。
PHPでディレクトリが存在するかどうかと読み込み可能かのチェックを行う。

それでOKならdir関数を使ってディレクトリクラスを取得する。

if (is_dir($thumbDir) and ($thumbDir != "/")) {
    if(is_readable($thumbDir)){// — ファイルが読み込み可能かどうか
      $ch_dir = dir($thumbDir); //ディレクトリクラス

つぎに2.のソート処理を行う。
あらかじめupload時に写真作成日時でファイル名を作成しているので、ソートすることで
時系列に一覧を表示できる。

ソート処理はarray関数で配列を作成し、そこにarray_push関数でファイル名を詰め込んだ後、
sort関数を呼び出せばOK。

// ソート処理
      $array_file = array();
      while (false !== ($file_name = $ch_dir -> read())){
        //ファイル名配列に順に入れていく
        array_push($array_file, $file_name);
      }
      sort($array_file);
      $ch_dir -> close();


後は4.ソートされたファイル名をもとにサムネイルを並べるとともに、
そこにリンクをはる。

またその際に、5.cssのclear='left'でサムネイル画像の回り込みを解除することで
改行するようにする。今回は5つ画像を表示すればが改行する。

//ディレクトリ内の画像を一覧表示
      foreach ($array_file as $key => $val) {
        $file_name = $val;
        $thumb_path = $thumbDir .$file_name;
        $image_path = $imageDir .$file_name;
        if (@getimagesize($thumb_path)){ //画像かどうか?
          echo "
"; echo ""; echo ""; echo ""; echo "
"; $cnt++; } if ($cnt>=5) { echo "
"; $cnt = 0; } }

これで一覧表示は完了!!

2011年6月9日木曜日

PHPで写真共有サイト構築 -2 実際のアップロード処理

今回は実際のアップロード処理について。

前回までにPHPのアップロード処理を呼ぶまでの前処理について説明。

http://kenzy-goldentime.blogspot.com/2011/06/php-2lastmodifieddate.html

今回のポイント

  1. アップロード先、ファイル数、ファイル名をパラメータで受け取る
  2. $_FILES属性でアップロード元情報とアップロード先情報を取得
  3. 写真が横長か縦長かを判定し、見える方向で画像を登録
  4. image用とthumbnail用の画像を作成
です。
まず1.のPHPとして受信した情報の取得について。
以下コード
  $photoDir = $_POST["photoDir"];
PHPでPOSTのパラメータを取得するには、$_POST["パラメータ名"]で取得可能。


次に2.の$_FILESについて。
変数「$_FILE」には、アップロードされたファイル情報が連想配列で格納されるらしい。
http://www.php-ref.com/web/03_move_uploaded_file.html
で、とりあえず今回使用する$_FILES属性は

  • $_FILE[ パラメータ名 ][ tmp_name ] →アップロード前の一時保存パス
  • $_FILE[ パラメータ名 ][ name] →アップロードファイル名
まずは上記のパラメータからtmp_nameから実際にそのファイルがあるかを判定。以下ソース
if (is_uploaded_file($tmpName)) {
次に3.getimagesizeを使用してサイズを取得し、横長か縦長かを判定。
$Jsize=getimagesize("$tmpName"); //画像サイズ取得

    // 横長写真
    if ($Jsize[0] > $Jsize[1]) {
      $Jthumsize = $Jsize[0];
      $SizeWidth = true;
    // 縦長写真
    } else {
      $Jthumsize = $Jsize[1];
      $SizeWidth = false;
    }
最後に4.image用とthumbnail用に画像を圧縮。
以下ソース。
function imageComplex($pixel, $Jsize, $Jthumsize, $SizeWidth, $motoFile, $complexFile){
  if($Jthumsize >= $pixel + 1){ //121ピクセル以上なら
    if ($SizeWidth) {
      $Jwidth = $pixel; //横120ピクセル
      $Jheight = $Jsize[1] * $pixel / $Jsize[0]; //縦サイズを計算
    } else {
      $Jwidth = $Jsize[0] * $pixel / $Jsize[1]; //横サイズを計算
      $Jheight = $pixel; //縦120ピクセル
    }
    $imagein=imagecreatefromjpeg("$motoFile"); //画像を縮小する
    $imageout=imagecreatetruecolor($Jwidth,$Jheight); //サイズ変更(GD2使用)
    imagecopyresampled($imageout,$imagein,0,0,0,0,$Jwidth,$Jheight,$Jsize[0],$Jsize[1]);
    imagejpeg($imageout,("$complexFile")); //サムネイル書き出し
    imagedestroy($imagein); //メモリを解放する
    imagedestroy($imageout); //メモリを解放する
  }
    else {//画像の横幅がもともと120ピクセル以下の場合は [thumbs] ディレクトリにコピーします。
    copy("$motoFile","$complexFile"); //ファイルコピー
  }
}
以下1~3のコード
if (is_uploaded_file($tmpName)) {
  $image =  $imageDir . $fileName;
  $thumb =  $thumbDir . $fileName;
    $Jsize=getimagesize("$tmpName"); //画像サイズ取得

    // 横長写真
    if ($Jsize[0] > $Jsize[1]) {
      $Jthumsize = $Jsize[0];
      $SizeWidth = true;
    // 縦長写真
    } else {
      $Jthumsize = $Jsize[1];
      $SizeWidth = false;
    }

    // image圧縮
    imageComplex(1600, $Jsize, $Jthumsize, $SizeWidth, $tmpName, $image);

    // thumb圧縮
    imageComplex(120, $Jsize, $Jthumsize, $SizeWidth, $tmpName, $thumb);


    chmod($image, 0644);
    echo $fileName . "をアップロードしました。";

} else {
  echo "ファイルが選択されていません。";
}
とまー、PHPで書くとスクリプト言語でデバッグしやすいかな。
ただ統一感をだすにはCAKEとかのフレームワークつかっていいかも。

2011年6月5日日曜日

PHPで写真共有サイト構築 -1 ファイルアップロード前準備 ファイル選択やらlastModifiedDateやら

では今回は実際に今回作成した写真アップロード処理だー。

<機能>
  • アップするフォルダを選択可能
  • 複数ファイルを選択可能
  • サムネイル一覧を表示可能
  • サムネイル一覧から複数選択でダウンロード可能
  • サムネイル選択後、実サイズの写真表示時に次ボタン、前ボタンでサムネイル一覧の前後の写真を表示
上記機能を実現するにあたり以下の機能も必要
  • アップ時にサムネイル用画像作成
  • 実ファイルも一定サイズを超えるとサーバに負荷がかかるため、一定サイズで圧縮
  • アップするファイル名は写真撮影時の情報でソートできるように撮影時の時間でリネイムする
ではまずは今回はファイルのアップロードを作成するに必要な処理を説明。


ファイルをアップロードするには当然ユーザに

  1. ローカルファイルを選択させ
  2. 送信ボタンを押下
させる必要あり。でユーザが2送信ボタンを押下したところで、htmlのformをつかってphpのファイルアップロード処理を呼び出す。

今回2を送信する前にやるべきことについて。
ポイントは、
  1. ファイル選択させる方法として、HTML5から可能になった複数ファイル選択させる
  2. ファイル選択した際にファイル属性からファイル作成日を取得しておく
1はHTML5の機能なので簡単。以下参照。
2はJavascriptのlastModifiedDateで取得可能
以下ソース。
function setFileCnt(form){
  var files = document.getElementById("selectFile").files;
  var fileCnt = form.fileCnt;
  var h = "";
  var n = "";
  var fName = "";
  var fileLen = files.length;
  for (var i = 0; i < fileLen; i++) {
    var file = files[i];

    // 最終更新日を取得
    var modifileDate = file.lastModifiedDate;
    var date = new Date(Date.parse(modifileDate));
    var yy = date.getYear();
    var MM = date.getMonth() + 1;
    var dd = date.getDate();
    var hh = date.getHours();
    var mm = date.getMinutes();
    var ss = date.getSeconds();
    if (yy < 2000) { yy += 1900; }
    if (MM < 10) { MM = "0" + MM; }
    if (dd < 10) { dd = "0" + dd; }
    if (hh < 10) { hh = "0" + hh; }
    if (mm < 10) { mm = "0" + mm; }
    if (ss < 10) { ss = "0" + ss; }
    fName += yy + MM + dd + "_" + hh + mm + ss + "";
    fName += ":";
    form.filesName.value = fName;
  }    
}
ポイントはファイルfile属性のlastModifiedDateで取得したデータをnew DateでData型にしてから日付を編集すること。以下が実際にできるファイル名。

  元ファイル名:IMG_2186.JPG
  作成日:2011/05/21 09:16 40秒
  作成されるファイル名:20110521_091640_IMG_2186.JPG

どす。これでファイルアップロードした先でもソート楽ちん!!

2011年6月3日金曜日

PHP 入門 -1

ひょんなことからApatchサーバに写真共有サイトを作ることになったわたくし。

JavaやJavaScript、Rubyは何となく使っていたけど、それらを使えないサーバにどうやって作ろうかあれこれ考えた結果、PHPが使えることが分かったため、ついにPHPを使うことになりました!

ということで、写真共有サイトを作るにあたって学んだことをまとめます。


でまずやったことはPHPの基礎を学ぶこと。
以下サイトを参考にさせていただきました。

http://www.scollabo.com/banban/php/index.html


<学んだこと>
  • 拡張子はphp
  • <?php ~ ?>でソースは囲む
  • 変数の宣言使用はすべて「$」を頭につける 例 $name = "kenzy";
  • 文字列連結はドット「.」を使う
  • booleanやstringの変数が使える
  • 条件文もCチックに使える
一番簡単なコード

<?php echo "こんにちは";
?>

とまあ、こんな感じで簡単に使用できる。


<PHPのいいところ>
    • なんといってもスクリプトなのでコンパイル不要!
    • 文法もJavascript等のスクリプトをやっていたらすぐ理解できる
    • それいでいてサーバサイドの処理が書けてしまう

    人気者なわけですは。
    次回はファイルアップロードについて記載しやす。

    【スマート農業】 いまさらだけど、いまだからこその農業IoT 

    久々投稿 転職してはや2年半。バタバタしてる中で、あーっという間に時間は過ぎてきた。 仕事はそれなりに順調だけど、ただやっぱり自分で何かを起こす!ということはではできていなく、、、年齢45をこえ、、、、、とくに昔からずーとやろうやろうと言って実現できてなかっった農業IoT。。 去...