-
- 上传代码
- 适配
- 自动化
- 完整代码
- 测试
- Android端
- 上传
- 上传结果
- Iphone
- 上传
- 上传结果
- 服务器端情况
- Android端
- 总结
先上个福利图 :)
首先说一下，写这篇博客的原因。大致可为以下几点：
- 新买的android手机掉在了地上，摄像头摔得不能聚焦了，卖家还不给维修 :(
- 手头有一个老旧的Iphone，然而不会IOS开发，所以决定使用网页形式来替代
- 写博客需要一些手绘的流程图或者示意图，而电脑上的作图工具用起来不是很顺手。
综合上面的原因，就为自己写了一个解决没有高清照片问题的php网页，用来转储Iphone拍摄的照片，用于博客的书写。
上传代码
正好博主本人电脑上配置好了PHP+Apache+MySQL的环境，当然了。使用Java或者Python或者其他的语言也是可以的，配置好相关的环境就可以了。
为了尽可能使这次的工作量最少，最简单，这里使用了PHP作为了我的开发语言。另本次试验的核心是图片的转储，于是也没有添加数据库的上传记录，这些东西也就是自己用，实际的开发中，各方面都得做的完善一点，谨慎一点的。
<?php
header("Content-Type:text/html;charset=utf-8");
$path = "F:/phpimage/";
$imgtype=$_REQUEST['imgtype'];
$rand_number = rand(1,100000);
$server_name = $imgtype=="notgif"?$path."$rand_number".".png":$path."$rand_number.".$imgtype;
if($_FILES['photo']['error']>0){
die("上传文件出错了！".$_FILES['photo']['error']);
}
if(move_uploaded_file($_FILES['photo']['tmp_name'],$server_name)){
echo '<br><br><span class="label label-success">上传成功</span>';
//header("location:./upimg.php");
}else{
echo '<br><br><span class="label label-danger">上传失败</span>';
//header("location:./upimg.php");
}
?>这里就简单的让用户决定自己上传的文件，博主有时候写博客经常会用到gif图，所以单纯的将文件转储为png，那是不够的。于是我就添加了一个gif图上传的选项。至于其他类型的图片，全部一棍子“打死”，转成png图片类型即可。
适配
由于博主是为了自己图片转储的需要，所以该网页工作的主要是在手机上。那么问题就自然的来了，那就是PC版的网页在手机上显示的话会很丑。
为了让博主自己使用起来也稍微的愉悦一点，做点手机端的适配也是很有必要的啦。
同样的，为了简便。博主使用了Bootstrap来制作前端界面了。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<!-- 引入 Bootstrap -->
<link href="http://cdn.static.runoob.com/libs/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">
<title>上传图片</title>
<style>
div {
width:88%;
height:auto;
background:silver;
}
input label{
width:100%;
height:auto;
}
</style>
</head>
<body>
<div class="container-fluid">
<h1><marquee behavior="alternate" class="label label-info">上传图片吧</marquee> </h1>
<form role="form" action="./upimg.php" method="post" enctype="multipart/form-data">
<input class="btn btn-default" type="file" name="photo" /><br/><br />
<div class="form-group">
<label class="label label-warning">图片类型</label>
<input type="radio" name="imgtype" value="notgif" checked="checked">非gif图
<input type="radio" name="imgtype" value="gif" />gif图<br />
<br/>
</div>
<br />
<input class="btn btn-default" style="background:#C6C" type="submit" value="上传图片"/>
</form>
</div>
</body>
</html>其实html代码和php代码是写在一个文件中的，待会博主还会贴出全部的代码。
自动化
刚才博主已经提到了，网页主要是工作在手机端的，那么自然的我们就不能采用单纯的PC端使用的localhost了。那么怎么实现呢？
答案就是使用IP进行连接。形如：
在进行手机端测试的时候，博主每次都需要到电脑的命令行下手动的输入 ipconfig /all
然后用鼠标往上翻，找到无线适配那一块，如下：
无线局域网适配器 无线网络连接:
连接特定的 DNS 后缀 . . . . . . . : dlut.edu.cn
本地链接 IPv6 地址. . . . . . . . : fe80::1d9f:d97b:fd16:1f6f%12
IPv4 地址 . . . . . . . . . . . . : 192.168.56.245
子网掩码 . . . . . . . . . . . . : 255.255.252.0
默认网关. . . . . . . . . . . . . : 192.168.56.1唉，每次都要这么麻烦，博主也是忒懒，于是就想写个程序来一键获取本机的IP地址，然后就会方便很多了。
说到这里，博主想了不少方法，Java啊，C语言，C++, Python，甚至C#写个界面什么的，但是为了保持博主一贯的优雅，简洁（其实是懒惰）的风格，博主还是采用了最为基础的方式，那就是写一个批命令的脚本，来一键获取本机的IP地址。
代码也比较简单，就是对命令中的返回结果的过滤。
@echo off
for /f "tokens=4" %%a in ('route print^|findstr 0.0.0.0.*0.0.0.0') do (
set IP=%%a
)
echo %IP%
pause
完整代码
首先是upimg.php
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<!-- 引入 Bootstrap -->
<link href="http://cdn.static.runoob.com/libs/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">
<title>上传图片</title>
<style>
div {
width:88%;
height:auto;
background:silver;
}
input label{
width:100%;
height:auto;
}
</style>
</head>
<body>
<div class="container-fluid">
<h1><marquee behavior="alternate" class="label label-info">上传图片吧</marquee> </h1>
<form role="form" action="./upimg.php" method="post" enctype="multipart/form-data">
<input class="btn btn-default" type="file" name="photo" /><br/><br />
<div class="form-group">
<label class="label label-warning">图片类型</label>
<input type="radio" name="imgtype" value="notgif" checked="checked">非gif图
<input type="radio" name="imgtype" value="gif" />gif图<br />
<br/>
</div>
<br />
<input class="btn btn-default" style="background:#C6C" type="submit" value="上传图片"/>
</form>
</div>
<?php
header("Content-Type:text/html;charset=utf-8");
$path = "F:/phpimage/";
$imgtype=$_REQUEST['imgtype'];
$rand_number = rand(1,100000);
$server_name = $imgtype=="notgif"?$path."$rand_number".".png":$path."$rand_number.".$imgtype;
if($_FILES['photo']['error']>0){
die("上传文件出错了！".$_FILES['photo']['error']);
}
if(move_uploaded_file($_FILES['photo']['tmp_name'],$server_name)){
echo '<br><br><span class="label label-success">上传成功</span>';
//header("location:./upimg.php");
}else{
echo '<br><br><span class="label label-danger">上传失败</span>';
//header("location:./upimg.php");
}
?>
</body>
</html>
然后是一键获取本机IP的代码：
@echo off
echo "当前，您的电脑所在的局域网内的IP地址为："
for /f "tokens=4" %%a in ('route print^|findstr 0.0.0.0.*0.0.0.0') do (
set IP=%%a
)
echo %IP%
pause最后一个pause不能少，除非你想看到一个黑色的框框一闪而逝 :-)
测试
Android端
上传
- 选择好一张图片，待上传。
上传结果
- 上传完毕
Iphone
Iphone端的适配就比较简单了，毕竟种类有限嘛。
上传
上传结果
服务器端情况
最后，来查看一下。服务器端有没有上传完成的图片信息。可以看到本次试验上传的所有的图片，而且如果上传的图片为gif图的话，也是可以直接可以满足的，图片的质量并没有被损坏。 :-)
总结
经过了本次试验，博主也明白了一个道理，那就是“工具都是被懒逼着创造出来的”。 不管怎样，也算是复习了一些基础性的知识，外加一点点的应用吧。
基础知识是今后进步的源动力，不该忽视的干粮。