微信小程序开发从零到壹(持续更新)

1、注册或者登录到微信小程序;

小程序

补充小程序的基本信息,如名称、图标、描述等

补充小程序的服务类目,设置主营类目

AppID(小程序ID): wx710efeb42778d131

AppSecret(小程序密钥): d12a7e2b135593f6fxxxxbe35666

2、开发者工具;

下载开发者工具进行代码的开发和上传

打开微信开发者工具,

可以选择商场模版或者使用空白模版创建小程序文件夹;

代码进行自定义之后, 在开发者工具的右上角选择上传。

添加开发者,进行代码上传。

开发设置页面查看AppID和AppSecret,配置服务器域名,或使用微信云开发微信云托管,免配置服务器。

可以阅读入门介绍(普通小程序|小游戏)、开发文档(普通小程序|小游戏)、设计规范运营规范

3、选择模版;

选择相对应的模版快速创建小程序, 然后修改之后进行上传;

点击版本管理可以查看上传记录;

4、版本管理;

先提交代码,然后提交审核,审核通过后可发布。

5、小程序登录;

第一步: 使用wx.login 获取code。

第二步: 获取头像、昵称等使用 wx.getUserProfile 获取 iv 与 encryptedData;

第三步: 使用code、iv、encryptedData 作为参数请求服务器接口;

第四步: 服务器使用code和小程序的appid 和 secret 请求api.weixin.qq.com/sns/jscode2session 换取sessionKey和openid;

第五步: 使用appid 和seccionKey制作解密文, 再将iv、encryptedData解密得到用户基本信息;

let bizDataCrypt = new WXBizDataCrypt(appid, sessionKey)
const data = bizDataCrypt.decryptData(encryptedData, iv)

企业微信登录相关

选择企业微信小程序模式: 调用 wx.qy.login 获取code,

请求后端接口获取

接口地址:https://qyapi.weixin.qq.com/cgi-bin/miniprogram/jscode2session?access_token=ACCESS_TOKEN&js_code=CODE&grant_type=authorization_code
access_token 调用接口凭证(注意,此处的access_token 是企业微信应用的access_token,获取方法参见“获取access_token”。要求必须由该小程序关联的企业微信应用的secret获取
js_code	  登录时获取的 code
grant_type  此处固定为authorization_code
最终得到: 
 "corpid": "CORPID",  
 "userid": "USERID", 
 "session_key": "kJtdi6RF+Dv67QkbLlPGjw=="

获取access_token 

为了安全考虑,开发者 请勿 将 access_token 返回给前端,需要开发者保存在后台,所有访问企业微信api的请求由后台发起

请求方式: GETHTTPS
请求地址: https://qyapi.weixin.qq.com/cgi-bin/gettoken?corpid=ID&corpsecret=SECRET
需要企业ID 与 应用的凭证密钥

获取个人信息
https://qyapi.weixin.qq.com/cgi-bin/user/getuserinfo?access_token=ACCESS_TOKEN&code=CODE。
解析API返回的JSON数据,获取到用户的详细信息,包括姓名、头像、手机号码等。

需要注意的是,企业微信小程序只能获取到企业内部员工的个人信息,对于未在企业微信中注册的用户无法获取。

6、小程序开发细节

Q:主体信息是 上海翌擎智能科技有限公司, 关联到  上海吉驾 , 会不会有问题?

A: 走的服务商代开发模式,服务商是翌擎,小程序属于翌擎,翌擎帮吉驾开发小程序,关联翌擎帮吉驾代开发的企业应用。

wxml上给函数传参数:
<view bindtap="handleTap" data-id="123">点击我</view>
Page({
  handleTap: function(event) {
    var id = event.currentTarget.dataset.id;
    console.log('参数值为:', id);
  }
});

小程序路由跳转:
   wx.navigateTo({
      url: '/pages/delivery/feat/index'
    });

父组件调用子组件
调用时:   <to-json id='to_json'></to-json>
使用数据: const component = this.selectComponent("#to_json");
childF(){
	this.childEle.foo() // 调用方法
    const data = component.data; // 子组件的data
}

子组件调用父组件
传值
<childEle childParams="{{params}}"></childEle>
properties: {
	childParams: { type: String }
}
调用方法
<childEle childParams="{{params}}" bind:childFun="fun"></childEle>
clickFun(){
	this.triggerEvent('childFun');
}

Q: 微信小程序没有双向绑定,所以输入框增加输入事件

<input bindinput="onInput" value="{{ inputValue }}" />
// 在页面或组件的方法中定义事件处理函数
onInput(event) {
  const value = event.detail.value; // 获取输入框的值
  this.setData({
    inputValue: value, // 将输入框的值保存到页面或组件的 data 中
  });
}

Q: T_Design组件t-input绑定事件并且传参数。。(折腾半天)
 html:  <t-input bindchange="inputModel"  data-index="{{index}}" data-key="{{'carrierOrder'}}"  value="{{item.carrierOrder}}"/>
 js:     inputModel(e){
         const { index } = e.currentTarget.dataset;
         const { key } = e.currentTarget.dataset;
         this.data.carriers[index][key]= e.detail.value 
      },

Q: 文件上传报错解析异常!
微信小程序将本地文件转为临时路径: url: "http://tmp/ej9OO3rcqW7fa59be7ad13d5aafefae7f9b6c9c285f6.png"文件上传的几种形式: base64、本地文件流。 
最终确认为服务端的问题,但是如果不是自己反证法,服务端看都不会看。

Q:T-upload组件在微信小程序和电脑中可以正常上传图片,但是企业微信中无法完成调用!

A:组件使用的api不支持苹果手机, 支持所有机型的wx.chooseImage在基础库2.0.0上不再维护,但是仍旧可以使用,在组件中替换API成功解决问题。

Q: 小程序的ui库显示异常

A: 因为没有按照流程构建, 先是npm init, 再是npm i,下载好之后需要点击工具中的构建npm,这才是完整的流程。

Q:  wx.qy.login 在企业微信打开后却无法调用, 也没有任何报错? 

 在开发者工具中选择企业微信小程序模式后可以正常调用 wx.qy.login 请求, 但是在企业微信打开后却无法调用, 也没有任何报错? 获取用户信息需要选择相应的企业,在真机中调用  wx.qy.login  报错无效的 suiteId。 

暂未解决!

Q: 小程序如何区分环境

wx.getAccountInfoSync().miniProgram.envVersiondevelop  开发版 trial  体验版 release  正式版 小程序的体验版本 会调用 测试环境的业务接口 ,小程序的正式版本会调用 uat 环境的 业务接口

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

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

关于“Python”的核心知识点整理大全30

目录 12.2.3 在 OS X 系统中安装 Pygame 12.2.4 在 Windows 系统中安装 Pygame 12.3 开始游戏项目 12.3.1 创建 Pygame 窗口以及响应用户输入 首先&#xff0c;我们创建一个空的Pygame窗口。使用Pygame编写的游戏的基本结构如下&#xff1a; alien_invasion.py 12.3.2 设…

电子科大软件测试~第一次作业

第一次作业及参考答案 第一题 针对电子科技大学信息门户的“密码找回”界面的邮箱输入域进行验证&#xff0c; 采用等价划分法设计相应的测试用例&#xff0c;包括尽量多的无效等价类。 答: 有效等价类如下&#xff1a; (1)邮箱输入学符串格式***uestc.edu.cn或***UESTC.ED…

引入sortablejs插件实现表格列拖拽功能的封装

1 参考其他文章 VueElementUI 实现 动态调整表格列 显示隐藏&显示顺序 2 具体实现 2.1 将列拖拽功能封装到通用表格动态列组件里 关于表格动态列组件的具体代码&#xff0c;可以看我的另一篇博客&#xff1a;Vue - 基于Element UI封装一个表格动态列组件。 2.2 实现思…

linux中deadline调度原理与代码注释

简介 deadline调度是比rt调度更高优先级的调度&#xff0c;它没有依赖于优先级的概念&#xff0c;而是给了每个实时任务一定的调度时间&#xff0c;这样的好处是&#xff1a;使多个实时任务场景的时间分配更合理&#xff0c;不让一些实时任务因为优先级低而饿死。deadline调度…

openGauss学习笔记-165 openGauss 数据库运维-备份与恢复-导入数据-使用COPY FROM STDIN导入数据-通过本地文件导入导出数据

文章目录 openGauss学习笔记-165 openGauss 数据库运维-备份与恢复-导入数据-使用COPY FROM STDIN导入数据-通过本地文件导入导出数据165.1 示例1&#xff1a;通过本地文件导入导出数据 openGauss学习笔记-165 openGauss 数据库运维-备份与恢复-导入数据-使用COPY FROM STDIN导…

Hutool--DFA 敏感词工具类

使用hutool的dfa工具类可以很好的帮助我们来实现敏感词过滤的功能&#xff0c;下面从用例入手来逐步地去j简单了解一下dfa工具类。 字典树 DFA算法的核心是建立了以敏感词为基础的许多敏感词树&#xff08;字典树&#xff09;。 它的基本思想是基于状态转移来检索敏感词。 字…

C++复合数据类型:vector|string

文章目录 模板类vector初始化访问修改添加 标准库类型string初始化访问拼接比较字符串 模板类vector 初始化 访问 修改 添加 数组长度在初始化时已经定义&#xff0c;访问范围也有限&#xff0c;数组长度还得通过计算 所以C中定义了很多扩展的“抽象数据类型”&#xff0c…

深度学习 tensorflow基础介绍

深度学习是一种基于人工神经网络的机器学习方法&#xff0c;其目标是通过模仿人脑的结构和功能&#xff0c;实现对大量复杂数据的学习和理解。它可以在图像识别、语音识别、自然语言处理等领域取得惊人的成就。 深度学习的引入引出了TensorFlow&#xff0c;它是一个由Google Br…

go语言指针变量定义及说明

go语言指针主要需要记住两个特殊符号&#xff0c; 一个是 & 用来获取变量对应的内存地址 另一个是 * 用来获取指针对应的变量值 下面是个最简单的go语言指针说明 package mainimport "fmt"//指针为内存地址func main() {var a string "指针对应的变量&…

互联网中的商品超卖问题及其解决方案:Java中Redis结合UUID的应用

前言 在设计商品下单和库存扣减&#xff0c;你一定遇到过这样的问题&#xff0c;库存扣减为0了&#xff0c;可是消费者还能下单&#xff0c;并将订单信息保存到了数据库里&#xff0c;针对商品超卖问题&#xff0c;作此篇以解决。 随着互联网商业的飞速发展&#xff0c;商品超…

【OpenHarmony】下载指定时间点的代码

1、正常初始化 repo init -u gitgitee.com:openharmony/manifest.git -b master --no-repo-verify 2、获取tag点的manifest文件 在OpenHarmony的CI系统上&#xff0c;进入tag管理系统。http://ci.openharmony.cn/workbench/cicd/codecontrol/tagsystem找到自己所需的tag文件…

PyQt6 QFontDialog字体对话框控件

锋哥原创的PyQt6视频教程&#xff1a; 2024版 PyQt6 Python桌面开发 视频教程(无废话版) 玩命更新中~_哔哩哔哩_bilibili2024版 PyQt6 Python桌面开发 视频教程(无废话版) 玩命更新中~共计50条视频&#xff0c;包括&#xff1a;2024版 PyQt6 Python桌面开发 视频教程(无废话版…

钓鱼篇(上)

前言 钓鱼的核心主要还是思路要大胆。今天主要从一个完整的钓鱼流程进行讲解&#xff0c;记录下自己在学习这方面的知识时&#xff0c;如何将其有机结合起来&#xff0c;实现一个蓝队无感的钓鱼攻击流程&#xff0c;真正体验下如何从细节入手&#xff0c;将最危险的地方化为最…

LeetCode Hot100 51.N皇后

题目&#xff1a; 按照国际象棋的规则&#xff0c;皇后可以攻击与之处在同一行或同一列或同一斜线上的棋子。 n 皇后问题 研究的是如何将 n 个皇后放置在 nn 的棋盘上&#xff0c;并且使皇后彼此之间不能相互攻击。 给你一个整数 n &#xff0c;返回所有不同的 n 皇后问题 的…

LeetCode刷题--- 电话号码的字母组合

个人主页&#xff1a;元清加油_【C】,【C语言】,【数据结构与算法】-CSDN博客 个人专栏 力扣递归算法题 http://t.csdnimg.cn/yUl2I 【C】 http://t.csdnimg.cn/6AbpV 数据结构与算法 http://t.csdnimg.cn/hKh2l 前言&#xff1a;这个专栏主要讲述递归递归、搜…

Java Catching and Handling Exceptions(二)

一、Try with resources语句 try with resources语句是声明一个或多个资源的try语句。资源是程序使用完后必须关闭的对象。try with resources语句确保在语句末尾关闭每个资源。任何实现java.lang.AutoCloseable的对象&#xff08;包括实现java.io.Closeable的所有对象&#x…

探秘 AJAX:让网页变得更智能的异步技术(下)

&#x1f90d; 前端开发工程师&#xff08;主业&#xff09;、技术博主&#xff08;副业&#xff09;、已过CET6 &#x1f368; 阿珊和她的猫_CSDN个人主页 &#x1f560; 牛客高级专题作者、在牛客打造高质量专栏《前端面试必备》 &#x1f35a; 蓝桥云课签约作者、已在蓝桥云…

基于ssm计算机科学与技术学习网站的设计与开发论文

摘 要 现代经济快节奏发展以及不断完善升级的信息化技术&#xff0c;让传统数据信息的管理升级为软件存储&#xff0c;归纳&#xff0c;集中处理数据信息的管理方式。本在校学习网站就是在这样的大环境下诞生&#xff0c;其可以帮助管理者在短时间内处理完毕庞大的数据信息&am…

【MySQL】Sql优化之索引的使用方式(145)

索引分类 1.单值索引 单的意思就是单列的值&#xff0c;比如说有一张数据库表&#xff0c;表内有三个字段&#xff0c;分别是 id name numberNo&#xff0c;我给name 这个字段加一个索引&#xff0c;这就是单值索引&#xff0c;因为只有name 这一列是索引&#xff1b; 一个表…