一、前提条件
- 有公网服务器,比如阿*、腾*、华*啥的云服务器;
- 部署了宝塔面板
- 知道怎么样在宝塔上创建网站目录,创建文件夹和文件,知道网页路径关系啥的
如果这些你都不知道,也没有云服务器,没关系,我已经给大家搭建好了,大家只需要使用下面的接口就可以了:
接口地址:https://gp.qutaojiao.com/test/upload.php
上传图片查看地址:https://gp.qutaojiao.com/test/uploads/
只需要把硬件程序的下面两行改成如下所示即可,记住wifi账号密码也得改:
String serverName = “gp.qutaojiao.com”; // 硬件程序里把这个变量改成接口网址
String serverPath = “/test/upload.php”; //由于我把文件放在了根目录的test目录下面,所以得这样写
上传程序,打开串口监视器查看上传的界面,成功了打开 https://gp.qutaojiao.com/test/uploads/ 就可以看到你自己上传的照片:
有点离题了,回到正文,下面是自己有云服务器的,可以接着往下看,
假设你创建好了网站,域名为:xxx.qutaojiao.com,如果没有域名,直接ip也可以访问,ip假设为110.120.119.121
接着往下阅读↓
二、浏览本文章前你需要
这篇文章是基于以下文章的扩展:
同时,可以参考作者@浅蓝 针对上面这篇文章的补充分享:
三、进入正文
1、在网站根目录创建文件名:upload.php,粘贴如下代码:
<?php
// Code Based on this example: w3schools.com/php/php_file_upload.asp
$target_dir = "uploads/";
$datum = mktime(date('H')+0, date('i'), date('s'), date('m'), date('d'), date('y'));
$target_file = $target_dir . date('Y.m.d_H:i:s_', $datum) . basename($_FILES["imageFile"]["name"]);
$uploadOk = 1;
$imageFileType = strtolower(pathinfo($target_file,PATHINFO_EXTENSION));
// Check if image file is a actual image or fake image
if(isset($_POST["submit"])) {
$check = getimagesize($_FILES["imageFile"]["tmp_name"]);
if($check !== false) {
echo "File is an image - " . $check["mime"] . ".";
$uploadOk = 1;
}
else {
echo "File is not an image.";
$uploadOk = 0;
}
}
// Check if file already exists
if (file_exists($target_file)) {
echo "Sorry, file already exists.";
$uploadOk = 0;
}
// Check file size
if ($_FILES["imageFile"]["size"] > 500000) {
echo "Sorry, your file is too large.";
$uploadOk = 0;
}
// Allow certain file formats
if($imageFileType != "jpg" && $imageFileType != "png" && $imageFileType != "jpeg"
&& $imageFileType != "gif" ) {
echo "<div style='color:red'>欢迎访问趣讨教ESP32-CAM照片上传测试接口,此接口只做测试使用,请勿用于非法途径!谢谢支持!</div></br>";
echo "Sorry, only JPG, JPEG, PNG & GIF files are allowed.";
$uploadOk = 0;
}
// Check if $uploadOk is set to 0 by an error
if ($uploadOk == 0) {
echo "Sorry, your file was not uploaded.";
// if everything is ok, try to upload file
}
else {
if (move_uploaded_file($_FILES["imageFile"]["tmp_name"], $target_file)) {
echo "The file ". basename( $_FILES["imageFile"]["name"]). " has been uploaded.";
}
else {
echo "Sorry, there was an error uploading your file.";
}
}
?>
接着,在upload.php相同位置创建目录:uploads。
进入uploads目录,创建文件:index.php,
接着,复制以下代码到index.php:
保存,搞定,看一下网站结构:
1级——网站根目录(xxx.qutaojio.com)
1级————index.php
1级————uploads
2级—————— index.php
接着,打开网站xxx.qutaojiao.com/upload.php
访问成功将会如下图页面提示表示第一步成功了:
接着访问:xxx.qutaojiao.com/uploads,看到如下图页面提示所示表示成功了:
接着去按照这篇文章:
硬件程序需要修改几行代码:
String serverName = “xxx.qutaojiao.com”; //改成自己的域名或者ip地址
String serverPath = “/upload.php”; //改成upload.php所在的路径
上传程序,出现如下串口界面,表示图片正在上传:
接着去打开xxx.qutaojiao.com/uploads页面,就可以看到上传的照片了:
?
源码记得+转义:
String head = “–RandomNerdTutorialsrnContent-Disposition: form-data; name=”imagefile”; filename=”esp32-cam.jpg”rnContent-Type: image/jpegrnrn”;
我这个始终看不到图片呢,
不应该呀,我这边是正常的呢
请问你那里是看得到照片吗
方便加个联系方式吗。。不会占用你太多时间
我这边试了在我的服务器上也不行。
学到了
本地服务器如何搭建
兄弟,你找一下,这个教程很完善,本地我也搭建了。https://www.qutaojiao.com/24507.html
我发现上传到测试服务器的图片都是上一次拍的,本次拍的图片,只能在下一次才能拍的时候才能在服务器看到。这是什么原因呢
你是咋解决的啊 我也发现这个问题了 我的要延迟两张才对
用本机电脑搭建服务器,能看到测试界面“ESP32-CAM Image upload display interface Welcome to the link of ESP32-CAM photo upload test. This link is only for testing.“ 但是上传图片不成功。ESP32返回 ” Warning: move_uploaded_file(uploads/2022.10.24_17:38:34_esp32-cam.jpg): failed to open stream: No such file or directory in D:phpstudy_proWWWtestupload.php on line 42 Warning: move_uploaded_file(): Unable to move ‘C:WindowsphpC328.tmp’ to ‘uploads/2022.10.24_17:38:34_esp32-cam.jpg’ in D:phpstudy_proWWWtestupload.php on line 42 Sorry, there was an error uploading your file.“ 上传到测试服务器https://gp.qutaojiao.com/test/uploads/,可以成功上传,但是上传的图片都是上一次拍的,本次拍的图片,只能在下一次再拍的时候才能在服务器看到。这是什么原因呢
会不会是上传速度比较慢导致的,正常我试过是没问题的呀
@Luca 29 和0是啥 在返回信息中可以不返回吗?
没仔细看,有返回信息的可以找到Serial.print()的语句注释掉就不会返回了
我想学习一下
我想学习一下
学习一下
多谢多谢博主,用 esp32S3 https post 上传成功👍
没有 The file esp32-cam.jpg has been uploaded.