基于vue2的uniapp 微信一键登录,获取手机号

项目场景:

基于vue2的uniapp商城项目中的微信一键登录功能
(后台是node.js写的)
目前文档中该接口针对非个人开发者,所以只能用文档中提供的测试号实现一下功能。
在这里插入图片描述
在这里插入图片描述


问题描述

我在实现微信一键登录的时候,获取手机号总是失败。


原因分析:

我浏览的是微信小程序的文档微信小程序开发文档
实现获取手机号需要前后台配合,我自己失败的问题就是,我自己node没学好,不知道在node中发请求也可以用axios。


无拆解

(1)前台代码

login.vue页面中

<template>
	<view class="box">
	//button组件
		<button  open-type="getPhoneNumber" @getphonenumber="getphonenumber">微信用户一键登录</button>
	</view>
</template>

<script>
import {
    mapActions } from 'vuex';
export default {
   
	methods: {
   
		// 微信登录
		getphonenumber(e) {
   
			let _this = this;
			// console.log('e', e);
			
			//  1.发请求
			uni.request({
   
				url: 'http://localhost:3000/api/getNewPhone',//这个地址是你自己的
				method: 'POST',
				data: {
   
					code: e.detail.code
				},
				success(res) {
   
					console.log('res', res);
				
				
				// 2.请求成功后
				
					//从后台获取到手机号后,调用登录接口,实现登录,并将数据存储在本地中,跳转到首页 
					_this.action_smslogin({
    phone: res.data.phoneNumber }).then(val => {
   
						uni.setStorageSync('user', val);
						uni.switchTab({
   
							url: '/pages/index/index'
						});
					});
				}
			
  • 1
    点赞
  • 10
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值