【Uniapp-Vue3】导入uni-id用户体系

news/2025/2/26 6:27:39

在uniapp官网的uniCloud中下载uni-id用户体系

或者直接进入加载,下载地址:uni-id-pages - DCloud 插件市场 

进入以后下载插件,打开HbuilderX

 选中项目,点击确定

点击跳过

点击合并

右键uniCloud文件夹下的database文件夹,点击“上传所有 DB Schema”

弹出两个弹窗,按下面的图进行勾选和确定

在manifest.json中打开微信小程序配置,配置微信小程序的AppID和勾选上传代码时自动压缩

我们在uniCloud下的uni-id用户体系下的云对象中找到引入云对象的代码,引入到App.vue中

再点击旁边的微信登录,将接口形式中的代码也引入到App.vue中

进行如下配置 

<script setup>
	import {onLaunch, onShow, onHide} from "@dcloudio/uni-app";
	
	// 引入云对象
	const uniIdCo = uniCloud.importObject('uni-id-co')
		
	onLaunch(()=>{
		console.log('App Launch');
		
		uni.login({
			success:login=>{
				uniIdCo.loginByWeixin({
					code:login.code
				}).then(res=>{
					console.log(res);
				})
			}
		})
	})
	
	onShow(()=>{
		console.log('App Show');
	})
	
	onHide(()=>{
		console.log('App Hide');
	})
</script>

<style lang="scss">
	@import "common/style/common_style.scss";
	@import "@/static/fonts/iconfont.css";
</style>

在uniCloud/cloudfunctions/common/uni-config-center中创建uni-id文件夹,再在下面创建config.json文件

在新建的config.json中粘贴如下代码

{
  "passwordSecret": [
    {
      "type": "hmac-sha256",
      "version": 1
    }
  ], 
  "passwordStrength": "medium", 
  "tokenSecret": "", 
  "requestAuthSecret": "", 
  "tokenExpiresIn": 7200, 
  "tokenExpiresThreshold": 3600, 
  "maxTokenLength": 10, 
  "passwordErrorLimit": 6, 
  "passwordErrorRetryTime": 3600, 
  "autoSetInviteCode": false, 
  "forceInviteCode": false, 
  "idCardCertifyLimit": 1, 
  "realNameCertifyLimit": 5, 
  "sensitiveInfoEncryptSecret": "", 
  "frvNeedAlivePhoto": false, 
  "userRegisterDefaultRole": [], 
  "app": { 
    "tokenExpiresIn": 2592000,
    "tokenExpiresThreshold": 864000,
    "oauth": {
      
      "weixin": {
        "appid": "",
        "appsecret": ""
      },
      
      "qq": {
        "appid": "",
        "appsecret": ""
      },
      "apple": { 
        "bundleId": ""
      },
      "huawei": { 
        "clientId": "",
        "clientSecret": ""
      }
    }
  },
  "web": { 
    "tokenExpiresIn": 7200,
    "tokenExpiresThreshold": 3600,
    "oauth": {
      "weixin-h5": { 
        "appid": "",
        "appsecret": ""
      },
      "weixin-web": { 
        "appid": "",
        "appsecret": ""
      }
    }
  },
  "mp-weixin": {
    "tokenExpiresIn": 259200,
    "tokenExpiresThreshold": 86400,
    "oauth": {
      
      "weixin": {
        "appid": "",
        "appsecret": ""
      }
    }
  },
  "mp-qq": {
    "tokenExpiresIn": 259200,
    "tokenExpiresThreshold": 86400,
    "oauth": {
      
      "qq": {
        "appid": "",
        "appsecret": ""
      }
    }
  },
  "mp-alipay": {
    "tokenExpiresIn": 259200,
    "tokenExpiresThreshold": 86400,
    "oauth": {
      
      "alipay": {
        "appid": "",
        "privateKey": "", 
        "keyType": "PKCS8" 
      }
    }
  },
  "mp-harmony": {
      "oauth": {
        "huawei": { 
          "clientId": "",
          "clientSecret": ""
        }
      }
  },
  "service": {
    "sms": {
      "name": "", 
      "codeExpiresIn": 180, 
      "scene": {
        "bind-mobile-by-sms": { 
          "templateId": "", 
          "codeExpiresIn": 240 
        }
      }
    },
    "univerify": {
      "appid": "" 
    }
  }
}

如果是在官网上进行的代码粘贴,就会有注释,会报下面这个错误,这时候需要删除注释 

 

Ctrl+F,点击 .* ,在里面输入 //.* ,点击替换区,然后点击全部替换,所有的注释都会被替换成空 


http://www.niftyadmin.cn/n/5868204.html

相关文章

React进阶之React核心源码解析(三)

React核心源码解析 diff多节点比较diff两轮遍历比较第一轮比较第二轮比较Update 状态更新Concurrent Modediff 多节点比较diff isArray方法比较 节点更新// 更新前 <ul><li key="0" className="before">0<li><li key=

【二值图像与手动/自动阈值的详解】

二值图像与手动/自动阈值的详解 目录 二值图像与手动/自动阈值的详解一. 什么是二值图像&#xff1f;二. 二值图像的特点三. 二值图像的生成四.二值图像中的阈值作用及使用方法1. 阈值的概念2. 阈值的作用3. 阈值的类型4. 阈值的选择方法4. 阈值的使用方法5. 阈值的选择对结果的…

在股市交易的强化学习中寻找最佳交易历史

“Finding Optimal Trading History in Reinforcement Learning for Stock Market Trading” 论文地址&#xff1a;https://arxiv.org/pdf/2502.12537 摘要 本文探讨了在金融深度强化学习模型中优化时间窗口的方法&#xff0c;并采用了二维卷积神经网络&#xff08;CNN&#x…

MATLAB学习之旅:图像处理与计算机视觉应用

在前面的学习中&#xff0c;我们已经深入了解了MATLAB在数据建模与仿真方面的强大功能。从基础的数据处理到复杂的模型构建与仿真分析&#xff0c;MATLAB为我们提供了丰富的工具和函数&#xff0c;帮助我们解决各种实际问题。如今&#xff0c;我们将迈向下一个充满挑战与创新的…

MediaToolkit:.NET 开发者的多媒体处理工具

在开发过程中处理音频和视频文件是许多应用程序的重要功能。MediaToolkit 是一个强大的库&#xff0c;帮助轻松处理这些多媒体文件。封装了 FFmpeg 的功能&#xff0c;使得复杂的任务变得简单。支持更多功能&#xff0c;如视频裁剪、缩略图提取和转码等。 安装 第一步&#x…

图像处理、数据挖掘、数据呈现

目录 图像处理方法 阈值分割 图像处理方法 图像平滑 图像锐化 图像增强 阈值分割 边缘检测 阈值分割 特征提取 提取边界 区域提取 主成分压缩 POI 多源数据 数据挖掘 多源数据提取 关联度提取 位置集群&#xff0c; 新闻事件&#xff0c; 权限 个人喜好 历史…

Webpack打包过程中如何处理ES6模块的循环依赖?

在 Webpack 打包过程中&#xff0c;ES6 模块的循环依赖问题是一个常见的挑战。循环依赖指的是两个或多个模块相互引用&#xff0c;从而形成一个闭环。在处理循环依赖时&#xff0c;Webpack 采取了一些策略来确保模块能够正确加载。 1. 循环依赖的概念 假设有两个模块 A 和 B&…

B2B订货系统在提升订单处理效率与准确性上,有哪些关键流程与机制?

随着全球电子商务的蓬勃发展&#xff0c;B2B&#xff08;企业对企业&#xff09;电子商务成为了促进产业链协同、提高运营效率的重要手段。而B2B订货系统作为企业之间交易的核心平台&#xff0c;已经成为优化订单处理、提升效率与准确性的重要工具。在B2B交易中&#xff0c;及时…