WeChat mini program uploads pictures in batches, mini program uploads multiple pictures (with php server source code)

Official document
https://developers.weixin.qq.com/miniprogram/dev/api/network/upload/wx.uploadFile.html

index.wxml

<view class="container">
  <button bindtap="imgupload">上传图片</button>
</view>

index.js

const app = getApp()

Page({
  data: {
   
  },
  imgupload(){
    wx.chooseImage({
      success (res) {
        // 获取选取的图片
        const tempFilePaths = res.tempFilePaths
        // 循环上传每一张选取的图片
        for (var i = 0; i < tempFilePaths.length; i++) {
          wx.uploadFile({
            url: '你的上传服务端https接口',
            filePath: tempFilePaths[i],
            name: 'file',
            success (res){
              const msg = JSON.parse(res.data).msg;
              const url = JSON.parse(res.data).url;
              const code = JSON.parse(res.data).code;
              if(JSON.parse(res.data).code == 200){
                wx.showToast({
                  title: '成功',
                  icon: 'success',
                  duration: 1000
                })
                console.log(url)
              }else{
                wx.showToast({
                  title: '上传失败',
                  icon: 'error',
                  duration: 1000
                })
              }
              console.log(msg)
            }
          })
        }
      }
    })
  }
})

index.php

<?php
header("Content-Type:application/json");

// 允许上传的图片后缀
$allowedExts = array("jpeg", "jpg", "png");

// 后缀名
if ($allowedExts[0] == 'jpeg') {
    $hzm = 'jpg';
}else{
    $hzm = $allowedExts[0];
}

// 获取选择的文件
$temp = explode(".", $_FILES["file"]["name"]);

// 获取文件后缀名
$extension = end($temp);

if ((($_FILES["file"]["type"] == "image/gif")
|| ($_FILES["file"]["type"] == "image/jpeg")
|| ($_FILES["file"]["type"] == "image/jpg")
|| ($_FILES["file"]["type"] == "image/pjpeg")
|| ($_FILES["file"]["type"] == "image/x-png")
|| ($_FILES["file"]["type"] == "image/png"))
&& ($_FILES["file"]["size"] < 10485760)   // 最大可以上传10MB
&& in_array($extension, $allowedExts))
{
    if ($_FILES["file"]["error"] > 0)
    {
        $result = array(
            'code' => 201,
            'msg' => '上传失败'.$_FILES["file"]["error"]
        );
    }
    else
    {
        
        // 判断当前目录下的 upload 目录是否存在该文件
        // 如果没有 upload 目录，你需要创建它，upload 目录权限为 777
        if (file_exists("upload/" . $_FILES["file"]["name"]))
        {
            $result = array(
                'code' => 202,
                'msg' => '文件已存在'
            );
        }
        else
        {
            // 如果 upload 目录不存在该文件则将文件上传到 upload 目录下
               $new_file = date("Y-m-d")."-".rand(10000,99999).".".$hzm;
            move_uploaded_file($_FILES["file"]["tmp_name"], "upload/".$new_file);
            $result = array(
                'code' => 200,
                'msg' => '上传成功',
                'url' => '这里是图片路径，自己修改你的后端代码路径'.$new_file
            );
        }
    }
}
else
{
    $result = array(
        'code' => 203,
        'msg' => '不支持的文件格式'
    );
}

echo json_encode($result,JSON_UNESCAPED_UNICODE);
?>

Instructions for use

(1) The backend code needs to modify the path where your code is uploaded to the server in order to display the successfully uploaded image address. For example, if your code is uploaded to the img directory under the server root directory, then you need to modify the path to http://domain name/img/upload
(2) It is also necessary to create a new folder named upload in the same directory of index.php, which is used to store uploaded image files.

Author:TANKING
Date:2021-04-14
WeChat:sansure2016
Web:http://www.likeyuns.com