淘宝小程序踩坑记录

news2024/12/24 0:37:30

最近搞了一套淘宝小程序配合淘宝店铺直接跳转,类似于扭蛋机那种机制,真是一路坎坷,一步一个坑,这里记录一下(前端);淘宝小程序文当中心

编译相关

用uni-app没有淘宝小程序独有的编译环境,只能自定义编译环境,用支付宝小程序的环境去编译,自定义常量;在package.json里面配置;
常量区分支付宝和淘宝,因为用支付宝环境编译出来的MP-ALIPAY是同时支持支付宝小程序和淘宝小程序的,因为我们也有支付宝小程序所以需要区分这两个;

"uni-app": {
    "scripts": {
      "mp-taobao": {
        "title": "淘宝小程序",
        "env": {
          "UNI_PLATFORM": "mp-alipay",
          "NAME": "mp-taobao"
        },
        "define": {
          "MP-TAOBAO": true
        }
      },
      "mp-zhifubao": {
        "title": "支付宝小程序",
        "env": {
          "UNI_PLATFORM": "mp-alipay",
          "NAME": "mp-zhifubao"
        },
        "define": {
          "MP-ZHIFUBAO": true
        }
      }
    }
  }

淘宝运动相关

我们需要获取淘宝步数,用户进来要获取淘宝运动权限,但是这里跟微信小程序不太一样,IOS和安卓也是有些区分的;
淘宝步数的所有API都需要在真机上才能测试,在淘宝小程序工具上不可用,又因为真机上不能看console,所以所有的返回值都需要alert出来,这点有些麻烦;

先介绍一下关于淘宝运动的相关API:

  • 淘宝步数相关的api需要在小程序后台申请对应的权限包,否则用不了,直接提工单申请;
    -在这里插入图片描述

  • my.tb.getStepsHistory获取历史步数

  • my.tb.getDailySteps获取当天步数

  • my.tb.requestStepsAuthorization申请步数权限,仅限IOS可以用;

  • my.tb.supportStepCount判断手机是否支持计步;

getTbRunData() {
        let today = Date.now()
        let after = today - 24 * 60 * 60 * 1000  // t-1 天
        let before = today - 30 * 24 * 60 * 60 * 1000  // t-30 天
        console.info({startTime: this.formatDate(before, 'YYYYMMDD'), endTime: this.formatDate(after, 'YYYYMMDD')})
        const app = getApp()
        my.authorize({
          scopes: 'scope.getStepsStatus',
          success: (res) => {
            // 申请步数权限(唤起系统权限设置半层仅IOS支持)
            if (app.globalData.isIOS) {
              my.tb.requestStepsAuthorization({}, (requestStepsAuthorization) => {
                console.log('requestStepsAuthorization=====', requestStepsAuthorization)
              })
            }
            
            // 获取历史步数
            my.tb.getStepsHistory(
              {
                startTime: this.formatDate(before, 'YYYYMMDD'),
                endTime: this.formatDate(after, 'YYYYMMDD')
              }, 
              (e) => {
                this.stepsHistoryList = e.stepsHistory || e.stepsHistoryList || []
                setTimeout(() => {  
                  this.uploadTbRun()
                }, 200)    
                // 上传步数
                // my.alert({
                //   content: '3' + JSON.stringify(e.stepsHistory),
                // })
                //  my.alert({
                //   content: '4' + JSON.stringify(e.stepsHistoryList),
                // })
            })
          },
          fail: (res) => {
            this.$toast && this.$toast('获取淘宝步数权限失败!')
          }
        })
      },

通过my.authorize申请scope.getStepsStatus权限,会唤起授权淘宝运动的半层,在这里插入图片描述
但是如果用户关闭了系统隐私里面的淘宝运动权限,淘宝小程序实时监控不到的,不像微信小程序那样一直弹框提醒;
my.tb.requestStepsAuthorization 这个API的作用主要是IOS系统,淘宝打开淘宝小程序,如果此前用户从未授权过系统隐私里面的淘宝步数,这个api会唤起授权半层,但是仅此一次,不论用户是否允许都不会再唤起,只能用户手动去修改
在这里插入图片描述
针对安卓系统,官方给出的结论是只要调用my.authorize且从没有打开过系统隐私的淘宝运动,就会唤起这个半层,但是我这边试了不好使,唤不起来;实在没办法只能弹框告诉用户,安卓手机每个机型隐私设置位置还不一样很麻烦;

这里有个小Tips: 可以直接让用户去淘宝 乐运动 小程序里面取开启,这个是淘宝自己的小程序安卓也可以唤起那个半层,如下图

在这里插入图片描述

其他

  • uni-app里面配置的淘宝头编译之后,丢失部分信息,主要是淘宝特有的头设置字段,需要手动设置一下;
    "navigationBarForceEnable": true,
	"navigationBarTextStyle": "black",
	"showNavigationBarLogo": true
  • 淘宝小程序分享之后,头部错位,这个问题主要是淘宝小程序分享设置的path导致的,主流小程序是带有/的,淘宝不能带,带了就有问题,要去掉最前面的/
  • 淘宝小程序的商品点击直接跳转到淘宝店铺的商详,可用API,超级丝滑;
// #ifdef MP-TAOBAO
my.tb.openDetail({
  itemId: slide.shopProductId,
  success: (res) => {
    // my.alert({ content: "success" });
  },
  fail: (res) => {
    // my.alert({ content: "fail - " + res.error });
  }
})
// #endif
  • 淘宝店铺跳转淘宝小程序,需要淘宝小程序的链接,淘宝小程序的链接要在小程序上线后的二维码下面有个复制链接的功能,就是小程序链接;
  • 如果小程序链接不想直接到首页,想到别的页面可以在生成的链接后面拼page字段,设置启动页面, 在小程序链接后面添加 page 参数,page后面的参数放入链接前需先encode; 参考示例:https://m.duanqu.com/?_ariver_appid=20000067&page=pages%2Ftest%2Ftest%3Fname%3DTom%26age%3D23

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

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

相关文章

EdgeWorkers 最佳实践丨助力流媒体创新

近日亚太区 Akamai EdgeWorkers 首届编程挑战赛圆满落幕。参赛团队充分利用 Akamai 的智能边缘平台,探索无服务器计算的应用潜力。爱奇艺等获胜团队凭借 Akamai EdgeWorkers 和 EdgeKV 产品开发功能,将 DNS 解析时间降低 40% 。 一、云上竞逐&#xff0…

21LTR-Scene打靶渗透【附POC】(权限提升)

靶机下载地址:21LTR: Scene 1 ~ VulnHub21LTR: Scene 1, made by JayMaster2000. Download & walkthrough links are available.https://www.vulnhub.com/entry/21ltr-scene-1,3/ 1. 主机发现端口扫描目录扫描【192.168.2.120】 1.1. 主机发现 nmap -sn 192.…

牛客周赛 Round 54 (A~E)

#牛客周赛 Round 54 (A~E) 前言: 以后会定时更新很多比赛的题解 希望借此让自己坚持赛后补题 要不然写完就结束 自己水平没有一点提高 本人很菜所以不会更新 太难的题 加油!!!1. ​清楚姐姐的糖葫芦…

落笔成画!Krita+ComfyUI解锁AI实时绘图

原文链接:落笔成画!KritaComfyUI解锁AI实时绘图 (chinaz.com) 安装前提:电脑本地已经安装过ComfyUI且能正常运行 首先我们到Krita的官网下载Krita,我们直接下载最新的安装就可以了,安装过程非常简单,选择…

SQL注入之sqli-labs靶场第一关

手工注入less-1 1.找注入点 通过 ?id1 and 12--没有发现变化,尝试闭合发现注入点 字符型注入,单引号闭合 2.猜解字段数量 发现字段数量为3 3.通过union联合查询判断回显点 发现回显点2,3, 4,进行信息收集 数据库…

在PyCharm社区版中切换中文界面的操作方法

在PyCharm社区版中切换中文界面,可以按照以下步骤操作: 打开PyCharm社区版,点击顶部菜单栏的 "File"(文件)。在下拉菜单中选择 "Settings"(设置),或者使用快捷…

SSM整合快速学习

目录 步骤: 一、环境搭建 1.创建JdbcConfig配置类 2.创建JdbcConfig配置类 3.创建MybatisConfig配置类 4.创建jdbc.properties 5.创建SpringMVC配置类 6.创建Web项目入口配置类 二、功能模块开发 步骤1:创建数据库及表 步骤2:编写模型类 步骤3:编写Dao接…

Unlikely argument type for equals(): int seems to be unrelated to Long

代码审查不规范: Unlikely argument type for equals(): int seems to be unrelated to Long check package code_check;public class Obj {public Obj(){}private Long mail;public Long getMail(){return mail;}public void setMail(Long mail){this.mail mail;…

【OpenCV C++20 学习笔记】提取图片中的水平和垂直对象

提取图片中的水平和垂直对象 原理实操——去除五线谱的五线二进制化提取垂直对象完善边缘和最终输出图片黑白反转平滑 完整代码 其他图片元素提取实践提取水平线条提取音符轮廓 原理 在腐蚀和膨胀操作中,通过卷积核(kernel),或者结构元素(structuring e…

在优化微信、支付宝小程序用户体验时有哪些关键指标

在优化小程序用户体验时,有几个关键指标需要特别关注,这些指标不仅能够帮助评估当前的用户体验状况,还能为后续的优化工作提供明确的方向。以下是一些关键指标及其解释: 1. 日活跃用户(DAU) 是指每天使用…

搭建Mybatis,实现数据库增删改

在pom.xml文件中粘贴下列&#xff0c;加载maven依赖 <?xmlversion"1.0"encoding"UTF-8"?> <projectxmlns"http://maven.apache.org/POM/4.0.0" xmlns:xsi"http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation&…

2024年武汉东湖高新区职称第二批次开始了

众所周知&#xff0c;武汉市东湖高新区职称一年两批次&#xff0c;今年下半年第二批水平能力测试报名也已经开始了&#xff0c;请注意报名时间&#xff0c;别错过&#xff01;&#xff01; 2024年武汉东湖高新区第二批次水测报名时间&#xff1a;&#xff08;一&#xff09;网上…

letcode 分类练习 哈希表 242.有效的字母异位词 349. 两个数组的交集 202. 快乐数 1. 两数之和

letcode 分类练习 哈希表 242.有效的字母异位词 349. 两个数组的交集 202. 快乐数 1. 两数之和 242.有效的字母异位词349.两个数组的交集202.快乐数1.两数之和 242.有效的字母异位词 分别定义两个字母哈希表就可以了 class Solution { public:bool isAnagram(string s, strin…

sql注入-常见注入方法复现

环境演示均已sql-labs为例 1、报错注入 1.1常用的报错注入的函数 掌握好extractvalue、updatexml、floor报错&#xff0c;floor报错较难需要多理解&#xff0c;updatexml较为常用 定义 报错注入是通过特殊函数错误使用并使其输出错误结果来获取信息的。是一种页面响应形式…

MySQL练习题(五)

环境搭建&#xff08;MySQL:8.0.25&#xff09;: CREATE TABLE DEPT (DEPTNO int PRIMARY KEY,##部门编号DNAME VARCHAR(14), ##部门名称LOC VARCHAR(13) ##部门地址 ); INSERT INTO DEPT VALUES (10, ACCOUNTING, NEW YORK); INSERT INTO DEPT VALUES (20, RESEAR…

sqllab靶场练习第1~15关

1、第一关 代码解析 if(isset($_GET[id]))//判断获取的id字段是否为空 { $id$_GET[id]; //logging the connection parameters to a file for analysis. $fpfopen(result.txt,a);//打开这个文件&#xff0c;记录操作的日志 fwrite($fp,ID:.$id."\n"); fclose($fp);…

Java、PHP、Node 操作 MySQL 数据库常用方法

一、Java 操作 MySQL 数据库 1、Java 连接 MySQL 数据库 1. 使用 JDBC 驱动程序连接 使用这种方式&#xff0c;首先需要导入 MySQL 的 JDBC 驱动程序依赖&#xff0c;然后通过 Class.forName() 方法加载驱动程序类。其创建连接的过程相对直接&#xff0c;只需提供准确的数据库…

我不喜欢蔚来的原因

商业逻辑 蔚来主打的是换电和服务。 先说服务&#xff0c;这种极其依赖人工&#xff0c;打造极致尊贵感的服务&#xff0c;是完全无法随着销售规模扩大而降低成本的&#xff0c;相反&#xff0c;如果要保持相同水准的服务&#xff0c;可能会导致成本随着规模扩大而增高&#x…

桥田动态|盛夏官宣 · 桥田全新品牌形象正式发布

VISUAL IDENTITY 2024品牌革新 桥田智能品牌VI系统升级发布 Hi 各位伙伴们&#xff0c;很高兴的告知大家&#xff0c;我们的品牌形象VI和官方网站全面升级。全新的LOGO设计和官方网站将为您带来更为直观和互动的体验。 1 品牌标识 Brand identity 全新LOGO&#xff0c;彰显…

学习STM32(3)--STM32单片机中断的应用

1 引 言 本次实验旨在深入探究STM32F103单片机中断的应用。通过实验&#xff0c;我们将全面掌握STM32F103中断的定义、NVIC&#xff08;Nested Vectored Interrupt Controller&#xff0c;嵌套向量中断控制器&#xff09;的使用和开发&#xff0c;以及外部中断&#xff08;E…