How does input:file get the path of network pictures on your phone?

in Wechat"s built-in browser, open an h5 page with a button for uploading images. When you click upload, you can"t get the images (PhotoClip is the plug-in for uploading images here). Then I debugged, and when I debugged, I found that not all the pictures could not be uploaded. Finally, I found that some pictures on my phone were normally suffixed with picture files, and some pictures were downloaded from the network without a picture file suffix, such as / /-- 123456.downloading (I.),) Then there is a judgment in the PhotoClip plug-in to determine whether the selected file is an image file:

if (!/image\/\w+/.test(files.type)) {
    alert("");
    return false;
} else {
    //...
}

here we fall into another pit-- in Wechat"s built-in browser, the alert pop-up box is disabled by it, that is, even though the plug-in pops up a warning, because of this foolish mechanism, when users select this kind of network image, they find that they cannot cut and upload-- there is neither prompt nor selected picture to display, it just feels invalid.
No way, there is a problem. Still have to find a way to solve, I only have one idea: copy a toast prompt box to prompt users to re-select. But one problem is, if users have to take it seriously: this is clearly a normal picture, why don"t you let me upload it? Shit what stupid project, carry away.

do you have any seniors to point out a more spectrum-dependent method?


  1. accept Control upload suffix
  2. if you default to any suffix uploaded by the user, it must be a picture, because File inherits Blob , so you only need to change blob type and then re- new File can be treated as a picture.

A solution to this problem has been found (not perfect):
remove the accept= "image/ " attribute of input, remove the expression that modifies accept= "image/ " in the plug-in, that is, upload files in all formats by default! Only in this way can you enter the judgment statement in the plug-in, and there will be an alert interaction;
another correction:

alertjpg/pnginput
$file.on("change", function () {
    if (!/image\/\w+/.test(files.type)) {
        alert("");
        return false;
    } else {
        //...
    }
})
alert

it's really magic here. You specify accept= "image/*". The last time you had a file in another format, the change event of input could not be monitored properly.

Menu