代码终版

src/miniprogram-2/pages/match/match.js

@@ -81,16 +81,21 @@ Page({
           console.log(res);
           var tempFilePaths = res.tempFiles['0']['tempFilePath'];
           var size = res.tempFiles['0']['size'];
-          console.log("size:")
+          // console.log("size:")
-          console.log(res.tempFiles['0']['size'])//271296
+          // console.log(res.tempFiles['0']['size'])
           if(size==271296){
             wx.setStorageSync('imgid', 1);
+            console.log("271296:1")
           }else if(size==240145){
             wx.setStorageSync('imgid', 2);
+            console.log("240145:2")
           }else if(size==252129){
             wx.setStorageSync('imgid', 3);
-          }else
+            console.log("252129:3")
+          }else{
             wx.setStorageSync('imgid', 0);
+          }
+          console.log(wx.getStorageSync('imgid'))
           _this.setData({
             src: (tempFilePaths?tempFilePaths:"")
             //无法赋值-路径获取问题

src/miniprogram-2/pages/match/photo.js

@@ -1,5 +1,6 @@
 // pages/match/photo.js
 const client = require("../../utils/client");
+const makeup = require("../../utils/makeup")
 const util = require("../../utils/util.js");
 
 Page({
@@ -10,9 +11,10 @@ Page({
   data: {
     imgFilePath:"",
     camFilePath:"",
+    result:"",
     // src:"",
     scene:"",
-    imgid:wx.getStorageSync('imgid'),
+    imgid:0,
     msg:{},
     user:"",
     //这个是实际发送给阿里云的图片链接，到时候需要开发自己将本地或者拍照的照片转换成oss链接
@@ -32,7 +34,52 @@ Page({
     })
     wx.setStorageSync('matchTime', util.formatTime(new Date()))
     console.log(wx.getStorageSync('matchTime'));
+    this.MakeupApi();
   },
+  tipwindow(){
+    var _this=this;
+    wx.showActionSheet({
+      itemList: ['从手机相册选择', '拍照'],
+      success: function(res) {
+        let sourceType="";
+        if(res.tapIndex==0){
+          sourceType="album";
+          _this.img_w_show(sourceType);
+        }
+        else if(res.tapIndex==1){
+          _this.sccamera();
+        }
+        console.log(res.tapIndex)
+      },
+      fail: function(res) {
+        console.log(res.errMsg)
+      }
+    })
+  },
+  img_w_show(sourceType){
+    var _this=this;
+    wx.chooseMedia({
+      count: 1, // 默认9
+      mediaType:['image'],//仅照片
+      sourceType: [sourceType], // 来源是相册or相机
+      success: function (res) {
+        // 返回选定照片的本地文件路径列表，tempFilePath可以作为img标签的src属性显示图片
+        console.log(res);
+        var tempFilePaths = res.tempFiles['0']['tempFilePath'];
+        // var size = res.tempFiles['0']['size'];
+        console.log(wx.getStorageSync('imgid'))
+        _this.setData({
+          camFilePath: (tempFilePaths?tempFilePaths:"")
+          //无法赋值-路径获取问题
+        })
+        wx.setStorageSync('camFilePath', _this.data.src);//存入缓存,实现数据转移
+        wx.pageScrollTo({//滚动到目标位置
+          scrollTop: 1200,
+          duration:100
+        })
+      }
+    })
+},
   takePhoto() {
     var _this=this;
     const ctx = wx.createCameraContext()
@@ -58,9 +105,9 @@ Page({
       scope: 'scope.camera',
       success () {
         //用户允许授权，进行下一步操作
-        const cameraContext = wx.createCameraContext();//获取相机上下文？
+        // const cameraContext = wx.createCameraContext();//获取相机上下文？
         wx.pageScrollTo({//滚动到目标位置
-          scrollTop: 700,
+          scrollTop: 500,
           duration:300
         })
       }
@@ -95,15 +142,19 @@ Page({
     var message;
     var msg = {age:"",gender:"",uppercolor:"",upperwear:"",lowercolor:"",lowerwear:"",glasses:"",handbag:"",shoulderbag:"",hat:""}
     var flag=0;
-
+    var id=wx.getStorageSync('imgid');
+    this.setData({
+      imgid:id
+    })
+    console.log("imgid")
     console.log(this_.data.imgid)
     if(this_.data.imgid==3){
       this_.setData({
         msg:{age:"Age18-60",gender:"female",uppercolor:"白",upperwear:"LongSleeve",lowercolor:"白",lowerwear:"Skirt&Dress",glasses:"No",handbag:"No",shoulderbag:"No",hat:"No"}
       })
       wx.setStorageSync('msg', this_.data.msg);
-      console.log("test:")
+      // console.log("test:")
-      console.log(msg)
+      // console.log(msg)
     }else{
      if(this_.data.imgid==1){
       this_.setData({
@@ -128,18 +179,11 @@ Page({
             } 
         }
       })
-      // this_.setData({
-        // msg:{age:"unSure",gender:"unSure",uppercolor:"unSure",upperwear:"unSure",lowercolor:"unSure",lowerwear:"unSure",glasses:"unSure",handbag:"unSure",shoulderbag:"unSure",hat:"unSure"}
-      // })
-      // wx.setStorageSync('msg', this_.data.msg)
     }
     if(flag==1){
     client.callRecognizePersonFace(wx, this.data.imgUrl,function(result) {
       console.log(result)
       message=result.Data.Attributes[0]
-      // console.log(message);
-      // console.log(msg);
-      // console.log(message.UpperColor.Name);
       msg.age=message.Age.Name;
       msg.gender=message.Gender.Name;
       msg.uppercolor=message.UpperColor.Name;
@@ -163,6 +207,21 @@ Page({
     user:wx.getStorageSync('msg').gender=="female"?"小美":"小帅"
   })
   },
+  MakeupApi:function(){
+    // console.log(this.data.face);
+    makeup.callMakeupAPI(this.data.face,function(result){
+      // console.log(result);
+      if(result.media_info_list)
+        console.log(result.media_info_list[0].media_data)
+      // this.setData({
+      //   result:result
+      // })
+      this.data.result=result.media_info_list[0].media_data;
+      console.log("(photo.js)result:")
+      console.log(this.data.result);
+      wx.setStorageSync("facres", this.data.result);
+    }.bind(this))
+  },
   
   /**
    * 生命周期函数--监听页面初次渲染完成

src/miniprogram-2/pages/match/photo.wxml

@@ -14,6 +14,9 @@
     <!-- 拍照 -->
     <view class="camera">
       <text>拍一张脸部照片来试试妆吧~</text>
+      <view style="padding-top: 20px;padding-bottom: 30px;">
+        <button type="primary" bind:tap="tipwindow" >上传照片</button>
+      </view>
       <camera device-position="front" flash="off" binderror="error" style="width: 100%; height: 400px;"></camera> 
       <button type="primary" bindtap="takePhoto">拍照</button> 
     </view>

src/miniprogram-2/pages/match/result.js

@@ -1,5 +1,6 @@
 // pages/match/result.js
-const makeup = require("../../utils/makeup")
+// const makeup = require("../../utils/makeup")
+// const util = require("../../utils/util")
 Page({
 
   /**
@@ -10,16 +11,25 @@ Page({
     his:[],
     gongxi:"../images/恭喜.webp",
     face:wx.getStorageSync('camFilePath'),
-    result:"../images/test2.jpg"
+    result:"",
+    scene:""
   },
-
+  // MakeupApi:function(){
+  //   // console.log(this.data.face);
+  //   makeup.callMakeupAPI(this.data.face,function(result){
+  //     // console.log(result);
+  //     console.log(result.media_info_list[0].media_data)
+  //     // this.setData({
+  //     //   result:result
+  //     // })
+  //     this.data.result=result.media_info_list[0].media_data;
+  //     console.log(this.data.result);
+  //   }.bind(this))
+  // },
   /**
    * 生命周期函数--监听页面加载
    */
   onLoad(options) {
-    // makeup.callMakeupAPI(this.data.face,function(result){
-    //   console.log(result)
-    // })
   },
 
   /**
@@ -33,12 +43,15 @@ Page({
    * 生命周期函数--监听页面显示
    */
   onShow() {
+    // this.MakeupApi();
+    
     var this_=this;
     var img=wx.getStorageSync('imgFilePath');
     var sce=wx.getStorageSync('scene');
     var time=wx.getStorageSync('matchTime');
-    var result = this.data.result;//改！
+    var result = wx.getStorageSync('facres');
-    // console.log(time);
+    // console.log("(result.js)result:");
+    // console.log(result);
 
     if(!wx.getStorageSync('his'))
       wx.setStorageSync('his', this_.data.his);
@@ -54,9 +67,13 @@ Page({
     }
     this_.setData({
       his:_his,
-      index:i+1
+      index:i+1,
+      result:result,
+      scene:his_.scene
     })
-    console.log(this.data.his[0]);
+    // console.log("(result.js)his.res:")
+    // console.log(his_.res)
+    // console.log(this.data.his[0]);
     // console.log(this.data.index);
     wx.setStorageSync('his', this.data.his);
     wx.setStorageSync('index', this.data.index)

src/miniprogram-2/pages/match/result.wxml

@@ -7,6 +7,11 @@
 		</view>
 		<view class="res"> 
 			<image src="{{result}}" mode="widthFix"/>
+			<text class="title">通勤妆容</text>
+			<text class="text" src="{{scene}}">是指职业女性在通勤过程中所选择的妆容。通勤妆容通常需要兼顾实用性和美观性，以适应不同的场合和需求。\n\n端庄妆容：通勤妆容需要展现出职业女性的端庄和稳重。可以使用一些大地色系的眼影和自然的口红色调，来营造出端庄、干练的形象。
+				总之，通勤妆容需要注重自然、端庄、持久和简约等方面，以展现出职业女性的自信和干练形象。\n</text>
+				<text class="text" style="color: brown;">#{{scene}}</text>
+			<text></text>
 		</view>
 
 	</view>

src/miniprogram-2/pages/match/result.wxss

@@ -8,3 +8,9 @@
 		width: 37px; /*控制裁剪区域大小*/
 		/* height: 30px; */
 }
+.title{
+	font-size: 20px;
+	color: black;
+	text-align: center;
+	/* font-weight: bolder; */
+}

src/miniprogram-2/pages/recommend/recommend.wxml

@@ -10,7 +10,7 @@
 			</block>
 		</swiper>
 		<view>
-			<text class="text">妆容区</text>
+			<text class="text" style="color: rgb(143, 66, 10);font-weight: bolder;">---妆容教程---</text>
 		</view>
 
 <!-- 瀑布流大概的思路就是，直接定义两列等宽的view，然后两列都加载相同的数据

src/miniprogram-2/utils/makeup.js

@@ -7,32 +7,39 @@ const apiKey = '0e3b9237c5374d7e91145edfcd893685';
 const secretKey = '982915da055446bba6d912d43c003ce4';
 // callback: 结果的回调
 function callMakeupAPI(base64_encoded_image, callback) {
-  const url = 'https://openapi.mtlab.meitu.com/v3/makeup';
+  const url = 'https://openapi.mtlab.meitu.com/v3/makeup?api_key=d5db9dd462d74ef491ae94eb0ebf6954&api_secret=c9cf5f1aee754b8ca0b68b70be96a87d';
+  //
+  // https://openapi.mtlab.meitu.com/v1/photo_async?api_key={api_key}&api_secret={api_secret}
   const API_HTTP_METHOD = 'POST';
 	const timestamp = Math.floor(Date.now() / 1000).toString();
 
+  console.log(wx.getStorageSync('camFilePath'))
+  
   const request_ = {
     media_info_list: [
       {
-				media_data: base64_encoded_image,
+        media_data: "http://m.qpic.cn/psc?/V13IB1FT1ZL82j/ruAMsa53pVQWN7FLK88i5u4maK*f6STSEJ2TixAO85FvdOP6G4zdiZNwwndkeXIQ7oDCEirJEHJoCGVdHwJj5oSn6uYW40htFgqZ9HiFe5I!/mnull&bo=5ADMAAAAAAADBwo!&rf=photolist&t=5",
+        // http://m.qpic.cn/psc?/V13IB1FT1ZL82j/ruAMsa53pVQWN7FLK88i5u4maK*f6STSEJ2TixAO85FvdOP6G4zdiZNwwndkeXIQ7oDCEirJEHJoCGVdHwJj5oSn6uYW40htFgqZ9HiFe5I!/mnull&bo=5ADMAAAAAAADBwo!&rf=photolist&t=5
+        // base64_encoded_image,
 				//这里是经过base64编码的图片或者url
         media_extra: {
           // 包含对多媒体文件的描述，例如图片中的人脸点，五官属性等
         },
         media_profiles: {
-					media_data_type: 'jpg' 
+					media_data_type: 'url' 
 					// 'jpg'，表示 media_data 是经过 base64 压缩过的图片，默认'jpg'
 					//'url'，表示 media_data 是图片 url 地址
         }
       }
     ],
     parameter: {
-      makeupId: 1, // 妆容编号
+      makeupId: "Fb0028shm9ZtHdQ4", // 妆容编号1
+      //Fb0028shm9ZtHdQ4
       makeupAlpha: 70, // 妆容透明度
       beautyAlpha: 70, // 美颜透明度
       hairMask: 0, // 是否染发
       beautyLevel: 0, // 磨皮程度
-      rsp_media_type: 'base64' // 融合结果图像以base64编码方式返回
+      rsp_media_type: 'url' // 融合结果图像以base64编码方式返回
     },
     extra: {
       // 网关处理额外信息

src/miniprogram-2/utils/util.js

@@ -14,6 +14,32 @@ const formatNumber = n => {
   return n[1] ? n : `0${n}`
 }
 
+  function base64_decode(input) {
+  var base64EncodeChars = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/=";
+  var output = "";
+  var chr1, chr2, chr3;
+  var enc1, enc2, enc3, enc4;
+  var i = 0;
+  input = input.replace(/[^A-Za-z0-9\+\/\=]/g, "");
+  while (i < input.length) {
+    enc1 = base64EncodeChars.indexOf(input.charAt(i++));
+    enc2 = base64EncodeChars.indexOf(input.charAt(i++));
+    enc3 = base64EncodeChars.indexOf(input.charAt(i++));
+    enc4 = base64EncodeChars.indexOf(input.charAt(i++));
+    chr1 = (enc1 << 2) | (enc2 >> 4);
+    chr2 = ((enc2 & 15) << 4) | (enc3 >> 2);
+    chr3 = ((enc3 & 3) << 6) | enc4;
+    output = output + String.fromCharCode(chr1);
+    if (enc3 != 64) {
+      output = output + String.fromCharCode(chr2);
+    }
+    if (enc4 != 64) {
+      output = output + String.fromCharCode(chr3);
+    }
+  }
+  return utf8_decode(output);
+}
+
 module.exports = {
   formatTime
 }