摘要:本示例将演示一个简单的上传图片到远程服务器,然后生成图片路径后通过提交的回调路径返回给本地服务器,最后将图片地址显示在前端页面。若将去掉还会看到服务器的返回信息。
本示例将演示一个简单的上传图片到远程服务器,然后生成图片路径后通过提交的回调路径返回给本地服务器,最后将图片地址显示在前端页面。
本项目应用三个文件,即前端选取图片的页面,然后提交图片到远程服务器处理文件,返回前端页面的回调文件。
一、前端上传图片页面upload_test.html
Upload Image
封面图URL: | * |
---|
这里需要注意当回调页面返回图片地址到前端页面时,需要iframe标签(这里我们将其隐藏),否则将会找不到要在页面显示的地方 。
和一般的。
而如果设置为iframe的name值,即"post_frame"的话,就会在该iframe内打开,因为CSS设置为隐藏,因而不会有任何动静。若将display:none去掉,还会看到服务器的返回信息。
上传文件时,form表单的method、 enctype属性必须和上面的代码一样,然后将target的值设为iframe的name,这样就可以实现无刷新上传文件。
当选择图片提交时,还有一个隐藏域,即给远程服务器提交图片时,还需要提交回调路径,好让图片返回给本地服务器。(这里我们都是用本地服务器来进行测试)
二、远程服务器图片处理
upload_action.php
0) { $msg = "传入参数错误" . $file["error"] . " "; exit($msg); } else { // chmod($uploadPath, 0666); if(file_exists($uploadPath.$file["name"])){ $msg = $file["name"] . "文件已经存在!"; exit($msg); } else { if(move_uploaded_file($file["tmp_name"], $uploadPath.$file["name"])) { $img_url = "http://localhost/url_test/".$uploadPath.$file["name"]; $img_url = urlencode($img_url); $url = $callbackUrl."?img_url={$img_url}"; // 跳转 header("location:{$url}"); exit(); } else { exit("上传失败!"); } } }
图片上传到到该页面后,保存并返回图片地址给回调页面。
三、回调页面返回图片地址到前端页面回调页面获取到远程服务器传来的图片地址后,经过"window.parent.XXX"返回给前端页面。
callback.php
window.parent.document.getElementById("cover_img_url").value="{$img_url}"; ";
如果我们的前端页面upload_test.html没有iframe标签,则不会返回找到ID为“cover_img_url”的输入框的值,会跳转到空白页。
四、上传到服务器的文件写入日志记录写入日志: $file = $this->file = $_FILES[$this->fileField]; // 要写入文件的文件名(可以是任意文件名),如果文件不存在,将会创建一个 $log_file = "../log/log.txt"; $time = date("Y-m-d H:i:s", time()); $log_content = var_export($_FILES, true) ."Time:{$time} "; file_put_contents($log_file, $log_content, FILE_APPEND); // 结果记录 array ( "name" => "myImage.jpg", "type" => "image/jpeg", "tmp_name" => "/Applications/XAMPP/xamppfiles/temp/phpod5VA4", "error" => 0, "size" => 249318, ) array ( "file" => array ( "name" => "myImage.jpg", "type" => "image/jpeg", "tmp_name" => "/Applications/XAMPP/xamppfiles/temp/phppRvcVe", "error" => 0, "size" => 249318, ), )Time:2016-09-10 17:32:30
其他上传相关示例:
php+ajax实现图片文件上传功能实例
文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。
转载请注明本文地址:https://www.ucloud.cn/yun/30433.html
摘要:背景最近有需求下载头像到本地,以文件形式上传到第三方,遇坑就填第一版将获取的信息以字符串返回,而不是直接输出因为要写文件启用时会将头文件的信息作为数据流输出适合调试配置手册文档地址配置项需要什么翻着找找遇到几个问题部分图片所在主站防盗链机制 背景 最近有需求下载头像到本地,以文件形式上传到第三方,遇坑就填 curl 第一版 $ch = curl_init(); curl_setopt_...
摘要:七夕啦,作为开发,妹子没得撩就撩下服务器吧,妹子有得撩的同学那就左拥妹子右抱服务器吧,况且妹子是要礼物的,服务器又不用。下面我们来看一些常用的情景,我们需要如何打扮自己配置参数才能正确撩妹正确撩到服务器。 七夕啦,作为开发,妹子没得撩就撩下服务器吧,妹子有得撩的同学那就左拥妹子右抱服务器吧,况且妹子是要礼物的,服务器又不用。好啦,长话短说再长说,祭出今天的工具——CURL(Client...
摘要:第三种,使用格式,即在中请求参数处理跨域问题当然请求方式只能是。最后发现有网友说版本不稳定引起的,于是把百度地图回退到了,结果还真是可以了。请问在移动端页面中播放优酷里面的视频,怎样实现 1.web扫码登录怎么实现,思路 步骤 WEB平台 手机 第1步 生成二维码 第2步 (ajax监控后台) 扫码 第3步 ...
阅读 2367·2021-11-18 10:07
阅读 2317·2021-09-22 15:59
阅读 3076·2021-08-23 09:42
阅读 2276·2019-08-30 15:44
阅读 1191·2019-08-29 15:06
阅读 2302·2019-08-29 13:27
阅读 1210·2019-08-29 13:21
阅读 1411·2019-08-29 13:13