// package_B/page/changeMessage/index.js import {changeMessage} from '../../../api/mine.js' import {getOssAuth} from '../../../api/upload.js' import {Base64} from 'js-base64' // const Base64 = require('js-base64') const crypto = require('crypto-js') import {checkPhoneNumber, checkUserName} from '../../../utils/check.js' Page({ /** * 页面的初始数据 */ data: { userInfo: {}, ossForm: {}, form: {}, formRules: { avatar: { type: 'image', title: "用户头像", tips: "请输入用户头像", validator: function (value) { return value != '' }, placeholder: "请输入用户头像" }, nickname: { type: 'input', title: "用户昵称", tips: "请输入用户昵称(中文、数字、字母)", validator: function (value) { return value != "" && checkUserName(value) }, placeholder: "请输入用户昵称(中文、数字、字母)" }, mobile: { type: 'input', title: "电话号码", tips: "请输入正确格式的电话号码", validator: function (value) { return value != '' && checkPhoneNumber(value) }, placeholder: "请输入正确格式的电话号码" } } }, onLoad(e) { let userInfo = wx.getStorageSync('userInfo') let form = this.data.form form = Object.assign({}, userInfo) this.setData({form, userInfo}) }, onShow() { this.getAuth() }, bindValue(e) { let name = e.currentTarget.dataset.name; let str = "form."+name this.setData({ [str]: e.detail.value, }) this.validate(name, e.detail.value) }, validate(name) { let formRules = this.data.formRules; let validator = this.data.formRules[name].validator let result = false if(!this.data.form[name]) { result = true } else { result = validator ? !validator(this.data.form[name]) : false; } formRules[name].warning = result this.setData({ formRules }) return result }, validateForm() { return new Promise((resolve, reject) => { try { let formRules = this.data.formRules; let result = false; for (let key in formRules) { let temp = this.validate(key) if (temp) { result = temp } } resolve(!result) } catch (e) { reject(e) } }) }, /* 上传图片 */ uploadImage(){ wx.chooseImage({ count: 1, // 最多可以选择的图片张数,默认9 mediaType: ['image'], // 图片 sizeType: ['original'], // original 原图,compressed 压缩图,默认二者都有 sourceType: ['album', 'camera'], // album 从相册选图,camera 使用相机,默认二者都有 success:(res) =>{ // success let form = this.data.form form.avatar = res.tempFilePaths this.setData({ form }) this.validate('avatar') }, fail: (e) => { console.log(e); } }) }, getAuth() { let that = this getOssAuth().then(res=> { let client = { region: 'oss-cn-shanghai', secure: true, accessKeyId: res.data.accessKeyId, accessKeySecret: res.data.accessKeySecret, securityToken: res.data.securityToken, bucket: 'ta-tech-image' } // 计算签名 function computeSignature(accessKeySecret, canonicalString) { return crypto.enc.Base64.stringify(crypto.HmacSHA1(canonicalString, accessKeySecret)); } const date = new Date(); date.setHours(date.getHours() + 1); const policyText = { expiration: date.toISOString(), // 设置policy过期时间。 conditions: [ // 限制上传大小。 ["content-length-range", 0, 1024 * 1024 * 1024], ], }; // 获取签名 const policy = Base64.encode(JSON.stringify(policyText)) // policy必须为base64的string。 const signature = computeSignature(client.accessKeySecret, policy) let ossForm = that.data.ossForm ossForm = { OSSAccessKeyId: client.accessKeyId, signature, policy, SecurityToken: client.securityToken } that.setData({ossForm}) }).catch(e=> { console.log(e); }) }, // 提交 submitForm() { let that = this this.validateForm().then(res => { if(res) { let params = {} let form = this.data.form params.id = form.id params.nickname = form.nickname params.mobile = form.mobile // 需要上传oss if(form.avatar instanceof Array) { wx.showLoading({ title: '上传中', mask: true }) // 设置文件上传路径 const randomString = Math.random().toString(36).slice(2) const timestamp = new Date().getTime() const key = `imagedir/${randomString}_${timestamp}.png` wx.uploadFile({ url: 'https://ta-tech-image.oss-cn-shanghai.aliyuncs.com', filePath: form.avatar[0], name: 'file', formData: { key, OSSAccessKeyId: that.data.ossForm.OSSAccessKeyId, signature: that.data.ossForm.signature, policy: that.data.ossForm.policy, 'x-oss-security-token': that.data.ossForm.SecurityToken }, success: (res)=> { if(res.statusCode === 204) { // 上传成功 params.avatar = key changeMessage(params).then(res=> { wx.hideLoading() if(res.code === 0) { wx.setStorageSync('userInfo', res.data) wx.switchTab({ url: '/pages/mine/mine', }) } }).catch((e)=> { wx.hideLoading() console.log(e); }) } else { wx.hideLoading() wx.showToast({ icon: 'error', title: '图片上传失败', duration: 2000 }) } }, fail: (e)=> { wx.hideLoading() console.log(e); } }) } else { changeMessage(params).then(res=> { wx.hideLoading() if(res.code === 0) { wx.setStorageSync('userInfo', res.data) wx.switchTab({ url: '/pages/mine/mine', }) } }).catch((e)=> { wx.hideLoading() console.log(e); }) } } else { wx.showToast({ icon: 'error', title: '请完善必填信息', duration: 2000 }) } }) } })