1. 程式人生 > >微信小程式(將學生資訊上傳到阿里雲資料庫)

微信小程式(將學生資訊上傳到阿里雲資料庫)



//上傳
function upload(that,id){
  if(that.data.imageList.length==0){
    return;
  }

  wx.uploadFile({
    url:"http://lichenlu.top/server/index.php/home/index/upload",
    filePath:that.data.imageList[0],
    name:'file',
    formData:{
      'id':id
    },
    success:function(res){
      var data = res.data;
      console.log(data);
      var json = JSON.parse(res.data);
      wx.showToast({
        title:json.msg,
        icon:'none',
        duration:3000
      })
    }
  })
}
Page({
  data: {
    sex:'女',
    imageList:[]
  },
  onLoad: function () {

  },
  switchChange:function(e){
    if(e.detail.value){
      this.setData({sex:'女'})
    }else{
      this.setData({ sex: '男' })
    }
  },
  getUserInfo: function(e) {
    console.log(e)
    app.globalData.userInfo = e.detail.userInfo
    this.setData({
      userInfo: e.detail.userInfo,
      hasUserInfo: true
    })
  },

  formsubmit:function(e){
    var no = e.detail.value.no;
    var name = e.detail.value.name;
    var sex = e.detail.value.sex;
    var age = e.detail.value.age;
      wx.request({
        url:"http://lichenlu.top/server/index.php/home/index/index",
        data:e.detail.value,
        method:'POST',
        data: {
          no: no,
          name: name,
          sex:sex,
          age:age

        },
        header: {
          'content-type': 'application/x-www-form-urlencoded'
        },
        success: (res)=> {
          console.log(res);

          if (res.error) {
            wx.showToast({    //延時跳轉
              title: res.data.msg,
              icon: 'none',
              duration: 2000
            })
          } else {
            //上傳照片
            upload(this,res.data.id);

            wx.showToast({    //延時跳轉
              title: '新增成功',
              icon: 'success',
              duration: 2000,
              success: function () {
                setTimeout(function () {
                //   // wx.removeStorage({ key: 'student', })
                //   // wx.navigateBack({ delta: 1 })
                  wx.navigateTo({
                    url: '../head/head',
                  })
                }, 1000)
              }
            })
          }
        }
      })
  },

首先獲取學號,姓名,性別,年齡等資料, 設定提交按鈕的繫結事件formsubmit,

呼叫介面

url:"http://lichenlu.top/server/index.php/home/index/index"之前需要獲取一些欄位值
//照相
  chooseImage: function () {
    var that = this
    wx.chooseImage({
      // // sourceType: sourceType[this.data.sourceTypeIndex],
      // sizeType: sizeType[this.data.sizeTypeIndex],
      // count: this.data.count[this.data.countIndex],
      count: 1, // 預設9
      sizeType: ['original', 'compressed'], // 可以指定是原圖還是壓縮圖,預設二者都有
      sourceType: ['album', 'camera'], // 可以指定來源是相簿還是相機,預設二者都有
      success: function (res) {
        console.log(res)
        that.setData({
          imageList: res.tempFilePaths
        })
      }
    })
  },
  //預覽圖片
  previewImage: function (e) {
    var current = e.target.dataset.src

    wx.previewImage({
      current: current,
      urls: this.data.imageList
    })
  }
})

上傳uploads圖片時js中要寫關於預覽圖片的一些事件

後臺介面中也要自己事先寫好方法並傳入阿里雲伺服器上寫上index方法

public function index($no,$name,$sex,$age){
		$data['no'] = $no;
		$data['name'] = $name;
		$data['sex'] = $sex;
		$data['age'] = $age;
		$id = M('student')->add($data);
		if($id){
			return $this->ajaxReturn(array('error'=>false,'id'=>$id,'msg'=>'新增成功'));
		}else{
			return $this->ajaxReturn(array('error'=>true,'msg'=>'添加出錯'));
		}
	}