微信小程序調(diào)整頭像和昵稱獲取規(guī)則后，開發(fā)者該怎樣應(yīng)對(duì)？

微信小程序官方在2022年11月9日的時(shí)候，出了一則公告，公告內(nèi)容大概為：開發(fā)者不能通過wx.getUserInfo接口去獲取微信用戶頭像和昵稱了，生效期后發(fā)布的插件新版本，通過 wx.getUserInfo 接口獲取用戶頭像將統(tǒng)一返回默認(rèn)灰色頭像，昵稱將統(tǒng)一返回 “微信用戶”。生效期前發(fā)布的插件版本不受影響，但如果要進(jìn)行版本更新則需要進(jìn)行適配。通過 wx.login 與 wx.getUserInfo 接口獲取 openId、unionId 能力不受影響。因?yàn)槲⑿判〕绦蚬俜綖榱朔乐褂腥瞬缓侠?span style="color: #333333; --tt-darkmode-color: #A3A3A3;">收集用戶的微信昵稱頭像，收回了這接口。

然后我們會(huì)發(fā)現(xiàn)，之前上線的小程序，頭像變灰了，昵稱也變成了“微信用戶”，這對(duì)用戶體驗(yàn)性來說，簡直是致命打擊。作為一枚擁有極度強(qiáng)迫癥的攻城獅，絕對(duì)不能接受這樣的情況發(fā)生！

針對(duì)這一現(xiàn)象，我們?cè)趺磥硗炀然蛘咭?guī)避呢？微信也針對(duì)這個(gè)問題，做了一些調(diào)整，從之前的wx.getUserInfo直接獲取，改成了頭像昵稱填寫。開發(fā)者呢，則可以根據(jù)微信小程序官方指導(dǎo)文檔，進(jìn)行二次處理。

下面是我個(gè)人實(shí)踐的流程和結(jié)果：

1、首先前端簡單做一個(gè)授權(quán)界面，因?yàn)槲沂秦?fù)責(zé)后端，前端就簡單寫一下，同行勿噴！

授權(quán)框代碼

2、看一下界面效果

我這里設(shè)計(jì)的邏輯是用戶取消授權(quán)就跳回原頁面，去授權(quán)就彈出微信小程序頭像選擇框；

頭像授權(quán)

頭像選擇：

去授權(quán)微信小程序頭像

這里我們不用去管用戶到底是取消授權(quán)還是用什么頭像，只要觸發(fā)bindchooseavatar 事件，我們監(jiān)聽這個(gè)事件函數(shù)，拿到頭像結(jié)果即可。

選擇微信小程序頭像，并監(jiān)聽該事件

拿到頭像之后，我們可以提示用戶填寫昵稱，當(dāng)然，如果沒有用到昵稱也可以不需要這一步，直接去登錄。

提示用戶去填寫昵稱

當(dāng)用戶點(diǎn)擊輸入框的時(shí)候，會(huì)自動(dòng)彈出用戶微信昵稱，此時(shí)用戶點(diǎn)擊昵稱填入。

微信昵稱獲取

用戶也可以自行填寫，當(dāng)然，本著后端不相信前端輸入的原則，然后后端邏輯攔截一下輸入的文字內(nèi)容，有敏感詞匯的，做攔截提示處理。

用戶自定義的昵稱做名敏感詞攔截

獲取到頭像和昵稱后，因?yàn)槲⑿盘峁┑念^像是一個(gè)臨時(shí)路徑，不能作為微信頭像的永久路徑儲(chǔ)存。所以這里需要將頭像存入緩存，或者直接傳給后端存儲(chǔ)。我這里是前端緩存的同時(shí)，也傳給后端存儲(chǔ)了。

頭像昵稱獲取成功

利用文件上傳接口，傳給后端處理，去儲(chǔ)存或者做別的功能。

后端存儲(chǔ)

這樣，我們就可以愉快的接下一個(gè)項(xiàng)目了~

頭像昵稱獲取展示

你們又是怎么處理的呢，歡迎留言交流。下期見~