资讯专栏INFORMATION COLUMN

上云采购季！| 2核2G4M爆款云服务器低至59元/年，更有多台、长期优惠，快来选购！

立即前往
首页/文章专栏/php上传图片到远程服务器并返回图片地址到本地显示

php上传图片到远程服务器并返回图片地址到本地显示

muddyway / 977人阅读

摘要：本示例将演示一个简单的上传图片到远程服务器，然后生成图片路径后通过提交的回调路径返回给本地服务器，最后将图片地址显示在前端页面。若将去掉还会看到服务器的返回信息。

</>复制代码 
  1. 本示例将演示一个简单的上传图片到远程服务器，然后生成图片路径后通过提交的回调路径返回给本地服务器，最后将图片地址显示在前端页面。

本项目应用三个文件，即前端选取图片的页面，然后提交图片到远程服务器处理文件，返回前端页面的回调文件。

一、前端上传图片页面

upload_test.html

</>复制代码 
  2.     <span class="hljs-attr">Upload</span> <span class="hljs-string">Image</span>
  3.     
  4.      
  5.      
  6.       
                  
  7.         
  8.           
  9.             
  10.               
  11.               
  12.             
  13.           
  14.         
    15.   主题封面图：
  15.                     图片格式 jpg  jpeg gif  png  
  16.                 
  17.               
  18.       
  19.         
  20.            
  21.               
  22.               
  23.             
  24.       
    25. 封面图URL：
  25.                 * 
  26.                 
  27.               
  28.

这里需要注意当回调页面返回图片地址到前端页面时，需要iframe标签（这里我们将其隐藏），否则将会找不到要在页面显示的地方 。

和一般的

标签相比多了一个target属性罢了，用于指定标签页在哪里打开以及提交数据。
而如果设置为iframe的name值，即"post_frame"的话,就会在该iframe内打开，因为CSS设置为隐藏，因而不会有任何动静。若将display:none去掉,还会看到服务器的返回信息。

上传文件时，form表单的method、 enctype属性必须和上面的代码一样，然后将target的值设为iframe的name，这样就可以实现无刷新上传文件。

</>复制代码

当选择图片提交时，还有一个隐藏域，即给远程服务器提交图片时，还需要提交回调路径，好让图片返回给本地服务器。（这里我们都是用本地服务器来进行测试）

</>复制代码 
  1.
二、远程服务器图片处理

upload_action.php

</>复制代码 
  1.  0)
  2. {
  3.     $msg = "传入参数错误" . $file["error"] . "  ";
  4.     exit($msg);
  5. }
  6. else
  7. {
  8.    // chmod($uploadPath, 0666);
  9.     if(file_exists($uploadPath.$file["name"])){
  10.        $msg = $file["name"] . "文件已经存在！";
  11.        exit($msg);
  12.     }
  13.     else
  14.     {
  15.         if(move_uploaded_file($file["tmp_name"], $uploadPath.$file["name"]))
  16.         {
  17.           $img_url = "http://localhost/url_test/".$uploadPath.$file["name"];
  18.           $img_url = urlencode($img_url);
  19.           $url = $callbackUrl."?img_url={$img_url}";
  20.           // 跳转
  21.           header("location:{$url}");
  22.           exit();
  23.         }
  24.         else
  25.         {
  26.           exit("上传失败！");
  27.         }
  28.     }
  29. }

图片上传到到该页面后，保存并返回图片地址给回调页面。

三、回调页面返回图片地址到前端页面

回调页面获取到远程服务器传来的图片地址后，经过"window.parent.XXX"返回给前端页面。
callback.php

</>复制代码 
  1. window.parent.document.getElementById("cover_img_url").value="{$img_url}";
  2. ";

如果我们的前端页面upload_test.html没有iframe标签，则不会返回找到ID为“cover_img_url”的输入框的值，会跳转到空白页。

四、上传到服务器的文件写入日志记录 
</>复制代码 
  1. 写入日志：
  2.  $file = $this->file = $_FILES[$this->fileField];
  3.         // 要写入文件的文件名（可以是任意文件名），如果文件不存在，将会创建一个
  4.         $log_file  = "../log/log.txt";
  5.         $time = date("Y-m-d H:i:s", time());
  6.         $log_content = var_export($_FILES, true) ."Time:{$time} 
  7. ";
  8.         file_put_contents($log_file, $log_content, FILE_APPEND);
  9.         
  10.         
  11.         
  12. // 结果记录
  13. array (
  14.   "name" => "myImage.jpg",
  15.   "type" => "image/jpeg",
  16.   "tmp_name" => "/Applications/XAMPP/xamppfiles/temp/phpod5VA4",
  17.   "error" => 0,
  18.   "size" => 249318,
  19. )
  20. array (
  21.   "file" => 
  22.   array (
  23.     "name" => "myImage.jpg",
  24.     "type" => "image/jpeg",
  25.     "tmp_name" => "/Applications/XAMPP/xamppfiles/temp/phppRvcVe",
  26.     "error" => 0,
  27.     "size" => 249318,
  28.   ),
  29. )Time:2016-09-10 17:32:30

其他上传相关示例：
php+ajax实现图片文件上传功能实例

GPU云服务器 云服务器 本地图片上传到云服务器 js图片上传存到本地 上传图片到php接口 php上传图片到s3

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/30433.html

相关文章

  • php curl抓取墙外图片及sftp上传【填坑指南】

    摘要：背景最近有需求下载头像到本地，以文件形式上传到第三方，遇坑就填第一版将获取的信息以字符串返回，而不是直接输出因为要写文件启用时会将头文件的信息作为数据流输出适合调试配置手册文档地址配置项需要什么翻着找找遇到几个问题部分图片所在主站防盗链机制 背景 最近有需求下载头像到本地，以文件形式上传到第三方，遇坑就填 curl 第一版 $ch = curl_init(); curl_setopt_...

    ralap 评论0 收藏0

  • 在PHP中使用CURL，“撩”服务器只需几行——php curl详细解析和常见大坑

    摘要：七夕啦，作为开发，妹子没得撩就撩下服务器吧，妹子有得撩的同学那就左拥妹子右抱服务器吧，况且妹子是要礼物的，服务器又不用。下面我们来看一些常用的情景，我们需要如何打扮自己配置参数才能正确撩妹正确撩到服务器。 七夕啦，作为开发，妹子没得撩就撩下服务器吧，妹子有得撩的同学那就左拥妹子右抱服务器吧，况且妹子是要礼物的，服务器又不用。好啦，长话短说再长说，祭出今天的工具——CURL(Client...

    SexySix 评论0 收藏0

  • WEB之常见工作问题总结（1-20）

    摘要：第三种，使用格式，即在中请求参数处理跨域问题当然请求方式只能是。最后发现有网友说版本不稳定引起的，于是把百度地图回退到了，结果还真是可以了。请问在移动端页面中播放优酷里面的视频，怎样实现 1.web扫码登录怎么实现，思路 步骤 WEB平台 手机 第1步 生成二维码 第2步 （ajax监控后台） 扫码 第3步 ...

    genedna 评论0 收藏0

发表评论

登陆后可评论

0条评论

muddyway

男|高级讲师
我要私信

TA的文章

阅读更多
最新活动
阅读需要支付1元查看
<