資訊專欄INFORMATION COLUMN
摘要：做一款小程序，如果需要判斷用戶，當然要獲取一些基本信息，例如頭像，昵稱，。所以本次案例就直接上代碼了。
做一款小程序，如果需要判斷用戶，當然要獲取一些基本信息，例如頭像，昵稱，openid。所以本次案例就直接上代碼了。
小程序前端index.wxml
{{userInfo.nickName}} {{motto}}
index.js
//index.js
//獲取應用實例
const app = getApp()
Page({
data: {
motto: "Hello World",
userInfo: {},
hasUserInfo: false,
canIUse: wx.canIUse("button.open-type.getUserInfo")
},
onLoad: function () {
if (app.globalData.userInfo) {
this.setData({
userInfo: app.globalData.userInfo,
hasUserInfo: true
})
} else if (this.data.canIUse){
// 由于 getUserInfo 是網絡請求，可能會在 Page.onLoad 之后才返回
// 所以此處加入 callback 以防止這種情況
app.userInfoReadyCallback = res => {
this.setData({
userInfo: res.userInfo,
hasUserInfo: true
})
}
} else {
// 在沒有 open-type=getUserInfo 版本的兼容處理
wx.getUserInfo({
success: res => {
app.globalData.userInfo = res.userInfo
this.setData({
userInfo: res.userInfo,
hasUserInfo: true
})
}
})
}
},
getUserInfo: function(e) {
console.log(e)
app.globalData.userInfo = e.detail.userInfo
//獲取openid
wx.login({
success: function (res) {
console.log(res.code)
//發送請求獲取openid
wx.request({
url: "你的域名/openid.php?code=code", //接口地址
data: { code: res.code },
header: {
"content-type": "application/json" //默認值
},
success: function (res) {
//返回openid
console.log(res.data.openid)
//向數據庫注冊用戶，驗證用戶
var that = this;
wx.request({
url: "你的域名/server.php?nickname=" + e.detail.userInfo.nickName + "&avatarUrl=" + e.detail.userInfo.avatarUrl + "&openid=" + res.data.openid,
data: {
},
header: {
"content-type": "application/json"
},
success: function (res) {
//打印用戶信息
console.log(res.data)
}
})
}
})
}
})
this.setData({
userInfo: e.detail.userInfo,
hasUserInfo: true,
})
}
})
index.wxss
/**index.wxss**/
.userinfo {
display: flex;
flex-direction: column;
align-items: center;
}
.userinfo-avatar {
width: 128rpx;
height: 128rpx;
margin: 20rpx;
border-radius: 50%;
}
.userinfo-nickname {
color: #aaa;
}
.usermotto {
margin-top: 200px;
}
后端
openid.php
這是通過code獲取openid的后端
server.php
這是把用戶名、頭像、openid存到數據庫的后端
文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。
轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/29728.html
摘要：微信小程序開放了微信登錄的，無論是個人還是企業申請的小程序均可使用。開始寫服務端，也很容易。 微信小程序開放了微信登錄的api，無論是個人還是企業申請的小程序均可使用。 首先創建一個項目，把這些代碼都清空，我們自己寫！ showImg(https://segmentfault.com/img/bVbco8j?w=1022&h=860); 然后，開始寫了！首先index.wxml，寫一個...
摘要：是什么是表示用戶在你的當前應用中的唯一標識比如小程序，微信公眾號等，這些都算是一個應用，如果你有多個應用，同一個用戶的可能并不相同下圖是獲取的過程微信的官方文檔和時序圖小程序登錄的時序圖思路首先調用獲取登錄憑證調用接口前，需要把微信小程序的 OpenId是什么？openid 是表示用戶在你的當前應用中的唯一標識,比如小程序，微信公眾號等，這些都算是一個應用，如果你有多個應用，同一個用...
摘要：項目規劃本項目為基于微信手機應用平臺的一款運動互動型小程序，實現了用戶即時運動步數群內與個人動態的發布，小程序前端采用原生框架，后端采用基于的框架，數據庫采用，對象存儲采用七牛云，服務器采用阿里，域名采用認證。 1. 項目規劃 本項目為基于微信手機應用平臺的一款運動互動型小程序，實現了用戶即時運動步數群內PK與個人動態的發布，小程序前端采用原生框架，后端采用基于Node的koa2框架，...
摘要：功能介紹對準上面的小程序碼，掃一下，嘀地一聲，掃碼成功，打開小程序，進入小程序首頁。因為手頭上沒有可樂，所以我找來了一只非常專業的貓，扮演一瓶的可口可樂演示給大家看。 1.功能介紹 showImg(https://segmentfault.com/img/remote/1460000016260048?w=240&h=240); 對準上面的小程序碼，掃一下，‘嘀’~地一聲，掃碼成功，打...
閱讀 3058·2021-11-16 11:45
閱讀 3578·2021-09-29 09:34
閱讀 702·2021-08-16 10:50
閱讀 1569·2019-08-30 15:52
閱讀 1962·2019-08-30 15:45
閱讀 859·2019-08-29 15:23
閱讀 1923·2019-08-26 13:51
閱讀 3299·2019-08-26 12:23
