uniapp 之 开发微信小程序入门详细指南

news2024/11/21 2:31:02

目录

    • 配置运行设置(编辑器的设置)
    • 项目目录文件配置
      • 基础配置中的uniapp应用标识(AppID)
      • 配置微信小程序的AppID
    • 总结

配置运行设置(编辑器的设置)

  1. 点击编辑器上方菜单栏 - 运行 - 运行到小程序模拟器 - 运行设置
    在这里插入图片描述
  2. 配置各个小程序的开发者工具(如:微信开发者工具、抖音开发者工具)
    在这里插入图片描述
    这个没什么说的,就是将你开发者工具的安装路径放上去,也可以通过后面的浏览选择各自的安装路径,因为我这边只是安装了两个开发者工具,其他不多说,说明一点:

抖音开发者工具需要注意的一点是选择安装包的时候需要注意自己的电脑是win10的还是win11的。

在这里插入图片描述



项目目录文件配置

这里的项目目录文件配置我们主要说的是项目根目录下的manifest.json,其他的配置就不多说,这里只说一下微信小程序的。

另外这里着重说明的是两个AppID,一个是uniapp的,一个是微信小程序的,不要弄反了

基础配置中的uniapp应用标识(AppID)

  • 如果这个项目是你创建的,那么这个项目的AppID会出现在你的dcloud后台系统中的应用列表,如下:应用名称(也就是你创建的项目目录名称),我的角色(是你创建的你就是所有者)
    在这里插入图片描述

  • 如果这个项目不是你创建的,但是你需要打包发布的话,那么你需要找到这个项目的创建者,然后让他把你邀请进这个项目,也就是项目成员。
    在这里插入图片描述

  • 如何邀请项目成员

    • 点击这个应用列表的应用名称,进入应用信息
      在这里插入图片描述

    • 点击成员管理 - 邀请项目成员

      需要注意的是,这边邀请的项目成员的邮箱是要在dcloud 注册过的,并且邮箱可用,能够接收到邀请链接邮件。
      且,注意角色选择(普通成员、管理员的区分)

      在这里插入图片描述
      邀请了之后等待目标邮箱账号同意即可。
      之后你需要确定manifest.json基础配置里的uniapp AppID是不是和dcloud 应用列表该项目的AppID一致,如不一致,改成一致即可(可直接在源码视图manifest.json修改)
      在这里插入图片描述
      然后你就可以对该项目进行打包发布了。

配置微信小程序的AppID

  • 首先自己开发的话调试的话,可以使用自己小程序测试号,如果不是用自己的测试号,但是微信开发者工具又是登录的自己的微信的话,就会出现下面的提示:
    在这里插入图片描述
    换了自己的测试号,就正常了。

  • 然后到了调试接口的话,如登录,后续的业务接口也是一样,因为正常来说,都是登录了获取到业务token,调业务接口的时候把token放在头部请求的,所以来说,本质是一样的,就不纠结什么接口的问题了。
    调试接口的话,就以登录接口来说吧。
    一般来说,后端那边写的登录接口也会把正式申请的AppID写上来做匹配,所以我们在调接口的时候也是要用正式申请的AppID,为什么要用一样的正式申请的AppID???

因为在调登录接口的时候,一般是是先获取到code,然后用code作为后端登录接口请求的参数,这个时候,后端就会返回业务接口头部需要的token。
这里是使用微信小程序官方示例图:

在这里插入图片描述

需要注意的是:这个code时效只有一次,也就是说,获取到的code 只能使用一次。

如果用的不一样的微信小程序AppID的话,调用后端登录接口就会失败,提示:
在这里插入图片描述
然后这里换成一样的AppID后,还有一个关键点
需要该AppID的所有者把微信开发者登录的微信号,邀请至开发者,不然还是一样的会报上述截图的错误信息。

微信小程序如何邀请开发者?
登录微信公众平台 - 扫码登录 - 选择对应的小程序项目 - 登录成功后点击管理 - 选择成员管理 - 项目成员 - 点击编辑 - 添加成员 - 输入微信号 - 分配开发者权限 - 确认添加
在这里插入图片描述
在这里插入图片描述

在这里插入图片描述

调用代码示例:

uni.login({
    provider: 'weixin', //使用微信登录
    success: async (loginRes) => {
        console.log(loginRes.code)
        // 获取到临时code
        const code = loginRes.code
        showLoading()
        // httpPost是自己基于uni.request封装的请求方法
        const res = await httpPost('/api/wechat/login', { code })
        hideLoading()
        console.log('login---res:', res)
        const { access_token } = res.data
        // 将后端返回的token缓存到本地
        setStorage('token', access_token)
    }
})

最后,就是进入到正常的业务开发阶段了。

总结

1、HbuilderX打包需要邀请项目成员,是该项目下的成员方可打包发布;

2、开发阶段,不涉及接口可以使用自己申请的临时测试号进行开发;

3、开发阶段,调接口的话需要使用一致的正式申请的AppID,且开发人员(这里实质是登录微信开发者的微信号)是该小程序下的开发者角色。

完结。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/1628807.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

selenium 自动化测试课上实操指南1——百度搜索

1.环境准备 下面的所有资源可以从超星班级资料中下载,机房的同学在收到的文件夹中可以找到文件 非本校同学,免费加入学银在线课程,就可以在资料 根目录 > 02 课件新 > week09 web自动化测试02 里下载本次实操资料 1)安…

3分钟入门Java多线程

如何在程序中创建出多条线程&#xff1f; 继承Thread类 public class MyThread extends Thread {Overridepublic void run() {for (int i 0; i < 10; i) {System.out.println("MyThread运行了" i);}} }实现Runnable接口 public class MyRunnable implements …

[Qt的学习日常]--信号和槽

前言 作者&#xff1a;小蜗牛向前冲 名言&#xff1a;我可以接受失败&#xff0c;但我不能接受放弃 如果觉的博主的文章还不错的话&#xff0c;还请点赞&#xff0c;收藏&#xff0c;关注&#x1f440;支持博主。如果发现有问题的地方欢迎❀大家在评论区指正 本期学习&#xff…

【Qt 学习笔记】Qt常用控件 | 输入类控件 | Spin Box的使用及说明

博客主页&#xff1a;Duck Bro 博客主页系列专栏&#xff1a;Qt 专栏关注博主&#xff0c;后期持续更新系列文章如果有错误感谢请大家批评指出&#xff0c;及时修改感谢大家点赞&#x1f44d;收藏⭐评论✍ Qt常用控件 | 输入类控件 | Spin Box的使用及说明 文章编号&#xff1…

MySQL__索引

文章目录 &#x1f60a; 作者&#xff1a;Lion J &#x1f496; 主页&#xff1a; https://blog.csdn.net/weixin_69252724 &#x1f389; 主题&#xff1a; MySQL__索引&#xff09; ⏱️ 创作时间&#xff1a;2024年04月23日 ———————————————— 这里写目…

Arcpy入门笔记(三):数据属性的读取

Arcpy入门笔记&#xff08;三&#xff09;&#xff1a;数据属性的获取 文章目录 Arcpy入门笔记&#xff08;三&#xff09;&#xff1a;数据属性的获取常用的属性Describe对象属性&#xff08;部分&#xff09;数据集属性&#xff08;部分&#xff09;表属性&#xff08;部分&a…

[c++]菱形继承解析

菱形继承 大概示意图&#xff1a; 菱形继承不一定只是标准的菱形&#xff0c;只要形似菱形的都可以叫菱形继承。 (以下说明都是默认公有继承&#xff0c;public和protected成员情况下) 菱形继承会造成数据的冗余和二义性&#xff1a; 冗余&#xff1a;一个Assitant对象里面有…

可解决传统保险丝缺陷的电子保险丝efuse

近年来&#xff0c;电子保险丝&#xff0f;熔断器获得了越来越多的关注&#xff0c;业界对此类解决方案的需求也在不断增加。传统的玻璃管保险丝、片式保险丝和聚合物保险丝很容易受到环境温度和其他使用条件的影响&#xff0c;而且熔断电流的精确度较低。此外&#xff0c;响应…

万兆以太网MAC设计(6)IP协议报文格式详解以及IP层模块设计

文章目录 前言&#xff1a;IPv4报文协议格式二、IP_RX模块设计2.1、模块接口2.2、模块工作过程 三、IP_TX模块设计3.1、模块接口3.2、模块工作过程 四、仿真4.1、发送端4.2、接受端 前言&#xff1a;IPv4报文协议格式 参考&#xff1a;https://sunyunqiang.com/blog/ipv4_prot…

SpringBoot学习之SpringBoot3集成OpenApi(三十八)

Springboot升级到Springboot3以后,就彻底放弃了对之前swagger的支持,转而重新支持最新的OpenApi,今天我们通过一个实例初步看看OpenApi和Swagger之间的区别. 一、POM依赖 我的POM文件如下,仅作参考: <?xml version="1.0" encoding="UTF-8"?>…

【C++】初识C++(下)

&#x1f451;个人主页&#xff1a;啊Q闻 &#x1f387;收录专栏&#xff1a;《C》 &#x1f389;我自会去见我的山 &#x1f4a1;感谢阅读&#xff0c;欢迎关注&#xff0c;点赞&#xff0c;收藏&#xff0c;评论&#x1f4a1; 前言 这篇博客是对C的一个初…

JavaEE——Spring Boot入门

目录 &#x1f4da; JavaEE——Spring Boot入门 &#x1f527; 1. 新建Spring Boot项目 &#x1f6e0; 2. 添加pom依赖 &#x1f4dd; 3. 添加application.yml文件 &#x1f4c2; 4. 创建Dao层 &#x1f527; 5. 创建Service层 &#x1f5a5;️ 6. 创建Controller层及HT…

【刷题篇】动态规划-01背包问题(十)

文章目录 1、01背包2、分割等和子集3、目标和4、最后一块石头的重量 II 1、01背包 #include <iostream> #include<vector> using namespace std;int main() {int n,v;cin>>n>>v;vector<int> Weight(n1);vector<int> Value(n1);vector<i…

注意力机制:SENet详解

SENet&#xff08;Squeeze-and-Excitation Networks&#xff09;是2017年提出的一种经典的通道注意力机制&#xff0c;这种注意力可以让网络更加专注于一些重要的featuremap&#xff0c;它通过对特征通道间的相关性进行建模&#xff0c;把重要的特征图进行强化来提升模型的性能…

Mysql的索引与事务理解

目录 一、Mysql索引 1、索引的概念 2、索引的特点 3、索引使用场景 4、Mysql有关索引的操作 &#xff08;1&#xff09;查询表具有的索引 &#xff08;2&#xff09;增加索引 &#xff08;3&#xff09;删除索引 5、索引实现原理 &#xff08;1&#xff09;B树 &…

详细解析什么是期权交易的获利方法

期权交易的获利方法 在期权交易之前进行充分的准备工作和风险评估是至关重要的。其中行情结构、策略方法、预期收益和风险评估&#xff0c;是期权交易成功的关键要素。它们能帮助我们更好地制定交易计划&#xff0c;控制风险&#xff0c;并追求稳定的利润。以下是对这四点的详…

深入理解冯诺依曼体系结构

文章目录 冯诺依曼体系结构概念冯诺依曼体系结构的优势冯诺依曼体系结构的现实体现 冯诺依曼体系结构概念 冯诺依曼体系结构也称普林斯顿结构&#xff0c;是现代计算机发展的基础。它的主要特点是“程序存储&#xff0c;共享数据&#xff0c;顺序执行”&#xff0c;即程序指令和…

Leetcode297_二叉树的序列化与反序列化

1.leetcode原题链接&#xff1a;. - 力扣&#xff08;LeetCode&#xff09; 2.题目描述 序列化是将一个数据结构或者对象转换为连续的比特位的操作&#xff0c;进而可以将转换后的数据存储在一个文件或者内存中&#xff0c;同时也可以通过网络传输到另一个计算机环境&#xf…

Python | Leetcode Python题解之第51题N皇后

题目&#xff1a; 题解&#xff1a; class Solution:def solveNQueens(self, n: int) -> List[List[str]]:def generateBoard():board list()for i in range(n):row[queens[i]] "Q"board.append("".join(row))row[queens[i]] "."return b…

浅谈叉车车载电脑的市场现状

叉车的起源 叉车源于美国&#xff0c;兴于日本&#xff0c;虽然中国起步较晚&#xff0c;但是近些年来发展迅速。叉车又称叉式装载车&#xff0c;是对于成件托盘类货物进行装卸、堆垛和短距离运输&#xff0c;实现重物搬运作业的轮式工业车辆。 叉车的分类 叉车分为以上六大类…