Jadual Kandungan
uploadify实现七牛云存储 显示上传进度+页面显示,uploadify牛云
Rumah php教程 php手册 uploadify实现七牛云存储 显示上传进度+页面显示,uploadify牛云

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

Jun 13, 2016 am 09:19 AM
penyimpanan awan

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.';
	}
}
?>
Salin selepas log masuk

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

<?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.';
    }
}
Salin selepas log masuk

  前台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>
Salin selepas log masuk

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

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

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

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

 DEMO:

http://hxend.com/uploadif/

 

博文归石头和博客园所有,转载请注明出处,方便更新。
 http://www.cnblogs.com/webers/p/4162108.html
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn

Alat AI Hot

Undresser.AI Undress

Undresser.AI Undress

Apl berkuasa AI untuk mencipta foto bogel yang realistik

AI Clothes Remover

AI Clothes Remover

Alat AI dalam talian untuk mengeluarkan pakaian daripada foto.

Undress AI Tool

Undress AI Tool

Gambar buka pakaian secara percuma

Clothoff.io

Clothoff.io

Penyingkiran pakaian AI

AI Hentai Generator

AI Hentai Generator

Menjana ai hentai secara percuma.

Artikel Panas

R.E.P.O. Kristal tenaga dijelaskan dan apa yang mereka lakukan (kristal kuning)
3 minggu yang lalu By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O. Tetapan grafik terbaik
3 minggu yang lalu By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O. Cara Memperbaiki Audio Jika anda tidak dapat mendengar sesiapa
3 minggu yang lalu By 尊渡假赌尊渡假赌尊渡假赌
WWE 2K25: Cara Membuka Segala -galanya Di Myrise
4 minggu yang lalu By 尊渡假赌尊渡假赌尊渡假赌

Alat panas

Notepad++7.3.1

Notepad++7.3.1

Editor kod yang mudah digunakan dan percuma

SublimeText3 versi Cina

SublimeText3 versi Cina

Versi Cina, sangat mudah digunakan

Hantar Studio 13.0.1

Hantar Studio 13.0.1

Persekitaran pembangunan bersepadu PHP yang berkuasa

Dreamweaver CS6

Dreamweaver CS6

Alat pembangunan web visual

SublimeText3 versi Mac

SublimeText3 versi Mac

Perisian penyuntingan kod peringkat Tuhan (SublimeText3)

Cara Membetulkan Penggunaan CPU Tinggi Explorer.exe Windows 11 Cara Membetulkan Penggunaan CPU Tinggi Explorer.exe Windows 11 May 02, 2023 am 09:40 AM

Tidak seperti isu penggunaan CPU tinggi Explorer.exe dalam Windows 11, komputer mungkin mengalami penggunaan CPU yang tinggi. Ini adalah perkara biasa, selagi ia jarang berlaku dan tidak menjejaskan prestasi PC anda dengan ketara. Walau bagaimanapun, ini boleh menjadi masalah apabila ia berlaku berulang kali. Ia boleh memanaskan sistem anda, melambatkan masa pemuatan dan berkemungkinan membeku semasa anda menjalankan tugas penting. Mengapakah komputer saya mengalami penggunaan CPU yang tinggi dengan Explorer.exe? Biasanya, komputer mungkin mengalami penggunaan CPU yang tinggi disebabkan salah satu daripada sebab berikut: Menjalankan program yang memerlukan keperluan CPU yang lebih tinggi: Penyuntingan video dan perisian permainan boleh mencetuskan penggunaan CPU yang tinggi. Jika diterbitkan dengan

Kemas kini pratonton Windows 11 menyokong integrasi OneDrive yang lebih mendalam Kemas kini pratonton Windows 11 menyokong integrasi OneDrive yang lebih mendalam May 01, 2023 pm 07:07 PM

Windows 11 Build 25145 kini tersedia untuk pengguna dalam saluran pembangunan dan termasuk beberapa ciri baharu kecil. Sebagai contoh, Build25145 membolehkan penyepaduan yang lebih ketat antara OneDrive dan Tetapan. Begitu juga, ia juga meningkatkan sokongan pemandu braille Narrator dan menambah penyelesaian kata laluan pentadbir tempatan baharu. Penambahbaikan ini hanya tersedia untuk ahli Saluran Pembangunan. Menurut nota keluaran, Windows 11 Build 25145 menambah penyelesaian pemacu braille. Syarikat itu berkata peranti braille kini akan berfungsi dengan lebih baik kerana ia boleh bertukar dengan lancar antara Narrator dan pembaca skrin pihak ketiga kerana Narrator menukar pemacu braille secara automatik. untuk memulakan

Microsoft mengalih keluar pilihan storan tanpa had daripada rancangan perniagaan OneDrive Microsoft mengalih keluar pilihan storan tanpa had daripada rancangan perniagaan OneDrive Aug 31, 2023 pm 08:17 PM

Berita dari tapak ini menunjukkan bahawa Microsoft tidak lagi akan menawarkan pilihan "storan tanpa had" pelan OneDrive for Business kepada pelanggan baharu, yang memberi kesan kepada tawaran storan awan untuk pengguna perniagaan TechRadar mendapati bahawa Microsoft telah mengalih keluar $10 setiap pengguna bulan OneDrive for Business (Pelan 2). Pada masa ini, satu-satunya pelan storan awan perniagaan Microsoft ialah OneDrive for Business (Pelan 1 Tapak ini mendapati bahawa OneDrive for Business China (Pelan 1) berharga 36 yuan bagi setiap pengguna sebulan, menyediakan sehingga 1TB ruang storan awan, bergantung pada). bilangan pengguna meningkat kepada 5TB. Selain itu, Microsoft juga telah mengumumkan rancangan untuk dua Mi

Penyepaduan PHP dan Perkhidmatan Web Amazon membolehkan pengkomputeran dan storan awan yang cekap Penyepaduan PHP dan Perkhidmatan Web Amazon membolehkan pengkomputeran dan storan awan yang cekap Jun 25, 2023 am 09:12 AM

Dengan pembangunan berterusan pengkomputeran awan dan data besar, perkhidmatan awan telah menjadi salah satu alat yang sangat diperlukan untuk perusahaan dan pembangun. Perkhidmatan Web Amazon (AWS) telah menjadi salah satu penyedia perkhidmatan awan paling popular di dunia. Sebagai bahasa skrip bahagian pelayan yang digunakan secara meluas, PHP secara beransur-ansur menjadi pilihan pertama untuk banyak perusahaan dan pembangun. Artikel ini akan membincangkan cara untuk mencapai pengkomputeran dan penyimpanan awan yang cekap melalui penyepaduan PHP dan AWS. 1. Kelebihan AWS Sebagai salah satu penyedia perkhidmatan awan terbesar di dunia, AWS

Adakah perlu untuk menghidupkan icloud? Adakah perlu untuk menghidupkan icloud? Feb 23, 2024 pm 12:51 PM

Adakah perlu menghidupkan icloud pada masa kini, dengan perkembangan Internet dan populariti telefon pintar, kehidupan dan gaya kerja orang telah banyak berubah. Perkhidmatan storan awan secara beransur-ansur menjadi bahagian yang sangat diperlukan dalam kehidupan seharian orang ramai. Antaranya, iCloud Apple adalah salah satu perkhidmatan storan awan yang paling popular. Walau bagaimanapun, bagi sesetengah pengguna, mereka mungkin tidak pasti sama ada iCloud benar-benar diperlukan. Artikel ini akan meneroka keperluan iCloud dari beberapa aspek. Pertama, iCloud menyediakan pengguna dengan cara untuk

Pembangunan PHP: Gunakan Flysystem untuk melaksanakan pelbagai perkhidmatan storan awan Pembangunan PHP: Gunakan Flysystem untuk melaksanakan pelbagai perkhidmatan storan awan Jun 15, 2023 pm 10:43 PM

Dengan pembangunan pengkomputeran awan dan storan awan, semakin ramai pembangun mula menggunakan storan awan untuk menyelesaikan masalah menyimpan dan menghantar data. Dalam pembangunan PHP, Flysystem ialah alat yang sangat praktikal yang menyediakan API bersatu yang boleh menggunakan banyak perkhidmatan storan awan yang berbeza dengan mudah. Dalam artikel ini, kami akan memperkenalkan cara menggunakan Flysystem untuk melaksanakan berbilang perkhidmatan storan awan dan menunjukkan beberapa kod sampel untuk perkhidmatan yang berbeza. Apa itu Flysystem? Sistem terbang

Bagaimana untuk menggunakan teknologi pengkomputeran yang dipercayai untuk membina sistem storan awan yang dipercayai? Bagaimana untuk menggunakan teknologi pengkomputeran yang dipercayai untuk membina sistem storan awan yang dipercayai? Jun 11, 2023 pm 02:16 PM

Dengan pembangunan berterusan Internet dan pengkomputeran awan, isu keselamatan data telah menjadi isu yang tidak boleh diabaikan. Untuk melindungi keselamatan dan kebolehpercayaan data, pengkomputeran yang dipercayai digunakan secara meluas dalam sistem storan awan. Artikel ini akan memperkenalkan secara terperinci proses membina sistem storan awan yang dipercayai menggunakan teknologi pengkomputeran yang dipercayai. Mula-mula, mari kita fahami apa itu teknologi pengkomputeran yang dipercayai. Teknologi pengkomputeran yang dipercayai ialah teknologi yang memastikan proses pengkomputeran dan keputusannya dilindungi pada platform pengkomputeran. Ini bermakna bahawa pada platform pengkomputeran yang dipercayai, proses pengiraan mahupun keputusan tidak boleh dikompromi oleh perisian hasad atau penyerang

Menggunakan Java SDK untuk menyambung ke Qiniu Cloud: Bagaimana untuk melaksanakan perkhidmatan storan awan? Menggunakan Java SDK untuk menyambung ke Qiniu Cloud: Bagaimana untuk melaksanakan perkhidmatan storan awan? Jul 05, 2023 pm 02:49 PM

Menggunakan JavaSDK untuk menyambung ke Qiniu Cloud: Bagaimana untuk melaksanakan perkhidmatan storan awan? Pengenalan: Dengan perkembangan pesat pengkomputeran awan, semakin banyak perusahaan dan pembangun menyimpan data pada awan untuk mencapai sandaran selamat dan ketersediaan data yang tinggi. Qiniu Cloud ialah salah satu penyedia perkhidmatan storan awan yang terkenal di China, menyediakan pelbagai perkhidmatan storan awan dan kit alat pembangunan yang berkuasa. Artikel ini akan memperkenalkan cara menggunakan JavaSDK untuk menyambung ke Qiniu Cloud untuk melaksanakan perkhidmatan storan awan. 1. Daftar akaun Qiniu Cloud: Sebelum bermula, anda perlu mendaftar akaun Qiniu Cloud dan buat

See all articles