「小程序JAVA實戰」小程序查看視頻發布者信息（64）

當我們點擊右下角白色的小人，查看的是當前登錄者的信息，如果我們點擊右上角視頻發布者，應該可以跳轉到視頻發布者的信息詳情上，查看視頻發布者的信息。其實也沒必要登錄者和視頻發布者頁面不同，應該在同一個頁面，如果來做呢。開始行動把。源碼：https://github.com/limingios/wxProgram.git?中No.15

小程序修改

• videoInfo.js

var?videoUtils?=?require('../../utils/videoUtils.js')const?app?=?getApp()
Page({??data:?{????cover:'cover',????videoContext:"",????videoInfo:{},????videId:'',????src:'',????userLikeVideo:false,????serverUrl:'',????publisher:[]
??},??

??showSearch:function(){
????wx.navigateTo({??????url:?'../videoSearch/videoSearch',
????})
??},??onLoad:function(params){????var?me?=?this;
????me.videoContext?=?wx.createVideoContext('myVideo',?me);????var?videoInfo?=?JSON.parse(params.videoInfo);????var?videoWidth?=?videoInfo.videoWidth;????var?videoHeight?=?videoInfo.videoHeight;????var?cover?=?'cover';????if?(videoWidth?>?videoHeight){
??????cover?=?'';
????}
????me.setData({??????videId:?videoInfo.id,??????src:?app.serverUrl?+?videoInfo.videoPath,??????videoInfo:?videoInfo,??????cover:?cover
????})????var?serverUrl?=?app.serverUrl;????var?user?=?app.getGlobalUserInfo();????var?loginUserId?=?"";????if?(user?!=?null?&&?user?!=?undefined?&&?user?!=?'')?{
??????loginUserId?=?user.id;
????}
????wx.request({??????url:?serverUrl?+?'/user/queryPublisher?loginUserId='?+?loginUserId?+?"&videoId="?+?videoInfo.id?+?"&publishUserId="?+?videoInfo.userId,??????method:?'POST',??????success:?function?(res)?{????????console.log(res.data);????????var?publisher?=?res.data.data.publisher;????????var?userLikeVideo?=?res.data.data.userLikeVideo;

????????me.setData({??????????serverUrl:?serverUrl,??????????publisher:?publisher,??????????userLikeVideo:?userLikeVideo
????????});
??????}
????})




??},??showIndex:function(){
????wx.redirectTo({??????url:?'../index/index',
????})
??},??onShow:function(){????var?me?=?this;
????me.videoContext.play();
??},??onHide:function(){????var?me?=?this;
????me.videoContext.pause();
??},??upload:function(){?
????var?me?=?this;????var?userInfo?=?app.getGlobalUserInfo();????var?videoInfo?=?JSON.stringify(me.data.videoInfo);????var?realUrl?=?'../videoInfo/videoInfo#videoInfo@'?+?videoInfo;????if?(userInfo.id?==?''?||?userInfo.id?==?undefined)?{
??????wx.navigateTo({????????url:?'../userLogin/userLogin?realUrl='?+?realUrl,
??????})
????}?else?{
??????videoUtils.uploadVideo();
????}


??},??showMine:?function?()?{????var?me?=?this;????var?userInfo?=?app.getGlobalUserInfo();????var?videoInfo?=?JSON.parse????if?(userInfo.id?==?''?||?userInfo.id?==?undefined){
??????wx.navigateTo({????????url:?'../userLogin/userLogin',
??????})
????}else{
??????wx.navigateTo({????????url:?'../mine/mine',
??????})
????}
????
???
??},??likeVideoOrNot:?function?()?{????var?me?=?this;????var?userInfo?=?app.getGlobalUserInfo();????var?videoInfoStr?=?JSON.stringify(me.data.videoInfo);????var?realUrl?=?'../videoInfo/videoInfo#videoInfo@'?+?videoInfoStr;????if?(userInfo.id?==?''?||?userInfo.id?==?undefined)?{
??????wx.navigateTo({????????url:?'../userLogin/userLogin?realUrl='?+?realUrl,
??????})
????}?else?{??????var?videoInfo?=?me.data.videoInfo;??????var?userLikeVideo?=?me.data.userLikeVideo;??????var?url?=?"/video/userLike?userId="?+?userInfo.id?+?"&videoId="?+?videoInfo.id?+?"&videoCreaterId="?+?userLikeVideo.userId;??????if?(userLikeVideo){????????var?url?=?"/video/userUnLike?userId="?+?userInfo.id?+?"&videoId="?+?videoInfo.id?+?"&videoCreaterId="?+?userLikeVideo.userId;
??????}
??????wx.showLoading({????????title:?'....',
??????})
??????wx.request({????????url:?app.serverUrl?+?url,????????method:?"POST",????????header:?{??????????'content-type':?'application/json',?//?默認值
??????????'headerUserId':?userInfo.id,??????????'headerUserToken':?userInfo.userToken
????????},????????success:?function?(res)?{
??????????wx.hideLoading();
??????????me.setData({????????????userLikeVideo:?!userLikeVideo,
??????????})
????????}
??????})

????}


??},??showPublisher:function(){????var?me?=?this;????var?userInfo?=?app.getGlobalUserInfo();????var?videoInfo?=?me.data.videoInfo;????var?realUrl?=?'../mine/mine#publisherId@'?+?videoInfo.userId;????if?(userInfo.id?==?''?||?userInfo.id?==?undefined)?{
??????wx.navigateTo({????????url:?'../userLogin/userLogin?realUrl='?+?realUrl,
??????})
????}?else?{
??????wx.navigateTo({????????url:?'../mine/mine?publisherId='?+?videoInfo.userId,
??????})

????}
??}
})

image.png

• mine.js

// pages/mine/mine.jsconst app = getApp()var videoUtils = require('../../utils/videoUtils.js')
Page({ ?/**
 ? * 頁面的初始數據
 ? */
 ?data: { ? ?faceImage: "../../resource/images/noneface.png", ? ?nickname: "昵稱", ? ?fansCounts: 0, ? ?followCounts: 0, ? ?receiveLikeCounts: 0,
 ?}, ?/**
 ? * 用戶注銷
 ? */
 ?logout: function(e) { ? ?var user = app.getGlobalUserInfo();
 ? ?wx.showLoading({ ? ? ?title: '正在注銷中。。。'
 ? ?});
 ? ?wx.request({ ? ? ?url: app.serverUrl + "/logout?userId=" + user.id, ? ? ?method: "POST", ? ? ?header: { ? ? ? ?'content-type': 'application/json' // 默認值
 ? ? ?}, ? ? ?success: function(res) { ? ? ? ?console.log(res.data); ? ? ? ?var status = res.data.status;
 ? ? ? ?wx.hideLoading(); ? ? ? ?if (status == 200) {
 ? ? ? ? ?wx.showToast({ ? ? ? ? ? ?title: "用戶注銷成功~！", ? ? ? ? ? ?icon: 'none', ? ? ? ? ? ?duration: 3000
 ? ? ? ? ?}) ? ? ? ? ?// app.userInfo = null;
 ? ? ? ? ?wx.removeStorageSync("userInfo");
 ? ? ? ? ?wx.redirectTo({ ? ? ? ? ? ?url: '../userRegister/userRegister',
 ? ? ? ? ?})

 ? ? ? ?} else if (status == 500) {
 ? ? ? ? ?wx.showToast({ ? ? ? ? ? ?title: res.data.msg, ? ? ? ? ? ?icon: 'none', ? ? ? ? ? ?duration: 3000
 ? ? ? ? ?})
 ? ? ? ?}
 ? ? ?}
 ? ?})
 ?}, ?/**
 ? * 頭像上傳
 ? */
 ?uploadFace: function(e) { ? ?// var user = app.userInfo;
 ? ?var user = app.getGlobalUserInfo(); ? ?var me = this;
 ? ?wx.chooseImage({ ? ? ?count: 1, // 默認9
 ? ? ?sizeType: ['compressed'], // 可以指定是原圖還是壓縮圖，默認二者都有
 ? ? ?sourceType: ['album', 'camera'], // 可以指定來源是相冊還是相機，默認二者都有
 ? ? ?success: function(res) { ? ? ? ?// 返回選定照片的本地文件路徑列表，tempFilePath可以作為img標簽的src屬性顯示圖片
 ? ? ? ?var tempFilePaths = res.tempFilePaths ? ? ? ?if (tempFilePaths.length > 0) { ? ? ? ? ?console.log(tempFilePaths[0]);
 ? ? ? ? ?wx.uploadFile({ ? ? ? ? ? ?url: app.serverUrl + "/user/uploadFace?userId=" + user.id, //僅為示例，非真實的接口地址
 ? ? ? ? ? ?filePath: tempFilePaths[0], ? ? ? ? ? ?name: 'file', ? ? ? ? ? ?success: function(res) { ? ? ? ? ? ? ?var data = JSON.parse(res.data); ? ? ? ? ? ? ?console.log(data);
 ? ? ? ? ? ? ?wx.hideLoading(); ? ? ? ? ? ? ?if (data.status == 200) {
 ? ? ? ? ? ? ? ?wx.showToast({ ? ? ? ? ? ? ? ? ?title: "用戶上傳成功~！", ? ? ? ? ? ? ? ? ?icon: 'none', ? ? ? ? ? ? ? ? ?duration: 3000
 ? ? ? ? ? ? ? ?})
 ? ? ? ? ? ? ? ?me.setData({ ? ? ? ? ? ? ? ? ?faceUrl: app.serverUrl + data.data
 ? ? ? ? ? ? ? ?})


 ? ? ? ? ? ? ?} else if (data.status == 500) {
 ? ? ? ? ? ? ? ?wx.showToast({ ? ? ? ? ? ? ? ? ?title: data.msg, ? ? ? ? ? ? ? ? ?icon: 'none', ? ? ? ? ? ? ? ? ?duration: 3000
 ? ? ? ? ? ? ? ?})
 ? ? ? ? ? ? ?}
 ? ? ? ? ? ?}
 ? ? ? ? ?})
 ? ? ? ?}

 ? ? ?}
 ? ?})
 ?}, ?/**
 ? * 生命周期函數--監聽頁面加載
 ? */
 ?onLoad: function(params) { ? ?var me = this; ? ?var userInfo = app.getGlobalUserInfo(); ? ?var publisherId = params.publisherId; ? ?var userId = userInfo.id; ? ?if (publisherId != null && publisherId != '' && publisherId!=undefined){
 ? ? ?userId = publisherId;
 ? ?}

 ?
 ? ?wx.showLoading({ ? ? ?title: '正在獲取用戶信息。。。'
 ? ?});
 ? ?wx.request({ ? ? ?url: app.serverUrl + "/user/queryByUserId?userId=" + userId, ? ? ?method: "POST", ? ? ?header: { ? ? ? ?'content-type': 'application/json', // 默認值
 ? ? ? ?'headerUserId': userInfo.id, ? ? ? ?'headerUserToken': userInfo.userToken
 ? ? ?}, ? ? ?success: function(res) { ? ? ? ?console.log(res.data); ? ? ? ?var status = res.data.status; ? ? ? ?if (status == 200) { ? ? ? ? ?var userInfo = res.data.data;
 ? ? ? ? ?wx.hideLoading(); ? ? ? ? ?var faceImage = me.data.faceUrl; ? ? ? ? ?if (userInfo.faceImage != null && userInfo.faceImage != '' && userInfo.faceImage != undefined) {
 ? ? ? ? ? ?faceImage = app.serverUrl + userInfo.faceImage;
 ? ? ? ? ?}
 ? ? ? ? ?me.setData({ ? ? ? ? ? ?faceImage: faceImage, ? ? ? ? ? ?fansCounts: userInfo.fansCounts, ? ? ? ? ? ?followCounts: userInfo.followCounts, ? ? ? ? ? ?receiveLikeCounts: userInfo.receiveLikeCounts, ? ? ? ? ? ?nickname: userInfo.nickname
 ? ? ? ? ?})
 ? ? ? ?} else if (status == 502){
 ? ? ? ? ?wx.showToast({ ? ? ? ? ? ?title: res.data.msg, ? ? ? ? ? ?duration:3000, ? ? ? ? ? ?icon:'none', ? ? ? ? ? ?complete:function(){
 ? ? ? ? ? ? ?wx.removeStorageSync("userInfo");

 ? ? ? ? ? ? ?wx.navigateTo({ ? ? ? ? ? ? ? ?url: '../userLogin/userLogin',
 ? ? ? ? ? ? ?})
 ? ? ? ? ? ?}
 ? ? ? ? ?})
 ? ? ? ? ?
 ? ? ? ?}
 ? ? ?}
 ? ?})
 ?}, ?uploadVideo: function(e) {
 ? ?videoUtils.uploadVideo();
 ?}, ?/**
 ? * 生命周期函數--監聽頁面初次渲染完成
 ? */
 ?onReady: function() {

 ?}, ?/**
 ? * 生命周期函數--監聽頁面顯示
 ? */
 ?onShow: function() {

 ?}, ?/**
 ? * 生命周期函數--監聽頁面隱藏
 ? */
 ?onHide: function() {

 ?}, ?/**
 ? * 生命周期函數--監聽頁面卸載
 ? */
 ?onUnload: function() {

 ?}, ?/**
 ? * 頁面相關事件處理函數--監聽用戶下拉動作
 ? */
 ?onPullDownRefresh: function() {

 ?}, ?/**
 ? * 頁面上拉觸底事件的處理函數
 ? */
 ?onReachBottom: function() {

 ?}, ?/**
 ? * 用戶點擊右上角分享
 ? */
 ?onShareAppMessage: function() {

 ?}
})

PS：現在發布人的界面和個人界面是一樣的，應該根據判斷，發布人的里面只能有關注和視頻列表，而個人界面可以進行注銷上傳視頻操作，下次我們繼續完成。