uploadify实现七牛云存储显示上传进度+页面显示，uploadify牛云-php手册-PHP中文网

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

首页

php教程

php手册

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

WBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWB

Jun 13, 2016 am 09:19 AM

云存储

uploadify实现七牛云存储显示上传进度+页面显示，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
/*
Uploadify
Copyright (c) 2012 Reactive Apps, Ronnie Garcia
Released 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/imghw/default1.png"  data-src="http://www.bkjia.com/uploads/allimg/141214/16013Ia3-1.jpg"  class="lazy"     style="max-width:90%"  style="max-width:90%" id="txtimg"/ alt="uploadify实现七牛云存储 显示上传进度+页面显示，uploadify牛云" >
	<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实现七牛云存储显示上传进度+页面显示，uploadify牛云

DEMO:

http://hxend.com/uploadif/

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

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

本站声明

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

热AI工具

热工具

热门话题

gmail邮箱登陆入口在哪里

7469

CakePHP 教程

1376

steam的账户名称是什么格式

win11激活密钥永久

NYT连接提示和答案

显示更多

Related knowledge

如何修复 Explorer.exe 高 CPU 使用率 Windows 11 May 02, 2023 am 09:40 AM

与Windows11中Explorer.exe高CPU使用率的问题不同，一台计算机可能会遇到高CPU使用率。这是完全正常的，只要它很少发生并且不会显着影响PC的性能。然而，当它反复出现时，这会成为一个问题。它可能会使系统升温，延迟加载时间，并可能在您处理重要任务时冻结。为什么我的电脑会遇到Explorer.exe高CPU使用率？通常，由于以下原因之一，计算机可能会遇到高CPU使用率：运行需要更高CPU要求的程序：视频编辑和游戏软件会触发高CPU使用率。如果在与发布

Windows 11 预览版更新支持更深入的 OneDrive 集成 May 01, 2023 pm 07:07 PM

Windows11Build25145现在可供开发频道中的用户使用，其中包含一些小的新功能。例如，Build25145可以在OneDrive和设置之间实现更紧密的集成。同样，它还改进了讲述人盲文驱动程序支持并添加了新的本地管理员密码解决方案。这些改进仅适用于开发频道的成员。根据发行说明，Windows11Build25145添加了盲文驱动程序解决方案。该公司表示，盲文设备现在可以更好地工作，因为它们可以在讲述人和第三方屏幕阅读器之间顺畅切换，因为讲述人会自动更改盲文驱动程序。要开始

微软取消了OneDrive商业计划中的无限存储选项 Aug 31, 2023 pm 08:17 PM

本站消息显示，微软将不再为新客户提供OneDriveforBusiness计划的“无限存储”选项，这对企业用户的云存储优惠产生了影响TechRadar发现，微软已经下架了每个用户每月10美元的OneDriveforBusiness（计划2）。目前，微软的商业云存储计划只剩下OneDriveforBusiness（计划1）本站注意到，中国的OneDriveforBusiness（计划1）每个用户的价格为每月36元，提供最多1TB的云存储空间，根据用户数量可选择增加到5TB。此外，微软还为其两个Mi

PHP和Amazon Web Services集成实现高效的云计算和存储 Jun 25, 2023 am 09:12 AM

随着云计算和大数据的不断发展，云服务已经成为企业和开发者不可或缺的工具之一。而AmazonWebServices（AWS）则成为了全球最受欢迎的云服务提供商之一。PHP作为一种广泛使用的服务器端脚本语言，也逐渐成为了许多企业和开发者的首选。本文将讨论如何通过PHP和AWS集成，实现高效的云计算和存储。一、AWS的优势AWS作为全球最大的云服务提供商之一，

icloud有必要开吗 Feb 23, 2024 pm 12:51 PM

icloud有必要开吗如今，随着互联网的发展和智能手机的普及，人们的生活和工作方式都有了很大的改变。云存储服务也逐渐成为人们日常生活中不可或缺的一部分。其中，苹果公司的iCloud就是备受欢迎的云存储服务之一。然而，对于一些用户来说，他们可能还不太清楚iCloud是否真的有必要开通。本文将从几个方面来探讨iCloud的必要性。首先，iCloud为用户提供了方

PHP开发：使用 Flysystem 实现多种云存储服务 Jun 15, 2023 pm 10:43 PM

随着云计算和云存储的发展，越来越多的开发者开始使用云存储来解决存储和传输数据的问题。在PHP开发中，Flysystem是一个非常实用的工具，它提供了一个统一的API，可以轻松地使用多种不同的云存储服务。在本文中，我们将介绍如何使用Flysystem实现多种云存储服务，并展示一些用于不同服务的示例代码。什么是Flysystem？Flysystem

如何使用可信计算技术构建可信云存储系统？ Jun 11, 2023 pm 02:16 PM

随着互联网和云计算的不断发展，数据安全问题已经成为了一个不容忽视的问题。为了保护数据的安全性和可靠性，可信计算被广泛应用于云存储系统之中。本文将详细介绍可信计算技术构建可信云存储系统的过程。首先，让我们了解一下什么是可信计算技术。可信计算技术是一种保证计算过程及其结果在计算平台上得到保护的技术。这意味着在可信计算平台上，计算过程和结果都不会被恶意软件或攻击者

使用Java SDK对接七牛云：如何实现云存储服务？ Jul 05, 2023 pm 02:49 PM

使用JavaSDK对接七牛云：如何实现云存储服务？引言：随着云计算的快速发展，越来越多的企业和开发者将数据存储在云上，以实现数据的安全备份和高可用性。七牛云是国内知名的云存储服务提供商之一，提供了丰富的云存储服务和强大的开发工具包。本文将介绍如何使用JavaSDK对接七牛云，实现云存储服务。一、注册七牛云账号：在开始前，您需要先注册一个七牛云账号，并创建

See all articles

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

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

热AI工具

Undresser.AI Undress

AI Clothes Remover

Undress AI Tool

Clothoff.io

AI Hentai Generator

热门文章

热工具

记事本++7.3.1

SublimeText3汉化版

禅工作室 13.0.1

Dreamweaver CS6

SublimeText3 Mac版

热门话题

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

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

热AI工具

Undresser.AI Undress

AI Clothes Remover

Undress AI Tool

Clothoff.io

AI Hentai Generator

热门文章

热工具

记事本++7.3.1

SublimeText3汉化版

禅工作室 13.0.1

Dreamweaver CS6

SublimeText3 Mac版

热门话题

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

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