[iOS6]Safariでinput type=”file” #2|ktyr report

[iOS6]Safariでinput type=”file” #2

App Develop

2013-04-25

iOS6のSafariからformのinput type=”file”に対応しているので試しました。#2
Safariでinput type=”file” #1と違うところは写真だけ選ばせる点
Sample

formを作ると左のように表示される。

写真[ファイルを選択]をタップしたところ

写真を選択したところ

動画[ファイルを選択]をタップしたところ

動画を選択したところ

[送信]をタップして遷移したところ

index.html

<!DOCTYPE html>
<html lang="ja">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta http-equiv="Content-Script-Type" content="text/javascript">
<meta http-equiv="Content-Style-Type" content="text/css">
<title>sample00</title>
<meta name="description" content="****">
<meta name="keywords" content="****">
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
<meta name="format-detection" content="telephone=no,address=no,email=no">
<link rel="apple-touch-icon" href="apple-touch-icon.png">
<link rel="stylesheet" href="style.css" type="text/css">
</head>
<body>
<form method="post" action="upload.php" enctype="multipart/form-data">
	<label>写真</label><input type="file" name="selectedPhoto" accept="image/*">
	<br/>
	<br/>
	<label>動画</label><input type="file" name="selectedMovie" accept="video/*">
	<br/>
	<br/>
	<input type="submit"/>
</form>
</body>
</html>

upload.php

<!DOCTYPE html>
<html lang="ja">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta http-equiv="Content-Script-Type" content="text/javascript">
<meta http-equiv="Content-Style-Type" content="text/css">
<title>sample00</title>
<meta name="description" content="****">
<meta name="keywords" content="****">
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=yes">
<meta name="format-detection" content="telephone=no,address=no,email=no">
<link rel="apple-touch-icon" href="apple-touch-icon.png">
<link rel="stylesheet" href="style.css" type="text/css">
</head>
<body>
<?php
if(isset($_FILES["selectedPhoto"])){
	if($_FILES["selectedPhoto"]["error"]==0) {
		$ext=end(explode('.', $_FILES["selectedPhoto"]["name"]));
		$filename='./test.'.$ext;
		$result = @move_uploaded_file( $_FILES["selectedPhoto"]["tmp_name"], $filename);
		if($result){
			echo '<img src="'.$filename.'" width="300"/><br/>';
		}else{
			echo 'エラー<br/>';
		}
	}elseif ($_FILES["selectedPhoto"]["error"]==1) {
		echo 'ファイルサイズが大きすぎます。';
	}
	foreach($_FILES["selectedPhoto"] as $key => $v){
		echo $key.' : '.$v.'<br/>';
	}
}
?>
<br/><hr><br/>
<?php
if(isset($_FILES["selectedMovie"])){
	if ($_FILES["selectedMovie"]["error"]==0) {
		$ext=end(explode('.', $_FILES["selectedMovie"]["name"]));
		$filename='./test.'.$ext;
		$result = @move_uploaded_file( $_FILES["selectedMovie"]["tmp_name"], $filename);
		if($result){
			echo '<video src="'.$filename.'"></video> ';
		}else{
			echo 'エラー<br/>';
		}
	}elseif ($_FILES["selectedMovie"]["error"]==1) {
		echo 'ファイルサイズが大きすぎます。';
	}
	foreach($_FILES["selectedMovie"] as $key => $v){
		echo $key.' : '.$v.'<br/>';
	}
}
?>
</body>
</html>