php远程访问服务器图片路径,上传图片到远程服务器并返回图片地址到本地显示...

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

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

603527d87e3916781c7f3586fad3c5f1.png

###一、前端上传图片页面 upload_test.html

/p>

"http://www.w3.org/TR/html4/loose.dtd">

Upload Image
主题封面图:

   图片格式 jpg jpeg gif png

封面图URL:

*

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

和一般的

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

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

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

###二、远程服务器图片处理 upload_action.php

/**

* 图片上传处理

* User: CorwienWong

* Date: 16-06-15

* Time: 00:33

*/

header("Content-type:text/html;charset=utf-8");

// 配置文件需要上传到服务器的路径,需要允许所有用户有可写权限,否则无法上传成功

$uploadPath = 'uploads/';

// 获取提交的图片数据

$file = $_FILES['opus'];

// 获取图片回调路径

$callbackUrl = $_POST['callbackUrl'];

if($file['error'] > 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

##回调方法

$img_url = $_GET['img_url'];

// 返回数据给回调页面

echo "

";

c3ac2a40cedbba6dac532fef81e767af.gif

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

67092df96a988d1b12943af0826746de.gif

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值