Are these two functions so difficult to implement? If not, you can get a clear answer by checking the upload function of Flickr.
Why can this function be implemented? After Google, the answer is revealed. It turns out that some flash functions are used through JavaScript and
Implement the interaction of ActionScript. Communication between JS and as has been studied before, so it is very easy to implement. Next, go to F1 in flash.
Yes, I have almost understood it. Therefore, the next thing is just a boat.
The most important thing is the improvement of the flash code. The final results are as follows:
// Multiuploader. fla
Import flash.net. filereferencelist;
Import flash.net. filereference;
Import flash. External. externalinterface;
// Set the mappings between as functions and JS calls.
Externalinterface. addcallback ("fu_open_dialog", null, opendialog );
Externalinterface. addcallback ("fu_begin_upload", null, beginupload );
// You can set upload_url in flashvars on the HTML page to change the path of the uploaded file.
VaR uploadurl: String = typeof (_ root. upload_url) = "undefined "? "Flashupload. ashx": _ root. upload_url;
VaR listener: Object = new object ();
// After the file is selected, the JS function onuploaderselect is called in the view, and the file list is passed in to facilitate js to further implement logic control.
Listener. onselect = function (filereflist: filereferencelist ){
Externalinterface. Call ("onuploaderselect", filereflist. filelist );
};
VaR filereflist: filereferencelist = NULL;
VaR imagetypes: Object = new object ();
Imagetypes. Description = "Images (*. jpg, *. JPEG, *. GIF, *. PNG)"; // File Upload type description
Imagetypes. Extension = "*. jpg; *. JPEG; *. gif; *. PNG"; // control the Upload File Type
// Display the file opening window
Function opendialog (): void {
If (filereflist = NULL ){
Filereflist = new filereferencelist ();
Filereflist. addlistener (listener );
}
Filereflist. Browse ([imagetypes]);
}
// Start upload
Function beginupload (): void {
VaR Lis = new object ();
// Call the onuploadercomplete function after each file is uploaded.
Lis. oncomplete = function (File: filereference): void {
Externalinterface. Call ("onuploadercomplete", file. Name );
};
// Handle the HTTP status error of the upload address. For example, 404.
Lis. onhttperror = function (File: filereference, httperror: Number): void {
Externalinterface. Call ("onuploaderhttperror", httperror, file. Name );
}
VaR list: array = filereflist. filelist;
VaR item: filereference;
// Finally, upload the file to the specified upload page for processing.
For (var I: Number = 0; I <list. length; I ++ ){
Item = list [I];
Item. addlistener (LIS );
Item. Upload (uploadurl );
}
}
For client processing, you only need to implement several JS functions automatically called in. The final page code is as follows:
<! Doctype HTML public "-// W3C // dtd html 4.01 transitional // en" "http://www.w3.org/TR/html4/loose.dtd">
<HTML>
<Head>
<Meta http-equiv = "Content-Type" content = "text/html; charset = UTF-8">
<Title> insert title here </title>
</Head>
<Body>
<Input type = "button" value = "open" onclick = "openuploaddialog ();"/>
<Input type = "button" value = "Upload" onclick = "uploadfiles ();"/>
<Div id = "flashpanel"> </div>
</Body>
<SCRIPT type = "text/JavaScript">
VaR flash = createuploadflash (document. getelementbyid ('flashpanel '), 'upload.swf', 'flashupload. ashx ')
// Open the file dialog box
Function openuploaddialog (){
Flash. fu_open_dialog ();
}
// Upload a file
Function uploadfiles (){
Flash. fu_begin_upload ();
}
// After selecting a file
Function onuploaderselect (list ){
Alert (list );
}
// After uploading a file
Function onuploadercomplete (name ){
Alert (name );
}
// When an error occurs during File Upload
Function onuploaderhttperror (number, name ){
Switch (number ){
Case 413:
Alert ("file" + name + "greater than 10 KB, cannot be uploaded ");
Break;
}
}
/**
* Create a flash. In IE7, You need to click the mouse to activate flash. This can be bypassed by dynamically generating flash.
* @ Param panel: The DIV used to place the flash
* @ Param flashurl: flash Address
* @ Param uploadurl: The address used to upload the file
*/
Function createuploadflash (panel, flashurl, uploadurl ){
VaR code = '<object
Classid = "CLSID: d27cdb6e-ae6d-11cf-96b8-444553540000"
Codebase = "http://fpdownload.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=8,0,0,0"
Width = "0" Height = "0" id = "flashobject" align = "Middle">/
<Param name = "allowScriptAccess" value = "samedomain"/>/
<Param name = "movie" value = "'+ flashurl +'"/>/
<Param name = "quality" value = "high"/>/
<Param name = "bgcolor" value = "# ffffff"/>/
<Param name = "flashvars" value = "upload_url = '+ uploadurl +'"/>/
<Embed src = "'+ flashurl + '"
Quality = "high" bgcolor = "# ffffff" width = "0" Height = "0"
Name = "flashobject" flashvars = "upload_url = '+ uploadurl + '"
Align = "Middle" allowScriptAccess = "samedomain" id = "flashobject"
Type = "application/X-Shockwave-flash"
Pluginspage = "http://www.macromedia.com/go/getflashplayer"/>/
</Object> ';
Panel. innerhtml = code;
Return response example Doc ument. flashobject;
}
</SCRIPT>
</Html>
The implementation of this function has been smoothly implemented in other aspects, but it has encountered some trouble in implementing the createuploadflash function. Because the final returned flash
Objects are often not recognized normally. If this code is not generated using JS, use document. flashobject and
Dobument. getelementbyid ('flashobobject') can recognize flashobject normally, but after dynamic generation, the latter cannot be used
It is often accessed. The possible reason is that loading requires a certain delay and needs to be studied.
This method can be used to upload files. In addition, it can solve the problem of multi-choice and file type filtering. In addition, it can also achieve the non-refreshing upload of files, you can perform other work while uploading images.
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
