uploadify实现7牛云存储显示上传进度+页面显示-php教程-PHP中文网

首页

后端开发

php教程

uploadify实现7牛云存储显示上传进度+页面显示

WBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWB

Jun 13, 2016 pm 12:11 PM

gtltphptype

uploadify实现七牛云存储显示上传进度+页面显示

准备：

uploadify下载地址：

http://www.uploadify.com/download/

七牛 php-sdk开发指南：

http://developer.qiniu.com/docs/v6/sdk/php-sdk.html

php-sdk地址：

https://github.com/qiniu/php-sdk

开始：

DEMO:

http://hxend.com/uploadif/

在七牛里面注册账号以后，成为标准用户

免费存储空间10GB
免费每月下载流量10GB
免费每月PUT/DELETE 10万次请求
免费每月GET 100万次请求

貌似是一个不错的福利。

成功注册后就会账号页面有ak 和sk key 可以在代码中使用。

下载好uploadify 后把七牛 php -sdk 文件包里面的内容放在 uploadify 里面

打开uploadify.php 文件代码如下：

<?php/*UploadifyCopyright (c) 2012 Reactive Apps, Ronnie GarciaReleased under the MIT License <http://www.opensource.org/licenses/mit-license.php> */// Define a destination$targetFolder = '/uploads'; // Relative to the root$verifyToken = md5('unique_salt' . $_POST['timestamp']);if (!empty($_FILES) && $_POST['token'] == $verifyToken) {	$tempFile = $_FILES['Filedata']['tmp_name'];	$targetPath = $_SERVER['DOCUMENT_ROOT'] . $targetFolder;	$targetFile = rtrim($targetPath,'/') . '/' . $_FILES['Filedata']['name'];		// Validate the file type	$fileTypes = array('jpg','jpeg','gif','png'); // File extensions	$fileParts = pathinfo($_FILES['Filedata']['name']);		if (in_array($fileParts['extension'],$fileTypes)) {		move_uploaded_file($tempFile,$targetFile);		echo '1';	} else {		echo 'Invalid file type.';	}}?>

　　修改代码如下：介绍参考代码内部.

<?php$verifyToken = md5('unique_salt' . $_POST['timestamp']);if (!empty($_FILES) && $_POST['token'] == $verifyToken) {    $tempFile = $_FILES['Filedata']['tmp_name'];    //生成新的文件名     $filename = time().mt_rand(10,99).'.'.end(explode('.', $_FILES['Filedata']['name'])); //在这里修改生出随机图片名    $fileTypes = array('jpg','jpeg','gif','png');  //限制上传的文件为图片     $fileParts = pathinfo($_FILES['Filedata']['name']);    if (in_array($fileParts['extension'],$fileTypes)) {        //上传图片到云端 start        require_once("qiniu/io.php");        require_once("qiniu/rs.php");        $bucket = "hdimg";//空间名        //截取原始文件后缀名        $key1 = "Uploads/".$filename;        $accessKey = ' '; //这里填写ak        $secretKey = ' '; // 这里填写SK        Qiniu_SetKeys($accessKey, $secretKey);        $putPolicy = new Qiniu_RS_PutPolicy($bucket);        $upToken = $putPolicy->Token(null);        $putExtra = new Qiniu_PutExtra();        $putExtra->Crc32 = 1;        //$tempFile uploadify上传的临时文件路径        list($ret, $err) = Qiniu_PutFile($upToken, $key1, $tempFile, $putExtra);        //上传图片到云端 end        //返回文件名给前台        echo "http://hdimg.qiniudn.com/".$key1; //前台使用回调函数的data参数接收      } else {        echo 'Invalid file type.';    }}

　　前台index.php修改为:前台调用 echo 输出的值data 进行操作。

<!DOCTYPE HTML><html><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8"><title>UploadiFive Test</title><script src="http://libs.baidu.com/jquery/1.9.0/jquery.js" type="text/javascript"></script><script src="jquery.uploadify.min.js" type="text/javascript"></script><link rel="stylesheet" type="text/css" href="uploadify.css"><style type="text/css">body {	font: 13px Arial, Helvetica, Sans-serif;}</style></head><body>	<form>		<div id="queue"></div>		<input id="file_upload" name="file_upload" type="file" multiple="true">	</form>			<img  src="/static/imghwm/default1.png"  data-src="/img/2014/12/14/11133784.jpg"  class="lazy"     style="max-width:90%"  style="max-width:90%" id="txtimg"/ alt="uploadify实现7牛云存储 显示上传进度+页面显示" >	<script type="text/javascript">		<?php $timestamp = time();?>		$(function() {			$('#file_upload').uploadify({				'formData'     : {					'timestamp' : '<?php echo $timestamp;?>',					'token'     : '<?php echo md5('unique_salt' . $timestamp);?>'				},				'swf'      : 'uploadify.swf',				'uploader' : 'uploadify.php',				 'onUploadSuccess' : function(file,data,response) {  //执行成功后就执行该段js						document.getElementById('txtimg').src=data;                                  }			});		});	</script></body></html>

　　对data 进行输入到页面实现当前页面显示。控制 #txtimg 的值为输出的data值即为图片地址。

后期如果需要 iframe 调用的话可以把

document.getElementById('txtimg').src=data;  可以把data 传输到父页面 的 #txtimg 中。

parent.document.getElementById('txtimg').src=data;

uploadify实现7牛云存储显示上传进度+页面显示

DEMO:

http://hxend.com/uploadif/

博文归石头和博客园所有，转载请注明出处，方便更新。

http://www.cnblogs.com/webers/p/4162108.html

声明

本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系admin@php.cn

PHP：服务器端脚本语言的简介Apr 16, 2025 am 12:18 AM

PHP是一种服务器端脚本语言，用于动态网页开发和服务器端应用程序。1.PHP是一种解释型语言，无需编译，适合快速开发。2.PHP代码嵌入HTML中，易于网页开发。3.PHP处理服务器端逻辑，生成HTML输出，支持用户交互和数据处理。4.PHP可与数据库交互，处理表单提交，执行服务器端任务。

PHP和网络：探索其长期影响Apr 16, 2025 am 12:17 AM

PHP在过去几十年中塑造了网络，并将继续在Web开发中扮演重要角色。1)PHP起源于1994年，因其易用性和与MySQL的无缝集成成为开发者首选。2)其核心功能包括生成动态内容和与数据库的集成，使得网站能够实时更新和个性化展示。3)PHP的广泛应用和生态系统推动了其长期影响，但也面临版本更新和安全性挑战。4)近年来的性能改进，如PHP7的发布，使其能与现代语言竞争。5)未来，PHP需应对容器化、微服务等新挑战，但其灵活性和活跃社区使其具备适应能力。

为什么要使用PHP？解释的优点和好处Apr 16, 2025 am 12:16 AM

PHP的核心优势包括易于学习、强大的web开发支持、丰富的库和框架、高性能和可扩展性、跨平台兼容性以及成本效益高。1)易于学习和使用，适合初学者；2)与web服务器集成好，支持多种数据库；3)拥有如Laravel等强大框架；4)通过优化可实现高性能；5)支持多种操作系统；6)开源，降低开发成本。

揭穿神话：PHP真的是一种死语吗？Apr 16, 2025 am 12:15 AM

PHP没有死。1)PHP社区积极解决性能和安全问题，PHP7.x提升了性能。2)PHP适合现代Web开发，广泛用于大型网站。3)PHP易学且服务器表现出色，但类型系统不如静态语言严格。4)PHP在内容管理和电商领域仍重要，生态系统不断进化。5)通过OPcache和APC等优化性能，使用OOP和设计模式提升代码质量。

PHP与Python辩论：哪个更好？Apr 16, 2025 am 12:03 AM

PHP和Python各有优劣，选择取决于项目需求。1)PHP适合Web开发，易学，社区资源丰富，但语法不够现代，性能和安全性需注意。2)Python适用于数据科学和机器学习，语法简洁，易学，但执行速度和内存管理有瓶颈。

PHP的目的：构建动态网站Apr 15, 2025 am 12:18 AM

PHP用于构建动态网站，其核心功能包括：1.生成动态内容，通过与数据库对接实时生成网页；2.处理用户交互和表单提交，验证输入并响应操作；3.管理会话和用户认证，提供个性化体验；4.优化性能和遵循最佳实践，提升网站效率和安全性。

PHP：处理数据库和服务器端逻辑Apr 15, 2025 am 12:15 AM

PHP在数据库操作和服务器端逻辑处理中使用MySQLi和PDO扩展进行数据库交互，并通过会话管理等功能处理服务器端逻辑。1）使用MySQLi或PDO连接数据库，执行SQL查询。2）通过会话管理等功能处理HTTP请求和用户状态。3）使用事务确保数据库操作的原子性。4）防止SQL注入，使用异常处理和关闭连接来调试。5）通过索引和缓存优化性能，编写可读性高的代码并进行错误处理。