NO.4--- 微信小程序登录界面学习记录(扫码模式)
上篇记录了游客模式登录微信开发者工具后各版块的一些功能。此篇记录一下用扫码模式登录微信开发者工具的情况。
一、扫码登录
1.1、启动微信开发者软件,手机微信扫登录框的二维码

1.2、登录成功后的界面

二、扫码登录和游客模式登录的对比
2.1、扫码登录和游客模式登录后的项目界面对比
扫码登录和游客模式登录后的项目界面基本一致,由于登录方式不同,左下角的图标会有所不同。游客模式没有具体的图标,而扫码登录因为关联了微信,所以开发者工具左下角的图标是用户的微信头像。


2.2、小程序版块
2.2.1、创建小程序

2.2.2、扫码模式和游客模式创建小程序的对比


从配置项来看,扫码模式和游客模式创建小程序有所不同。扫码模式创建小程序的配置项有:项目名称、目录、AppID、开发模式、后端服务、模板选择。游客模式创建小程序的配置项有:项目名称,目录,AppID,开发模式,后端服务,语言。
以扫码模式为主体进行对比:
(一)、项目名称:字面意思(游客模式一样)
(二)、目录:项目保存的路径(游客模式一样)
(三)、AppID:小程序的唯一标识,不同的AppID具有不同的身份、权限和使用场景。AppID 具有以下作用:
-
1、鉴权和身份认证:通过AppID,微信可以对小程序进行身份认证,确保小程序的合法性和安全性。
-
2、接口调用权限管理:小程序在使用微信开放平台提供的API时,需要使用AppID来进行接口调用权限的管理,确保只有具备权限的小程序可以调用相关接口。
-
3、数据统计和分析:通过AppID,微信可以对每个小程序的数据进行统计和分析,包括用户访问量、使用时长等指标,为开发者提供数据支持和运营分析。
-
4、微信支付:如果小程序需要使用微信支付功能,就需要在小程序中绑定与该AppID对应的商户号,才能实现支付功能。
-
5、小程序发布和管理:每个小程序在发布时都需要有独特的AppID,通过AppID可以对小程序进行发布、版本控制和管理。
AppID是微信小程序的重要标识和权限管理的凭证,对于小程序的开发、发布、调用接口和数据分析都具有重要作用。
扫码模式的 AppID 项和 游客模式的 AppID 项有所不同。游客模式的 AppID 自动匹配为 touristappid。扫码模式的 AppID 不会自动匹配,而是有 “注册” 或使用 “测试号”。

注册:顾名思义就是注册一个属于自己的 AppID。点击 “注册” 浏览器会打开注册页面,按照流程一步一步填写信息,完成注册即可。


测试号:官方给出了测试号的一些相关信息,我们只需要点击一下后面的 ? 号就可以打开官方网站进行查阅了解。打开页面后有测试号的用途、申请方式、登陆方式、以及使用测试号开发的一些信息。申请测试号的流程也很简单,按照官网上的申请流程完成即可。

在前篇 游客模式 中也谈及过 AppID 的权限问题。正式账号和测试号也有对应的权限和用途。
-
1、所属身份不同:注册的正式AppID是商业身份,用于正式发布和运营小程序。测试的AppID是用于开发者在开发、测试环境中使用的临时身份。
-
2、权限和功能不同:注册的正式AppID具有完整的功能和权限,可以进行上传、发布、接口调用等操作。测试的AppID则可以在限定的测试环境中进行开发、调试和测试,享有一些特殊的测试权限,没有上传功能。
-
3、使用场景不同:正式的AppID适用于商业发布和运营阶段,包括绑定商户号、进行支付等功能。测试的AppID适用于开发者进行临时的测试和调试,不会对正式环境造成影响。
-
4、开发流程不同:在开发过程中,注册的正式AppID需要经过微信官方的审核流程,才能发布到正式环境。测试的AppID则可以在开发者工具中选择测试环境进行开发和调试。
以上是对不同模式下 AppID 的一些个人见解。
(四)、 开发模式:扫码模式和游客模式一样,都有小程序和插件可选。默认小程序。

选择 “插件” 和游客模式一样,会有宿主 AppID 和 插件 AppID 项。不同的是游客模式 AppID 均为 touristappid。而扫码模式就是注册的 AppID 或 测试号的 AppID。扫码模式 和 游客模式在开发模式选择了 “插件”,后端服务只能选择 “不使用云服务”。

(五)、后端服务:扫码模式的后端服务可以有两种选项,分别是 “微信云开发” 和 “不使用云服务”。游客模式只能选择 “不使用云服务”,微信云开发不可选。

关于 “微信云开发” 官方也给出了相关的资料,可以点击 “详情” 查阅学习云开发的资料。


“不使用云服务” 和游客模式一样,本地开发。
(六)、模板选择:字面意思,就是常规应用场景所预设的框架。游客模式没有模板选择,只有 “语言” 选择。


后端服务选择 “微信云开发” 和 “不使用云服务” 会关联到不同的模板选择。


从 “不使用云服务” 项来说,扫码模式比游客模式多了一个 TS-Skyline 语言。


模板选择从来源和分类可有不同的细分。


从小程序创建来对比,暂时发现扫码模式和游客模式的不同之处有 AppID、后端服务、模板选择这几项。扫码模式创建小程序时提供的模板选择比游客模式更能丰富于快捷开发。
2.3、小游戏版块
2.3.1、创建小游戏

2.3.2、扫码模式和游客模式创建小程序的对比


从配置项来看,扫码模式和游客模式创建小游戏有所不同。扫码模式创建小游戏的配置项有:项目名称、目录、AppID、后端服务、模板选择。游客模式创建小游戏的配置项有:项目名称,目录,AppID,后端服务。
以扫码模式为主体进行对比:
(一)、项目名称:字面意思(游客模式一样)
(二)、目录:项目保存的路径(游客模式一样)
(三)、AppID:小程序的唯一标识,和创建小程序一样,游客模式的 AppID 自动匹配为 touristappid。扫码模式下提供 “注册” 和 “测试号” 两种获取方式。两者分别代表着不同的应用场景、功能 和 权限。关于 AppID 的功能与用途之前也有浅析过,可参考以上的 AppID 描述。
(四)、后端服务:扫码模式的后端服务像小程序一样可以有两种选项,分别是 “微信云开发” 和 “不使用云服务”。游客模式只能选择 “不使用云服务”,微信云开发不可选。与创建小程序的后端服务一样,可参考以上创建小程序后端服务的描述。
(五)、模板选择:扫码模式创建小游戏像小程序有模板选择,游客模式创建小游戏没有模板选项。

扫码模式下创建小游戏和创建小程序的模板选择有两点不一样:
- 1、小游戏的模板没有来源和类别划分,只有小游戏和小游戏框架两个单选框可选(选择小游戏或小游戏框架,可供选择的模板都是一样,不会有什么变化)。小程序有来源和类别的下拉式菜单选项。



- 2、小游戏的后端服务选择 “微信云开发” 和 “不使用云服务” 不会关联到不同的模板选择。小程序的后端服务选择 “微信云开发” 和 “不使用云服务” 会关联到模板选择,可选模板会有所变化。




从小游戏创建来对比,暂时发现扫码模式和游客模式的不同之处有 AppID、后端服务、模板选择这几项。扫码模式创建小游戏时提供的模板选择比游客模式更能丰富于快捷开发。
2.4、代码片段版块
2.4.1、创建代码片段,在创建界面和游客模式一样有关于代码片段的介绍,也可以通过 “了解详情” 来学习一下官方文档。

2.4.2、扫码模式和游客模式创建代码片段的对比


从配置项来看,扫码模式和游客模式创建代码片段都一样,不同之处是 AppID。扫码模式需要用到注册或测试号的 AppID,而游客模式的 AppID 则自动配置了 touristappid。
扫码模式和游客模式创建代码片段的开发模式均为一样,有小程序、小游戏框架和插件。

从代码片段来对比,暂时发现扫码模式和游客模式的不同之处有 AppID,其他项都一样。
2.5、公众号网页项目版块
2.5.1、扫码模式的公众号网页项目和游客模式的一样,点击公众号网页一栏会直接开启一个调试窗体的界面。点击左上角有一个 “云开发” 的按钮,弹出 “进入云开发控制台” 并要求填入公众号 AppID。


关于公众号网页项目的一些理解在上篇学习文档中有记录,可以从上篇文档中的公众号网页项目章节中查阅。
2.6、其他版块
2.6.1、创建其他,点击 + 号进入创建其他项目界面。出现 “目录” 和 “项目名称”。“目录”指保存路径,项目名称顾名思义就是项目的取名。


扫码模式下创建 “其他” 的操作流程和游客模式一样,可以从上篇文档中的 章节中了解到相关信息。
2.7、注销
2.7.1、注销功能和游客模式一样,用于退出用户账号之用。

2.8、导入和管理
2.7.1、扫码模式的导入和管理功能和游客模式的一样,除了 “公众号网页项目” 这一版块,“小程序”、“小游戏”、“代码片段” 和 “其他” 版块都有导入和管理功能。

2.7.2、导入和管理功能就是对已有项目的快捷方式进行管理。导入和管理
实质上是对项目快捷的删除和导入。操作对象仅是快捷方式,并不会对已储存到硬盘的项目文件造成干扰。
2.7.3、举一例子,上篇文档中我们用游客模式在 “其他” 这一版块中创建了一个 other-1 的项目。现在通过扫码模式进入到 “其他” 这一版块。我们也可以通过导入功能把 other-1 项目导入进来。
- 1、点击 “导入”。

- 2、找到项目 --》选择文件夹。

- 3、确认无误,点击 “确定”。

- 4、other-1 项目成功打开。

- 5、关闭主窗体,返回到 “其他” 版块,这是会发现多了一个 other-1 项目的快捷方式。

- 6、此时,我们通过管理把 other-1 快捷方式删除掉,点击 “管理”。

- 7、单选项目,再删除。

- 8、弹出提示窗,说明内容 “只删除记录,不删除硬盘上的项目文件”。按 “确定”。

- 9、“其他” 版块中的 other-1 项目快捷方式已经被删除。

- 10、回到硬盘看看 other-1,项目文件不会受影响。

本文档就扫码模式登录和游客模式登录作了一番对比,对于小程序的开发学习一般上注册一个 AppID 或 测试号较好,能接触到的功能更为完善。