uploadify实现七牛云存储 显示上传进度+页面显示，uploadify牛云
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; 
DEMO:
http://hxend.com/uploadif/
| 博文归石头和博客园所有，转载请注明出处，方便更新。 |
| http://www.cnblogs.com/webers/p/4162108.html |
ホットAIツール
Undresser.AI Undress
リアルなヌード写真を作成する AI 搭載アプリ
AI Clothes Remover
写真から衣服を削除するオンライン AI ツール。
Undress AI Tool
脱衣画像を無料で
Clothoff.io
AI衣類リムーバー
Video Face Swap
完全無料の AI 顔交換ツールを使用して、あらゆるビデオの顔を簡単に交換できます。
人気の記事
ホットツール
メモ帳++7.3.1
使いやすく無料のコードエディター
SublimeText3 中国語版
中国語版、とても使いやすい
ゼンドスタジオ 13.0.1
強力な PHP 統合開発環境
ドリームウィーバー CS6
ビジュアル Web 開発ツール
SublimeText3 Mac版
神レベルのコード編集ソフト（SublimeText3）
ホットトピック
7700
15
1640
14
1393
52
1287
25
1230
29
Windows 11でExplorer.exeの高いCPU使用率を修正する方法
May 02, 2023 am 09:40 AM
Windows 11 の Explorer.exe の CPU 使用率が高くなる問題とは異なり、コンピューターの CPU 使用率が高くなる場合があります。これは、めったに発生せず、PC のパフォーマンスに大きな影響を与えない限り、まったく正常です。ただし、これが繰り返し発生すると問題が発生する可能性があります。システムが熱くなり、読み込み時間が遅れ、重要なタスクに取り組んでいるときにフリーズする可能性があります。 Explorer.exe を使用すると、コンピューターの CPU 使用率が高くなるのはなぜですか?通常、次のいずれかの理由により、コンピュータの CPU 使用率が高くなることがあります。 より高い CPU 要件を必要とするプログラムの実行: ビデオ編集ソフトウェアやゲーム ソフトウェアにより、CPU 使用率が高くなる可能性があります。で公開された場合
Windows 11 プレビュー アップデートは、より緊密な OneDrive 統合をサポートします
May 01, 2023 pm 07:07 PM
Windows 11 Build 25145 は開発チャネルのユーザーが利用できるようになり、いくつかのマイナーな新機能が含まれています。たとえば、Build25145 では、OneDrive と設定の間のより緊密な統合が可能になります。同様に、ナレーター点字ドライバーのサポートも改善され、新しいローカル管理者パスワード ソリューションが追加されます。これらの改善は、開発チャネルのメンバーのみが利用できます。リリース ノートによると、Windows 11 Build 25145 には点字ドライバー ソリューションが追加されています。同社は、ナレーターが点字ドライバーを自動的に変更するため、ナレーターとサードパーティのスクリーンリーダーをスムーズに切り替えることができるため、点字デバイスの動作が向上すると述べています。始めること
Microsoft、OneDriveビジネスプランから無制限のストレージオプションを削除
Aug 31, 2023 pm 08:17 PM
このサイトのニュースによると、Microsoft は OneDrive for Business プランの「無制限のストレージ」オプションを新規顧客に提供しなくなるため、ビジネス ユーザー向けのクラウド ストレージの提供に影響が出るとのことです。月 OneDrive for Business (プラン 2)。現在、Microsoft の唯一のビジネス クラウド ストレージ プランは OneDrive for Business (プラン 1) です。このサイトでは、中国の OneDrive for Business (プラン 1) の価格がユーザーあたり月額 36 元で、状況に応じて最大 1 TB のクラウド ストレージ スペースを提供していることに気付きました。ユーザー数 オプションで 5TB まで増加します。さらに、マイクロソフトは 2 つの Mi の計画も発表しました。
PHP とアマゾン ウェブ サービスの統合により、効率的なクラウド コンピューティングとストレージが可能になります
Jun 25, 2023 am 09:12 AM
クラウド コンピューティングとビッグ データの継続的な発展により、クラウド サービスは企業や開発者にとって不可欠なツールの 1 つになりました。アマゾン ウェブ サービス (AWS) は、世界で最も人気のあるクラウド サービス プロバイダーの 1 つになりました。広く使用されているサーバーサイド スクリプト言語として、PHP は徐々に多くの企業や開発者にとって最初の選択肢になりました。この記事では、PHP と AWS の統合を通じて効率的なクラウド コンピューティングとストレージを実現する方法について説明します。 1. AWSのメリット 世界最大級のクラウドサービスプロバイダーであるAWS
icloudをオンにする必要がありますか?
Feb 23, 2024 pm 12:51 PM
icloudをオンにする必要がありますか? 昨今、インターネットの発達やスマートフォンの普及により、人々の生活や働き方は大きく変化しています。クラウド ストレージ サービスは、徐々に人々の日常生活に欠かせないものになってきました。その中でも、Apple の iCloud は最も人気のあるクラウド ストレージ サービスの 1 つです。ただし、一部のユーザーにとって、iCloud が本当に必要かどうかわからない場合があります。この記事では、iCloudの必要性をいくつかの側面から探っていきます。まず、iCloud はユーザーに次の方法を提供します。
PHP 開発: Flysystem を使用して複数のクラウド ストレージ サービスを実装する
Jun 15, 2023 pm 10:43 PM
クラウド コンピューティングとクラウド ストレージの発展に伴い、データの保存と送信の問題を解決するためにクラウド ストレージを使用する開発者が増えています。 PHP 開発において、Flysystem は、さまざまなクラウド ストレージ サービスを簡単に使用できる統合 API を提供する非常に実用的なツールです。この記事では、Flysystem を使用して複数のクラウド ストレージ サービスを実装する方法を紹介し、さまざまなサービスのサンプル コードをいくつか示します。フライシステムとは何ですか？フライシステム
トラステッド コンピューティング テクノロジーを使用して、信頼できるクラウド ストレージ システムを構築するにはどうすればよいですか?
Jun 11, 2023 pm 02:16 PM
インターネットとクラウド コンピューティングの継続的な発展に伴い、データ セキュリティの問題は無視できない問題になっています。データのセキュリティと信頼性を保護するために、トラステッド コンピューティングがクラウド ストレージ システムで広く使用されています。この記事では、トラステッド コンピューティング テクノロジーを使用してトラステッド クラウド ストレージ システムを構築するプロセスを詳しく紹介します。まず、トラステッド コンピューティング テクノロジとは何かを理解しましょう。トラステッド コンピューティング テクノロジは、コンピューティング プロセスとその結果がコンピューティング プラットフォーム上で保護されることを保証するテクノロジです。これは、信頼できるコンピューティング プラットフォームでは、計算プロセスも結果もマルウェアや攻撃者によって侵害されることがないことを意味します。
Java SDK を使用して Qiniu Cloud に接続する: クラウド ストレージ サービスを実装するにはどうすればよいですか?
Jul 05, 2023 pm 02:49 PM
JavaSDK を使用して Qiniu Cloud に接続する: クラウド ストレージ サービスを実装するにはどうすればよいですか?はじめに: クラウド コンピューティングの急速な発展に伴い、安全なバックアップとデータの高可用性を実現するためにデータをクラウドに保存する企業や開発者が増えています。 Qiniu Cloud は、中国でよく知られたクラウド ストレージ サービス プロバイダーの 1 つで、豊富なクラウド ストレージ サービスと強力な開発ツールキットを提供しています。この記事では、JavaSDK を使用して Qiniu Cloud に接続し、クラウド ストレージ サービスを実装する方法を紹介します。 1. Qiniu Cloud アカウントの登録: 開始する前に、Qiniu Cloud アカウントを登録し、
