微信公众号非静默授权获取头像和昵称

要在Vue前端应用程序中实现微信公众号非静默授权获取头像和昵称，您需要遵循以下步骤：

1.在微信公众平台上注册并创建一个公众号。

2.在Vue项目中安装wechat-js-sdk库，该库提供了与微信JS-SDK的交互功能。

npm install wechat-js-sdk --save

3.在Vue项目中引入并初始化WeChat JS SDK。 

import wx from 'wechat-js-sdk';wx.config({debug: true,appId: 'your_app_id',timestamp: 'your_timestamp',nonceStr: 'your_noncestr',signature: 'your_signature',jsApiList: ['chooseWXPay', 'onMenuShareTimeline', 'onMenuShareAppMessage']
});

请注意，这里需要将 your_app_id，your_timestamp，your_noncestr 和 your_signature 替换为您的应用程序ID，时间戳，随机字符串和签名。

4.在Vue组件中添加授权代码。

wx.ready(function () {wx.getUserInfo({withCredentials: true,success: function (res) {var userInfo = res.userInfo;var nickname = userInfo.nickName;var headimgurl = userInfo.headImgUrl;console.log('getUserInfo', userInfo);}});
});

此代码中的 wx.ready 函数将在WeChat JS SDK准备好后运行。 wx.getUserInfo 函数获取用户信息，包括昵称和头像。 请注意，使用此方法需要设置 withCredentials 参数为true。

请注意，您需要将 your_app_id 替换为您的应用程序ID。

这样，您就可以在Vue前端应用程序中实现微信公众号非静默授权获取头像和昵称了。