说明

• 简单演示微信小程序上传 jpg 图片到 php 服务器，并在 php 服务器保存接收到的图片。
• 使用微信开发者工具运行小程序代码。勾选“不校验合法域名、web-view（业务域名），TLS版本及HTTPS证书”，可在工具里面用 http 访问 php 服务器域名，本地小程序甚至可以访问本地 php 项目。

代码详情

小程序代码

api.wxml

<button bindtap="bindUpload">上传图片</button>

api.js

Pages({
  bindUpload: function() {
    wx.chooseImage({
      success: function(res) {
        wx.uploadFile({
          //php 服务器地址
          url: 'http://localhost/mytest/test.php',
          filePath: res.tempFilePaths[0],
          name: 'file',
          formData: {
            'user': 'test'
          },
          success: function(res) {
            console.log(res)
          }
        })
      },
    })
  }
})

• wx.chooseImage() 从本地相册选择图片
• wx.uploadFile() 将本地资源上传到服务器

php代码

test.php

<?php
if(!empty($_FILES['file'])) {
    var_dump($_FILES['file']);
    move_uploaded_file($_FILES['file']['tmp_name'],$_SERVER['DOCUMENT_ROOT'].'/mytest/'.'test.jpg');
}

• $_FILES 获取上传的图片文件
• move_uploaded_file(） 将获取的图片的临时文件转存到 php 项目 mytest 的根目录下

运行结果

在微信开发者工具点击“上传图片”按钮，选择本地图片上传。请求 php 打印的文件信息如下图。其中参数 name 是微信上传文件后生成的文件名，参数 tem_name 是 php 获取到上传文件的缓存文件，缓存文件在脚本执行完毕之后被回收。

完成上传操作之后，在 php 项目 mytest 的根目录下可以看到从微信小程序上传的文件 test.jpg。
一般情况下，需要在保存上传文件之前，要做一些验证，比如文件后缀的检测等。这里为了简单直观，直接进行图片保存。上传不是 jpg 格式的图片，要在 php 脚本将后缀名改一下，最好动态获取 name 参数的后缀作为保存文件的后缀。