微信小程序:上传图片到别的域名文件下

效果

微信小程序:上传图片到别的域名文件下_第1张图片

wxml



  
    
      
    
  
  
    +
  

wxss

/* 上传照片样式 */
.line3 {
  padding-top: 8%;
  background-color: white;
  width: 100%;
  padding-bottom: 4%;
  /* border: 1px solid black; */
}

.addbtn {
  padding-top: 5%;
  margin-left: 2%;
  padding-bottom: 5%;
  /* border: 1px solid black; */
}

.pic {
  float: left;
  position: relative;
  margin-right: 9px;
  margin-bottom: 9px;
  /* border: 1px solid black;  */
}

.weui-uploader_img {
  /* border: 1px solid black; */
  width: 150rpx;
  height: 150rpx;
}

.delete-btn {
  position: absolute;
  top: -14rpx;
  right: -14rpx;
  width: 20px;
  height: 20px;
  z-index: 9999;
}

.addphoto {
  width: 150rpx;
  height: 150rpx;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  /* background-color: #F6F6F6; */
  border: 1px dashed #C6C6C6;
}

.addtext {
  /* border: 1px solid black; */
  /* font-size: 50px; */
  width: 80rpx;
  height: 80rpx;
  color: #BFC1C2;
}

js

const app = getApp()
Page({
  data: {
    //上传照片图片
    clear: app.globalData.icon + 'photo/clear.png',
    add: app.globalData.icon + 'photo/photo.png',
    imgs: [],
    allphoto: [],
  },
  //上传图片
  add_photo(e) {
    var that = this;
    var imgs = this.data.imgs;
    if (imgs.length >= 9) {
      this.setData({
        lenMore: 1
      });
      setTimeout(function () {
        that.setData({
          lenMore: 0
        });
      }, 2500);
      return false;
    }
    wx.chooseImage({ //图片相机的选择chooseMedia
      // count: 1, // 默认9
      sizeType: ['original', 'compressed'], // 可以指定是原图还是压缩图,默认二者都有
      sourceType: ['album', 'camera'], // 可以指定来源是相册还是相机,默认二者都有
      success: function (res) {
        // 返回选定照片的本地文件路径列表,tempFilePath可以作为img标签的src属性显示图片
        var tempFilePaths = res.tempFilePaths;
        // console.log('返回图片路径信息', res.tempFilePaths)
        var imgs = that.data.imgs;
        for (var i = 0; i < tempFilePaths.length; i++) {
          if (imgs.length >= 9) {
            that.setData({
              imgs: imgs
            });
            return false;
          } else {
            imgs.push(tempFilePaths[i]);
          }
        }
        that.setData({
          imgs: imgs
        });
        console.log('图片合集', that.data.imgs);
      }
    });
  },
  // 删除图片
  deleteImg: function (e) {
    var imgs = this.data.imgs;
    var index = e.currentTarget.dataset.index;
    imgs.splice(index, 1);
    this.setData({
      imgs: imgs
    });
    // console.log('上传图片合集', this.data.imgs);
  },
  // 预览图片
  previewImg: function (e) {
    //获取当前图片的下标
    var index = e.currentTarget.dataset.index;
    //所有图片
    var imgs = this.data.imgs;
    wx.previewImage({
      //当前显示图片
      current: imgs[index],
      //所有图片
      urls: imgs
    })
  },
  sumbit(){
    console.log(this.data.imgs)
    //先执行图片上传
    let imgs = this.data.imgs
    // console.log(this.data.imgs)
    for (var i = 0; i < this.data.imgs.length; i++) {
      var that = this
      wx.uploadFile({
        //别的域名文件
        url: 'https://域名/api/api_wxmini.php',
        filePath: imgs[i],
        name: "file",
        header: {
          "content-type": "multipart/form-data"
        },
        success: function (res) {
          if (res.statusCode == 200) {
            wx.showToast({
              title: "上传成功",
              icon: "none",
              duration: 1500
            })
            console.log(res.data)
            that.data.allphoto.push(res.data) //向数组末端插入数据
          }
        },
        fail: function (err) {
          wx.showToast({
            title: "上传失败",
            icon: "none",
            duration: 2000
          })
        },
      })
    }
  }
})

php

别的文件路径

微信小程序:上传图片到别的域名文件下_第2张图片

图片路径 

微信小程序:上传图片到别的域名文件下_第3张图片

代码

1,'message'=>'失败信息');
        echo json_encode($result);
    }
    //创建文件夹 权限问题
    function mkdirs($dir, $mode = 0777){
        if (is_dir($dir) || @mkdir($dir, $mode)) return TRUE;
        if (!mkdirs(dirname($dir), $mode)) return FALSE;
        return @mkdir($dir, $mode);
    }
?>

微信公众平台

上添加需要访问的域名

微信小程序:上传图片到别的域名文件下_第4张图片

你可能感兴趣的:(微信小程序,php,微信小程序,notepad++,小程序)