What should I do if I use WeChat WEUI to upload images? what should I do with PHP in the background?

How does PHP in the background process Image uploading through WEUI? Q: How does the backend PHP handle image Upload through WEUI?

1. Currently, the problem is that the weui image Upload framework of the application is encountered. However, in the code preview section, li gets the image of the blob type. However, there is only one input, and the last image can only be obtained after ajax is submitted to php.

    
 
 
        
  
  
        
  
  
 
50%
 
    
 
 
    
            

2. only one input can be obtained through $ _ FILES in the background. How can we get all of them? How does one process images uploaded using weui?

If the patch photo does not contain [], the obtained information is:

Solution

// The solution is as follows: rewrite the hidden domain of the file. after an image is selected, the current file is automatically hidden, and a new empty file type = "file" is inserted through js ", in this way, you can upload multiple files. The rewrite code is as follows: $ (function () {var tmpl ='
', $ Gallery = $ ("# gallery"), $ galleryImg = $ ("# galleryImg"), $ uploaderInput = $ ("# uploaderInput "), $ uploaderFiles = $ ("# uploaderFiles"); // The on must be changed to live. because jquery inserts html, js events will become invalid and live $ uploaderInput is used. live ("change", function (e) {var src, url = window. URL | window. webkitURL | window. invalid URL, files = e.tar get. files; for (var I = 0, len = files. length; I <len; ++ I) {var file = files [I]; if (url ){ Src = url. createObjectURL (file);} else {src = e.tar get. result;} var src_split = src. split ('/'); $ uploaderFiles. append ($ (tmpl. replace ('# url #', src ). replace ('# imgname #', src_split [src_split.length-1]); // where img_str is a hidden text box written by myself, used to store characters consisting of all image names, similar to "'name 1', 'Name 2', 'Name 3'", because I used the value of this hidden box to delete the specified image on the page. If ($ ("# img_str "). val () = ''| $ (" # img_str "). val () = null) {$ ("# img_str "). val ("'" + src_split [src_split.length-1] + "'");} else {$ ("# img_str "). val ($ ("# img_str "). val () + ", '" + src_split [src_split.length-1] + "'");} // enable hidden Upload p $ (this ). after (''); $ (This ). hide (); $ (this ). attr ({id: "" + src_split [src_split.length-1] + "_ input"}) ;}}); $ uploaderFiles. on ("click", "li", function () {$ galleryImg. attr ("style", this. getAttribute ("style"); $ gallery. fadeIn (100) ;}); $ gallery. on ("click", function () {$ gallery. fadeOut (100) ;}); // The code for deleting an image is also posted. $ (". Weui-gallery _ del "). click (function () {var imgback = $ (this ). parent ("p "). prev (). attr ("style"); var imgback_array = imgback. split ('); imgback_array = imgback_array [0]. split ('/'); $ ("#" + imgback_array [imgback_array.length-1] + "_ input "). remove (); $ ("#" + imgback_array [imgback_array.length-1] + "_ li "). remove (); var img_str = $ ("# img_str "). val (). split (','); var img_str_new = ''; for (var I = 0; I array (size = 0) empty 'files' => array (size = 3) 0 => array (size = 14) 'File _ name' => string 'e2dafa6a5f06dc34004607e1f00a4824.jpg '(length = 36) 'File _ type' => string 'image/jpeg '(length = 10) 'File _ path' => string 'E: /wamp/www/test/js/fileUpload/server/upload/tsjy/'(length = 64) 'full _ path' => string 'E: /wamp/www/test/js/fileUpload/server/upload/tsjy/e2dafa6a5f06dc34004607e1f00a4824.jpg '(length = 100) 'raw _ name' => string 'e2dafa6a5f06dc34004607e1f00a4824 '(length = 32) 'orig _ name' => string '-0.jpg' (length = 6) 'client _ name' => string '6880_jpg_wh300.jpg '(length = 18) 'File _ ext' => string '.jpg '(length = 4) 'File _ size' => float 93.32 'is _ image' => boolean true 'image _ width' => int 960 'image _ height' => int 300 'image _ type '=> string 'jpeg' (length = 4) 'image _ size_str '=> string 'width = "960" height = "300"' (length = 24) 1 => array (size = 14) 'File _ name' => string 'ba7a0cc5930d19c6b1abfd795b3eb4d3.jpg '(length = 36) 'File _ type' => string 'image/jpeg' (length = 10) 'File _ path' => string 'E:/wamp/www/test/js/fileUpload/server/upload/tsjy/'(length = 64) 'Full _ path' => string 'E:/wamp/www/test/js/fileUpload/server/upload/tsjy/ba7a0cc5930d19c6b1abfd795b3eb4d3.jpg '(length = 100) 'raw _ name' => string 'ba7a0cc5930d19c6b1abfd795b3eb4d3 '(length = 32) 'orig _ name' => string '-1.jpg' (length = 6) 'client _ name' => string '4856_jpg_wh300.jpg '(length = 18) 'File _ ext' => string '.jpg '(length = 4) 'File _ size' => float 92.95 'is _ image' => boolean true 'image _ width' => int 1190 'image _ height' => int 300 'image _ type '=> string 'jpeg' (length = 4) 'image _ size_str '=> string 'width = "1190" height = "300"' (length = 25) 2 => array (size = 14) 'File _ name' => string 'fc0e75063c34f102a3a67fd17aa54a18.jpg '(length = 36) 'File _ type' => string 'image/jpeg' (length = 10) 'File _ path' => string 'E:/wamp/www/test/js/fileUpload/server/upload/tsjy/'(length = 64) 'Full _ path' => string 'E:/wamp/www/test/js/fileUpload/server/upload/tsjy/fc0e75063c34f102a3a67fd17aa54a18.jpg '(length = 100) 'raw _ name' => string 'fc0e75063c34f102a3a67fd17aa54a18' (length = 32) 'orig _ name' => string '-2.jpg '(length = 6) 'client _ name' => string '%3_jpg_wh300.jpg '(length = 18) 'File _ text' => string '.jpg' (length = 4) 'File _ size' => float 214.92 'is _ image' => boolean true 'image _ width' => int 1152 'image _ height' => int 300 'image _ type '=> string 'jpeg' (length = 4) 'image _ size_str '=> string 'width = "1152" height = "300"' (length = 25)

Related articles:

Angularjs integrated UI (weui)

The encapsulation of common JS information prompts in WEUI applications

What knowledge can we learn through WeUI?