SlideShare ist ein Scribd-Unternehmen logo
1 von 10
1	
Copyright (c) HEART QUAKE All rights reserved .	
画像ファイルの登録
2	
Copyright (c) HEART QUAKE All rights reserved .	
処理理の流流れ
画像を指定する1 2 3
HTML
HTMLから情報をもらう
&画像をサーバーに転送
情報を登録する
PHP SQL
3	
Copyright (c) HEART QUAKE All rights reserved .	
画像の登録(1/6)
l  ゴールイメージ
-  指定された画像情報をデータベースに登録する  
ようなアプリケーションを作ってみましょう。
⼊入⼒力力画⾯面
HTML
4	
Copyright (c) HEART QUAKE All rights reserved .	
画像の登録(2/6)
l  ⼊入⼒力力された画像を指定しよう!
-  まずは画像選択の⼊入⼒力力欄を表⽰示する
この上は省略
<form action="image_input.php"
method="POST" enctype="multipart/form-data" >
画像のファイル名を入力してください(最大64KByte)	
 
	
 <input size="30" type="file" name="upfile">
<input type="hidden" name="MAX_FILE_SIZE"
value="65536”>
<br>
<input type="submit" name="submit" value="送信”>
</form>
</body></html>
画像を指定するときは
このように書く
画像はtype=”file”
HTML
画像の最⼤大サイズを指定
5	
Copyright (c) HEART QUAKE All rights reserved .	
処理理の流流れ
画像を指定する1 2 3
HTML
HTMLから情報をもらう
&画像をサーバーに転送
情報を登録する
PHP SQL
6	
Copyright (c) HEART QUAKE All rights reserved .	
画像の登録(3/6)
l  画像データの登録に関して
-  データベースに画像ファイルを保存するのではなく、
-  画像ファイル名だけをデータベースに保存する。
-  肝⼼心の画像ファイルはサーバーに保管する。
画像を指定する1 2
3
HTML
HTMLから情報をもらう
&画像をサーバーに転送
画像ファイル名は
データベースに保管
PHP
4 画像ファイル⾃自体は
サーバーに保管
7	
Copyright (c) HEART QUAKE All rights reserved .	
画像の登録(4/6)
l  画像データの保存フォルダの作成
-  サーバー上に画像データ保存⽤用のフォルダを作成します
「…」フォルダをクリック1
2 右クリックして
Create  directory
3 フォルダ名はimg
4 imgフォルダを右クリック
してFile  permissionsを
クリック
5 777にしてOK
8	
Copyright (c) HEART QUAKE All rights reserved .	
画像の登録(5/6)
<?php
$error = $_FILES['upfile']['error'];
if ($error == 2){
echo "画像のサイズが大きすぎます!”;
}else{
//画像を保管するサーバーのフォルダを指定する
//FTP(FileZilla)ユーザ名部分はサーバー情報を見て変更すること!
$dir = ’ /home/ユーザ名/public_html/img/’;
$file = $dir.basename( $_FILES['upfile']['name'] );
//次のページでここにプログラムを追加する
}
?>
HTML側で指定した最⼤大サイ
ズよりも画像のサイズが⼤大き
い場合はエラーは2となる。
http://webtech-walker.com/
archive/
2007/09/20143717.html
PHP
HTMLで指定された画像のファイル名は
$_FILES[’HTMLで指定したname']
['name']
に⼊入っている。
9	
Copyright (c) HEART QUAKE All rights reserved .	
画像の登録(6/6)
//前のページの続き
$file = $dir.basename( $_FILES['upfile']['name'] );
	
 
	
 if(file_exists($file)){
echo "既に同名の画像が存在するため、別名にしてください。";
}else{
if( move_uploaded_file($_FILES['upfile']['tmp_name'],
$file) ) {
//データベースに画像ファイル名を登録するプログラムを書く	
 	
 	
 	
 	
 	
 	
 	
 	
 	
 
}else{
echo "ファイルのアップロード失敗";
}
}
}
?>
サーバーに同じファイル名の
画像があればエラーとする。
PHP
move_uploaded_file関数
によって指定した画像ファイルが
サーバーに保管=アップロードされる
FileZillaで提出しているのとやっている
ことは同じ。
10	
Copyright (c) HEART QUAKE All rights reserved .	
お疲れ様でした!!

Weitere ähnliche Inhalte

Andere mochten auch

Prezentacja4
Prezentacja4Prezentacja4
Prezentacja4
PaszekINC
 
BeyondRoofing_Brochure_Final %281%29
BeyondRoofing_Brochure_Final %281%29BeyondRoofing_Brochure_Final %281%29
BeyondRoofing_Brochure_Final %281%29
Christopher Logan
 
Reference letter for Carla Villanueva
Reference letter for Carla VillanuevaReference letter for Carla Villanueva
Reference letter for Carla Villanueva
Carla Villanueva
 
папка презентация бф1
папка презентация бф1папка презентация бф1
папка презентация бф1
natali00
 
Hvordan lykkes med arc gis online barbara schwendtner
Hvordan lykkes med arc gis online barbara schwendtnerHvordan lykkes med arc gis online barbara schwendtner
Hvordan lykkes med arc gis online barbara schwendtner
Geodata AS
 

Andere mochten auch (18)

Prezentacja4
Prezentacja4Prezentacja4
Prezentacja4
 
Updated cast
Updated castUpdated cast
Updated cast
 
Rapport om svensk skogsindustri: Så bra kan det bli
Rapport om svensk skogsindustri: Så bra kan det bliRapport om svensk skogsindustri: Så bra kan det bli
Rapport om svensk skogsindustri: Så bra kan det bli
 
地方議會議事錄-操作手冊
地方議會議事錄-操作手冊地方議會議事錄-操作手冊
地方議會議事錄-操作手冊
 
Debt consolidation
Debt consolidationDebt consolidation
Debt consolidation
 
BeyondRoofing_Brochure_Final %281%29
BeyondRoofing_Brochure_Final %281%29BeyondRoofing_Brochure_Final %281%29
BeyondRoofing_Brochure_Final %281%29
 
Etuma Contact Center Categorizer
Etuma Contact Center CategorizerEtuma Contact Center Categorizer
Etuma Contact Center Categorizer
 
Perchè sono sempre stanco? La sindrome di stanchezza cronica in chiave psicos...
Perchè sono sempre stanco? La sindrome di stanchezza cronica in chiave psicos...Perchè sono sempre stanco? La sindrome di stanchezza cronica in chiave psicos...
Perchè sono sempre stanco? La sindrome di stanchezza cronica in chiave psicos...
 
Reference letter for Carla Villanueva
Reference letter for Carla VillanuevaReference letter for Carla Villanueva
Reference letter for Carla Villanueva
 
Образование в бюджете Березовского ГО Кемеровской области 2015 года
Образование в бюджете Березовского ГО Кемеровской области 2015 годаОбразование в бюджете Березовского ГО Кемеровской области 2015 года
Образование в бюджете Березовского ГО Кемеровской области 2015 года
 
Classification of matter a
Classification of matter aClassification of matter a
Classification of matter a
 
Sembra, ma non è!
Sembra, ma non è!Sembra, ma non è!
Sembra, ma non è!
 
папка презентация бф1
папка презентация бф1папка презентация бф1
папка презентация бф1
 
Decorator
DecoratorDecorator
Decorator
 
CALL
CALLCALL
CALL
 
Business Profile
Business ProfileBusiness Profile
Business Profile
 
Hvordan lykkes med arc gis online barbara schwendtner
Hvordan lykkes med arc gis online barbara schwendtnerHvordan lykkes med arc gis online barbara schwendtner
Hvordan lykkes med arc gis online barbara schwendtner
 
Romeo and Juliet Prologue
Romeo and Juliet PrologueRomeo and Juliet Prologue
Romeo and Juliet Prologue
 

Ähnlich wie Image register for_h

System1 for h
System1 for hSystem1 for h
System1 for h
Jun Chiba
 
System2 ajax
System2 ajaxSystem2 ajax
System2 ajax
Jun Chiba
 
System2 for h
System2 for hSystem2 for h
System2 for h
Jun Chiba
 
System4 comment h
System4 comment hSystem4 comment h
System4 comment h
Jun Chiba
 
How to use animation packages in R(Japanese)
How to use animation packages in R(Japanese)How to use animation packages in R(Japanese)
How to use animation packages in R(Japanese)
sleipnir002
 
Bootstrap s3
Bootstrap s3Bootstrap s3
Bootstrap s3
Jun Chiba
 
System4 comment
System4 commentSystem4 comment
System4 comment
Jun Chiba
 
Internet Explorer 11 概要
Internet Explorer 11 概要Internet Explorer 11 概要
Internet Explorer 11 概要
Yoshihisa Ozaki
 
Lolipop server
Lolipop serverLolipop server
Lolipop server
Jun Chiba
 

Ähnlich wie Image register for_h (20)

Php s3
Php s3Php s3
Php s3
 
System s1
System s1System s1
System s1
 
System1 for h
System1 for hSystem1 for h
System1 for h
 
System1
System1System1
System1
 
System2 ajax
System2 ajaxSystem2 ajax
System2 ajax
 
System s0
System s0System s0
System s0
 
System2 for h
System2 for hSystem2 for h
System2 for h
 
System s2
System s2System s2
System s2
 
System4 comment h
System4 comment hSystem4 comment h
System4 comment h
 
Multiple Dimension Spreadのご紹介
Multiple Dimension Spreadのご紹介Multiple Dimension Spreadのご紹介
Multiple Dimension Spreadのご紹介
 
How to use animation packages in R(Japanese)
How to use animation packages in R(Japanese)How to use animation packages in R(Japanese)
How to use animation packages in R(Japanese)
 
Bootstrap s3
Bootstrap s3Bootstrap s3
Bootstrap s3
 
System4 comment
System4 commentSystem4 comment
System4 comment
 
コピー自動生成プロダクトでDataflowを導入した話
コピー自動生成プロダクトでDataflowを導入した話コピー自動生成プロダクトでDataflowを導入した話
コピー自動生成プロダクトでDataflowを導入した話
 
System2 s1
System2 s1System2 s1
System2 s1
 
AutoScaling & SpotInstance Handson
AutoScaling & SpotInstance HandsonAutoScaling & SpotInstance Handson
AutoScaling & SpotInstance Handson
 
Cesiumを動かしてみよう
Cesiumを動かしてみようCesiumを動かしてみよう
Cesiumを動かしてみよう
 
Cesiumを動かしてみよう FOSS4G 2016 Tokyo版
Cesiumを動かしてみよう FOSS4G 2016 Tokyo版Cesiumを動かしてみよう FOSS4G 2016 Tokyo版
Cesiumを動かしてみよう FOSS4G 2016 Tokyo版
 
Internet Explorer 11 概要
Internet Explorer 11 概要Internet Explorer 11 概要
Internet Explorer 11 概要
 
Lolipop server
Lolipop serverLolipop server
Lolipop server
 

Mehr von Jun Chiba

Mehr von Jun Chiba (20)

セルフケア研修で使えるカードゲーム『攻略!きみのストレスを発見せよ!: ゲームで身につくストレスマネジメント』
セルフケア研修で使えるカードゲーム『攻略!きみのストレスを発見せよ!: ゲームで身につくストレスマネジメント』セルフケア研修で使えるカードゲーム『攻略!きみのストレスを発見せよ!: ゲームで身につくストレスマネジメント』
セルフケア研修で使えるカードゲーム『攻略!きみのストレスを発見せよ!: ゲームで身につくストレスマネジメント』
 
答えのないコンセンサスゲーム「無人島での出来事」運営用パワーポイントスライド説明資料
答えのないコンセンサスゲーム「無人島での出来事」運営用パワーポイントスライド説明資料答えのないコンセンサスゲーム「無人島での出来事」運営用パワーポイントスライド説明資料
答えのないコンセンサスゲーム「無人島での出来事」運営用パワーポイントスライド説明資料
 
合意形成(コンセンサス)ゲーム「月での遭難 in 2025」(NASAゲーム2025)
合意形成(コンセンサス)ゲーム「月での遭難 in 2025」(NASAゲーム2025)合意形成(コンセンサス)ゲーム「月での遭難 in 2025」(NASAゲーム2025)
合意形成(コンセンサス)ゲーム「月での遭難 in 2025」(NASAゲーム2025)
 
システム思考、全体最適、SCMを体験から学ぶボードゲーム「ビールゲーム」概要説明資料
システム思考、全体最適、SCMを体験から学ぶボードゲーム「ビールゲーム」概要説明資料システム思考、全体最適、SCMを体験から学ぶボードゲーム「ビールゲーム」概要説明資料
システム思考、全体最適、SCMを体験から学ぶボードゲーム「ビールゲーム」概要説明資料
 
財務・会計を楽しく学ぶビジネスゲーム型財務・会計研修「財務の虎Lv.1」の概要説明資料
財務・会計を楽しく学ぶビジネスゲーム型財務・会計研修「財務の虎Lv.1」の概要説明資料財務・会計を楽しく学ぶビジネスゲーム型財務・会計研修「財務の虎Lv.1」の概要説明資料
財務・会計を楽しく学ぶビジネスゲーム型財務・会計研修「財務の虎Lv.1」の概要説明資料
 
プロジェクトマネジメントを疑似体験するボードゲーム型企業研修「プロジェクトテーマパーク」
プロジェクトマネジメントを疑似体験するボードゲーム型企業研修「プロジェクトテーマパーク」プロジェクトマネジメントを疑似体験するボードゲーム型企業研修「プロジェクトテーマパーク」
プロジェクトマネジメントを疑似体験するボードゲーム型企業研修「プロジェクトテーマパーク」
 
バルーンバ人文化を探れ!パワーポイント・動画マニュアル販売用のスライドシェア資料
バルーンバ人文化を探れ!パワーポイント・動画マニュアル販売用のスライドシェア資料バルーンバ人文化を探れ!パワーポイント・動画マニュアル販売用のスライドシェア資料
バルーンバ人文化を探れ!パワーポイント・動画マニュアル販売用のスライドシェア資料
 
内定者/新入社員向け ビジネスライティング研修用パワーポイントスライド販売用サンプル
内定者/新入社員向け ビジネスライティング研修用パワーポイントスライド販売用サンプル内定者/新入社員向け ビジネスライティング研修用パワーポイントスライド販売用サンプル
内定者/新入社員向け ビジネスライティング研修用パワーポイントスライド販売用サンプル
 
図形伝達ゲーム「グラコミ」
図形伝達ゲーム「グラコミ」図形伝達ゲーム「グラコミ」
図形伝達ゲーム「グラコミ」
 
傾聴力を高めるビジネスゲーム「傾聴チャレンジ」
傾聴力を高めるビジネスゲーム「傾聴チャレンジ」傾聴力を高めるビジネスゲーム「傾聴チャレンジ」
傾聴力を高めるビジネスゲーム「傾聴チャレンジ」
 
無料アイスブレイクスライドサンプル
無料アイスブレイクスライドサンプル無料アイスブレイクスライドサンプル
無料アイスブレイクスライドサンプル
 
ストレスマネジメント体験ゲーム「ストマネ」
ストレスマネジメント体験ゲーム「ストマネ」ストレスマネジメント体験ゲーム「ストマネ」
ストレスマネジメント体験ゲーム「ストマネ」
 
ベストチームオンライン説明スライド
ベストチームオンライン説明スライドベストチームオンライン説明スライド
ベストチームオンライン説明スライド
 
死の疑似体験ワーク 対面版
死の疑似体験ワーク 対面版死の疑似体験ワーク 対面版
死の疑似体験ワーク 対面版
 
地図作成ゲーム「ジグソータウン」説明資料
地図作成ゲーム「ジグソータウン」説明資料地図作成ゲーム「ジグソータウン」説明資料
地図作成ゲーム「ジグソータウン」説明資料
 
プロジェクトテーマパーク説明資料
プロジェクトテーマパーク説明資料プロジェクトテーマパーク説明資料
プロジェクトテーマパーク説明資料
 
死の疑似体験ワーク(対面版)説明資料
死の疑似体験ワーク(対面版)説明資料死の疑似体験ワーク(対面版)説明資料
死の疑似体験ワーク(対面版)説明資料
 
ヘリウムリング&フープリレー
ヘリウムリング&フープリレーヘリウムリング&フープリレー
ヘリウムリング&フープリレー
 
世界記録を目指すマシュマロチャレンジ
世界記録を目指すマシュマロチャレンジ世界記録を目指すマシュマロチャレンジ
世界記録を目指すマシュマロチャレンジ
 
相互理解ワークショップ、内定者懇親会で使えるワークスタイルトランプ
相互理解ワークショップ、内定者懇親会で使えるワークスタイルトランプ相互理解ワークショップ、内定者懇親会で使えるワークスタイルトランプ
相互理解ワークショップ、内定者懇親会で使えるワークスタイルトランプ
 

Image register for_h

  • 1. 1 Copyright (c) HEART QUAKE All rights reserved . 画像ファイルの登録
  • 2. 2 Copyright (c) HEART QUAKE All rights reserved . 処理理の流流れ 画像を指定する1 2 3 HTML HTMLから情報をもらう &画像をサーバーに転送 情報を登録する PHP SQL
  • 3. 3 Copyright (c) HEART QUAKE All rights reserved . 画像の登録(1/6) l  ゴールイメージ -  指定された画像情報をデータベースに登録する   ようなアプリケーションを作ってみましょう。 ⼊入⼒力力画⾯面 HTML
  • 4. 4 Copyright (c) HEART QUAKE All rights reserved . 画像の登録(2/6) l  ⼊入⼒力力された画像を指定しよう! -  まずは画像選択の⼊入⼒力力欄を表⽰示する この上は省略 <form action="image_input.php" method="POST" enctype="multipart/form-data" > 画像のファイル名を入力してください(最大64KByte) <input size="30" type="file" name="upfile"> <input type="hidden" name="MAX_FILE_SIZE" value="65536”> <br> <input type="submit" name="submit" value="送信”> </form> </body></html> 画像を指定するときは このように書く 画像はtype=”file” HTML 画像の最⼤大サイズを指定
  • 5. 5 Copyright (c) HEART QUAKE All rights reserved . 処理理の流流れ 画像を指定する1 2 3 HTML HTMLから情報をもらう &画像をサーバーに転送 情報を登録する PHP SQL
  • 6. 6 Copyright (c) HEART QUAKE All rights reserved . 画像の登録(3/6) l  画像データの登録に関して -  データベースに画像ファイルを保存するのではなく、 -  画像ファイル名だけをデータベースに保存する。 -  肝⼼心の画像ファイルはサーバーに保管する。 画像を指定する1 2 3 HTML HTMLから情報をもらう &画像をサーバーに転送 画像ファイル名は データベースに保管 PHP 4 画像ファイル⾃自体は サーバーに保管
  • 7. 7 Copyright (c) HEART QUAKE All rights reserved . 画像の登録(4/6) l  画像データの保存フォルダの作成 -  サーバー上に画像データ保存⽤用のフォルダを作成します 「…」フォルダをクリック1 2 右クリックして Create  directory 3 フォルダ名はimg 4 imgフォルダを右クリック してFile  permissionsを クリック 5 777にしてOK
  • 8. 8 Copyright (c) HEART QUAKE All rights reserved . 画像の登録(5/6) <?php $error = $_FILES['upfile']['error']; if ($error == 2){ echo "画像のサイズが大きすぎます!”; }else{ //画像を保管するサーバーのフォルダを指定する //FTP(FileZilla)ユーザ名部分はサーバー情報を見て変更すること! $dir = ’ /home/ユーザ名/public_html/img/’; $file = $dir.basename( $_FILES['upfile']['name'] ); //次のページでここにプログラムを追加する } ?> HTML側で指定した最⼤大サイ ズよりも画像のサイズが⼤大き い場合はエラーは2となる。 http://webtech-walker.com/ archive/ 2007/09/20143717.html PHP HTMLで指定された画像のファイル名は $_FILES[’HTMLで指定したname'] ['name'] に⼊入っている。
  • 9. 9 Copyright (c) HEART QUAKE All rights reserved . 画像の登録(6/6) //前のページの続き $file = $dir.basename( $_FILES['upfile']['name'] ); if(file_exists($file)){ echo "既に同名の画像が存在するため、別名にしてください。"; }else{ if( move_uploaded_file($_FILES['upfile']['tmp_name'], $file) ) { //データベースに画像ファイル名を登録するプログラムを書く }else{ echo "ファイルのアップロード失敗"; } } } ?> サーバーに同じファイル名の 画像があればエラーとする。 PHP move_uploaded_file関数 によって指定した画像ファイルが サーバーに保管=アップロードされる FileZillaで提出しているのとやっている ことは同じ。
  • 10. 10 Copyright (c) HEART QUAKE All rights reserved . お疲れ様でした!!