前端使用uniapp來開發(fā)微信小程序

后端springboot中使用WxJava來做服務端（WxJava是微信服務端開發(fā) 的Java SDK）

一、微信小程序登陸流程圖

該圖來源于微信小程序官方文檔

二、前端代碼

根據uniapp的官網直接通過它提供的第三方 登陸api直接使用，代碼如下

<script setup>
import { onMounted, ref } from "vue";
let nickName = ref('');
let avatarUrl = ref('');
onMounted(()=>{
	getLogin();
});
const getLogin = ()=>{
	uni.login({
	  provider: 'weixin',
	  success: function (loginRes) {
		console.log(loginRes);
		let code = loginRes.code;
		// 獲取用戶信息
		uni.getUserInfo({
		  provider: 'weixin',
		  success: function (infoRes) {
			console.log(infoRes); 
			nickName.value = infoRes.userInfo.nickName;
			avatarUrl.value = infoRes.userInfo.avatarUrl;
			let param = {
				code: code,       //登陸憑證
				encryptedData: infoRes.encryptedData,  //包括敏感數據在內的完整用戶信息的加密數據 
				iv: infoRes.iv,   //加密算法的初始向量，詳細見加密數據解密算法
				appId: uni.getAccountInfoSync().miniProgram.appId //小程序的appId
			}
			//提交給服務端
			uni.request({
			    url: 'http://10.72.144.42:8080/wx/auth/login_wx', //僅為示例，并非真實接口地址。
			    method: 'post',
				data: param,
			    header: {
			        // 'custom-header': 'hello' //自定義請求頭信息
			    },
			    success: (res) => {
					console.log("提交數據",res);
			    }
			});
		  }
		});
	  }
	});
};
</script>

三、java服務端代碼

直接根據WxJava的官方demo

（1） yml配置

#使用weixin-java-miniapp java微信小程序封裝的sdk
wx:
  miniapp:
    configs:
        - appid: 1111111111 #微信小程序的appid
          secret: 2222222222 #微信小程序的Secret(登陸憑證)
          token: #微信小程序消息服務器配置的token
          aesKey: #微信小程序消息服務器配置的EncodingAESKey
          msgDataFormat: JSON

（2）兩個配置文件

public class WxMaProperties {
    private List<Config> configs;
    @Data
    public static class Config{
        /**
         * 設置微信小程序的appid
         */
        private String appid;

        /**
         * 設置微信小程序的Secret
         */
        private String secret;

        /**
         * 設置微信小程序消息服務器配置的token
         */
        private String token;

        /**
         * 設置微信小程序消息服務器配置的EncodingAESKey
         */
        private String aesKey;

        /**
         * 消息格式，XML或者JSON
         */
        private String msgDataFormat;
    }
}

public class WxMaConfiguration {
    private final WxMaProperties properties;

    //有參構造
    @Autowired
    public WxMaConfiguration(WxMaProperties properties) {
        this.properties = properties;
    }


    @Bean
    public WxMaService wxMaService() {
        List<WxMaProperties.Config> configs = this.properties.getConfigs();
        if (configs == null) {
            throw new WxRuntimeException("大哥，拜托先看下項目首頁的說明（readme文件），添加下相關配置，注意別配錯了！");
        }
        WxMaService maService = new WxMaServiceImpl();
        maService.setMultiConfigs(
                configs.stream()
                        .map(a -> {
                            WxMaDefaultConfigImpl config = new WxMaDefaultConfigImpl();
//                WxMaDefaultConfigImpl config = new WxMaRedisConfigImpl(new JedisPool());
                            // 使用上面的配置時，需要同時引入jedis-lock的依賴，否則會報類無法找到的異常
                            config.setAppid(a.getAppid());
                            config.setSecret(a.getSecret());
                            config.setToken(a.getToken());
                            config.setAesKey(a.getAesKey());
                            config.setMsgDataFormat(a.getMsgDataFormat());
                            return config;
                        }).collect(Collectors.toMap(WxMaDefaultConfigImpl::getAppid, a -> a, (o, n) -> o)));
        return maService;
    }
}

(3)controller接口代碼文章來源地址http://www.zghlxwxcb.cn/news/detail-613714.html

  @PostMapping("/wx/auth/login_wx")
    public Map getLogin(@RequestBody JSONObject params){
        //得到數據參數
        String code = params.getString("code");
        String encryptedData = params.getString("encryptedData");
        String iv = params.getString("iv");
        String appId = params.getString("appId");

        if (!wxMaService.switchover(appId)) {
            throw new IllegalArgumentException(String.format("未找到對應appid=[%s]的配置，請核實！", appId));
        }
        WxMaJscode2SessionResult session = null;
        WxMaUserInfo wxMaUserInfo = null;
        try {
            //這一行代碼就完成了 與微信開放服務端，要回session
            session = wxMaService.getUserService().getSessionInfo(code);
            log.info(session.getSessionKey());
            log.info(session.getOpenid());

            //session_key是對用戶數據解密出全部用戶數據
            wxMaUserInfo = wxMaService.getUserService().getUserInfo(session.getSessionKey(),encryptedData,iv);
            log.info(wxMaUserInfo.getNickName());
            log.info(wxMaUserInfo.getAvatarUrl());
            //添加自己的邏輯，關聯(lián)業(yè)務相關數據

        } catch (WxErrorException e) {
            e.printStackTrace();
        }

        Map map = new HashMap();
        return map;
    }

到了這里，關于springboot使用 WxJava 實現(xiàn) 微信小程序(uniapp開發(fā))的登陸功能的文章就介紹完了。如果您還想了解更多內容，請在右上角搜索TOY模板網以前的文章或繼續(xù)瀏覽下面的相關文章，希望大家以后多多支持TOY模板網！