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 |

Outils d'IA chauds

Undresser.AI Undress
Application basée sur l'IA pour créer des photos de nu réalistes

AI Clothes Remover
Outil d'IA en ligne pour supprimer les vêtements des photos.

Undress AI Tool
Images de déshabillage gratuites

Clothoff.io
Dissolvant de vêtements AI

AI Hentai Generator
Générez AI Hentai gratuitement.

Article chaud

Outils chauds

Bloc-notes++7.3.1
Éditeur de code facile à utiliser et gratuit

SublimeText3 version chinoise
Version chinoise, très simple à utiliser

Envoyer Studio 13.0.1
Puissant environnement de développement intégré PHP

Dreamweaver CS6
Outils de développement Web visuel

SublimeText3 version Mac
Logiciel d'édition de code au niveau de Dieu (SublimeText3)

Contrairement au problème d’utilisation élevée du processeur d’Explorer.exe dans Windows 11, un ordinateur peut connaître une utilisation élevée du processeur. Ceci est tout à fait normal, à condition que cela se produise rarement et n'affecte pas de manière significative les performances de votre PC. Toutefois, cela peut devenir un problème lorsque cela se produit de manière répétée. Il peut surchauffer votre système, retarder les temps de chargement et potentiellement se bloquer pendant que vous travaillez sur des tâches importantes. Pourquoi mon ordinateur connaît-il une utilisation élevée du processeur avec Explorer.exe ? En règle générale, un ordinateur peut connaître une utilisation élevée du processeur pour l'une des raisons suivantes : Exécution de programmes nécessitant des exigences de processeur plus élevées : les logiciels de montage vidéo et de jeux peuvent déclencher une utilisation élevée du processeur. Si publié avec

Windows 11 Build 25145 est désormais disponible pour les utilisateurs du canal de développement et inclut quelques nouvelles fonctionnalités mineures. Par exemple, Build25145 permet une intégration plus étroite entre OneDrive et Paramètres. De même, il améliore également la prise en charge du pilote braille du Narrateur et ajoute une nouvelle solution de mot de passe d'administrateur local. Ces améliorations ne sont disponibles que pour les membres du canal de développement. Selon les notes de version, Windows 11 Build 25145 ajoute une solution de pilote braille. La société affirme que les appareils braille fonctionneront désormais mieux car ils pourront basculer en douceur entre le Narrateur et les lecteurs d'écran tiers, car le Narrateur modifie automatiquement le pilote braille. pour commencer

Les nouvelles de ce site montrent que Microsoft n'offrira plus l'option « stockage illimité » du plan OneDrive for Business aux nouveaux clients, ce qui a un impact sur les offres de stockage cloud pour les utilisateurs professionnels. TechRadar a constaté que Microsoft avait supprimé les 10 $ par utilisateur et par utilisateur. mois OneDrive Entreprise (Plan 2). Actuellement, le seul plan de stockage cloud professionnel de Microsoft est OneDrive for Business (Plan 1). Ce site a remarqué que le OneDrive for Business (Plan 1) de Chine coûte 36 yuans par utilisateur et par mois, fournissant jusqu'à 1 To d'espace de stockage cloud, selon les besoins. le nombre d'utilisateurs peut être augmenté en option à 5 To. De plus, Microsoft a également annoncé des plans pour ses deux Mi

Avec le développement continu du cloud computing et du big data, les services cloud sont devenus l'un des outils indispensables pour les entreprises et les développeurs. Amazon Web Services (AWS) est devenu l'un des fournisseurs de services cloud les plus populaires au monde. En tant que langage de script côté serveur largement utilisé, PHP est progressivement devenu le premier choix de nombreuses entreprises et développeurs. Cet article explique comment obtenir un cloud computing et un stockage efficaces grâce à l'intégration PHP et AWS. 1. Avantages d'AWS En tant que l'un des plus grands fournisseurs de services cloud au monde, AWS

Est-il nécessaire d'activer iCloud ? De nos jours, avec le développement d'Internet et la popularité des smartphones, les modes de vie et de travail des gens ont beaucoup changé. Les services de stockage cloud sont progressivement devenus un élément indispensable de la vie quotidienne des gens. Parmi eux, iCloud d'Apple est l'un des services de stockage cloud les plus populaires. Cependant, pour certains utilisateurs, ils ne savent peut-être pas si iCloud est vraiment nécessaire. Cet article explorera la nécessité d'iCloud sous plusieurs aspects. Premièrement, iCloud offre aux utilisateurs un moyen de

Avec le développement du cloud computing et du stockage cloud, de plus en plus de développeurs commencent à utiliser le stockage cloud pour résoudre les problèmes de stockage et de transmission de données. Dans le développement PHP, Flysystem est un outil très pratique qui fournit une API unifiée pouvant facilement utiliser de nombreux services de stockage cloud différents. Dans cet article, nous présenterons comment utiliser Flysystem pour implémenter plusieurs services de stockage cloud et montrerons des exemples de code pour différents services. Qu’est-ce que Flysystem ? Système de mouche

Utiliser JavaSDK pour se connecter à Qiniu Cloud : comment implémenter des services de stockage cloud ? Introduction : Avec le développement rapide du cloud computing, de plus en plus d'entreprises et de développeurs stockent des données sur le cloud pour obtenir une sauvegarde sécurisée et une haute disponibilité des données. Qiniu Cloud est l'un des fournisseurs de services de stockage cloud les plus connus en Chine, fournissant une multitude de services de stockage cloud et de puissantes boîtes à outils de développement. Cet article explique comment utiliser JavaSDK pour se connecter à Qiniu Cloud afin de mettre en œuvre des services de stockage cloud. 1. Enregistrez un compte Qiniu Cloud : Avant de commencer, vous devez enregistrer un compte Qiniu Cloud et créer

Avec le développement continu d’Internet et du cloud computing, les problèmes de sécurité des données sont devenus un problème incontournable. Afin de protéger la sécurité et la fiabilité des données, l'informatique de confiance est largement utilisée dans les systèmes de stockage cloud. Cet article présentera en détail le processus de création d'un système de stockage cloud fiable à l'aide d'une technologie informatique fiable. Tout d’abord, comprenons ce qu’est une technologie informatique fiable. La technologie informatique de confiance est une technologie qui garantit que le processus informatique et ses résultats sont protégés sur la plateforme informatique. Cela signifie que sur une plateforme informatique fiable, ni le processus de calcul ni les résultats ne peuvent être compromis par des logiciels malveillants ou des attaquants.
