Using Plupload to upload attachments directly to seven cattle cloud storage _javascript Tips

Source: Internet
Author: User
Tags echo date rar silverlight

Which users does this plugin mainly target?

1. Small space want to do download server users, there is not enough bandwidth, and there is not enough space, how do we get this? Our site into the middle tier, and then the user uploaded to the server in fact uploaded to the seven cattle cloud storage, download is equivalent to in seven cattle download, that is, save space and save the bandwidth, to solve the small space can not do download station!

2. My own server is very good, but sometimes the user upload only a few K speed to go up, this is a number of ISPs limited to 64KB, but not up to a few k, this real existence, we also use this to do the upload server, and then the software to download the timer to the server, this is now a site owner now do

3. Do a personal document library, so that others are uploaded to my cloud space

Examples of the following figure

About this plugin, JS has to say plupload this plug-in is really strong, powerful there is a problem, complex, what is called complex is customizable, their hands and clothing, want to function you can achieve, if only the plug-in that is too strenuous, you can refer to the official API, I just do a seven-cow demo, the front of the uploadify can be seen together!

index.php

Copy Code code as follows:

<?php
Require_once ("./qiniu/io.php");
Require_once ("./qiniu/rs.php");
Require_once ("./qiniu/fop.php");
$bucket = "Space name";
$accessKey = ' Apikey ';
$secretKey = ' Apikey ';
Qiniu_setkeys ($accessKey, $secretKey);
$putPolicy = new Qiniu_rs_putpolicy ($bucket);
$upToken = $putPolicy->token (null);
?>
<! DOCTYPE html>
<meta http-equiv= "Content-type" content= "text/html; Charset=utf-8 "/>
<title>plupload for Qiniu</title>
<link rel= "stylesheet" href= "//ajax.googleapis.com/ajax/libs/jqueryui/1.8.9/themes/base/jquery-ui.css" Text/css "/>
<script src= "//ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js" ></script>
<script src= "//ajax.googleapis.com/ajax/libs/jqueryui/1.10.2/jquery-ui.min.js" ></script>
<link rel= "stylesheet" href= "/js/jquery.plupload.queue/css/jquery.plupload.queue.css" type= "Text/css"/>
<script type= "Text/javascript" src= "/js/plupload.full.min.js" ></script>
<script type= "Text/javascript" src= "/js/jquery.ui.plupload/jquery.ui.plupload.js" ></script>
<script type= "Text/javascript" src= "/js/jquery.plupload.queue/jquery.plupload.queue.js" ></script>
<body style= "font:13px Verdana; Background: #eee; Color: #333 ">
<div id= "Uploader" >
<p>your Browser doesn ' t have Flash, Silverlight or HTML5 support.</p>
</div>
<script type= "Text/javascript" >
$ (function () {
$ ("#uploader"). Pluploadqueue ({
Set type
Runtimes: ' Html5,flash,silverlight ',
Set URL to upload
URL: ' http://up.qiniu.com/',

Multipart:true,
Set post to seven cattle token
Multipart_params: {
' token ': ' <?php echo $upToken;?> ',
},

Resize: {width:800, height:600, quality:60},//set size
Modify the Post field to seven Bull's file
File_data_name: ' File ',
Set some restrictions
Filters: {
Set size
Max_file_size: ' 10MB ',
Types allowed to upload
Mime_types: [
{title: "Image Files", Extensions: "Png,jpeg"},
{title: "RAR Files", Extensions: "Rar,zip,tar.gz"}
]
},
Set the path for Flash
Flash_swf_url: './js/moxie.swf ',
Setting the path of Silverlight
Silverlight_xap_url: './js/moxie.xap ',
Multiple file uploads If you're uploading multiple files, you can get rid of the comments here.
PreInit: {
Uploadfile:function (up,file) {
Up.settings.multipart_params.key=file.name;
//  }
// },

});
var uploader = $ (' #uploader '). Pluploadqueue (); Get upload Queue
Binding filesadded This method is a lot of ways you can see the official API Single File upload method
Uploader.bind (' filesadded ', function (up,files) {
Get file name This is single if multiple files need to be recycled
var filename = files[0].name;
var filedata = Filename.split (".");
var type = filedata[filedata.length-1];
up.settings.multipart_params.key= "<?php echo date (' Ymd-his '). '-' . Rand (10000,99999);? > "+". " +type;
});
if (Uploader.files.length > 0) {//i.e. if there are files in the upload queue
Uploader.start ();
} else {
Alert (' You must select a file. ');
}
});
</script>
</body>

Seven cattle products are really good, we can learn from the front of the article, there are server backup (LINUX) and uploadify This plug-in, relatively speaking this JS plug-in simple words, of course, there are seven of cattle query code, if you have any questions ask me

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.