HBuilderX

HBuilderX

极客开发工具
uni-app

uni-app

开发一次,多端覆盖
uniCloud

uniCloud

云开发平台
HTML5+

HTML5+

增强HTML5的功能体验
MUI

MUI

上万Star的前端框架

关于unicloud账号 短信的等问题

uniCloud 短信

希望官方可以出一个关于查询当前unicloud账号下云短信账号余额,以及模版列表,签名列表,申请签名,申请短信模板,以及充值短信账号条数等的功能的接口

这样就可以在自己的项目的管理后台进行操作,申请短信模板,签名,充值余额啥的,这样方便交给客户之后 不懂技术的客户 好操作

其他模块最好也能出一下相关接口
就像微信开放文档这样

继续阅读 »

希望官方可以出一个关于查询当前unicloud账号下云短信账号余额,以及模版列表,签名列表,申请签名,申请短信模板,以及充值短信账号条数等的功能的接口

这样就可以在自己的项目的管理后台进行操作,申请短信模板,签名,充值余额啥的,这样方便交给客户之后 不懂技术的客户 好操作

其他模块最好也能出一下相关接口
就像微信开放文档这样

收起阅读 »

个推OneID:让企业用户运营更有效、商业增长更高效

个推

在存量时代,精细化运营成为移动互联网企业提升运营效率和效果、实现商业增长的重要手段。为了给用户提供全方位的优质服务,很多企业布局了APP、小程序、H5、快应用、Web等多个渠道,企业的数据来源容易分散,同时在较多情况下由于各平台之间彼此独立运营,数据无法互通,从而形成“数据孤岛”。企业运营人员也因此无法进行全局的用户洞察和数据分析,难以高效地完成投放、转化、归因等精细化运营环节。针对这一现象,个推将自身大数据能力与卓信ID深度融合,打造了OneID,帮助企业实现跨端数据互通,让企业用户运营更有效、商业增长更高效。

图:个推OneID增能APP精细化运营

卓信ID是中国信通院发布的移动互联网新一代匿名标识体系,具有匿名、可变、去标识化等特点,支持跨域数据合规流转,可实现跨APP、小程序、H5平台运营数据打通。OneID作为个推大数据能力与卓信ID融合的“集大成者”,一方面能够在安全、合规的前提下打通APP、小程序(包括微信、支付宝、抖音等平台)、H5、快应用等多端数据,帮助企业识别目标设备;另一方面配合个推用户运营平台的其他能力,也能帮助企业在更多维度地刻画用户画像,深入洞察用户的线上兴趣偏好,有效识别用户线下场景特征,帮助企业做好用户精细化运营。

在具体应用中,个推OneID在APP用户运营、商业变现、业务风控等场景中都能发挥出重要作用。

在用户运营场景下,企业要提升用户生命周期价值,需要优化其在获客、激活、留存、传播、转化等各环节的效率和效果。其中,在获客环节,由于流量红利消失以及“数据孤岛”难题,企业往往面临着拉新成本高、流量归因难的问题。OneID可以帮助企业识别设备来源、判断渠道质量,以优化投放策略、降低拉新成本。而在留存环节,企业则面临着数据维度不够丰富、用户画像不够全面立体的痛点。在个推OneID的能力加持下,企业能够打通设备在各渠道的数据,分析用户旅程中的特征变迁,及时捕获用户行为偏好和需求变化,帮助企业更针对性地进行用户精细化运营,让用户对企业的服务更加“欲罢不能”。

除了用户运营场景,个推OneID还能帮助移动互联网企业加速其商业化变现。具体而言,以往因为设备信息识别率不高,企业流量变现的效率往往较低。在使用个推OneID方案后,企业能够更好地识别设备真实来源,APP、小程序等流量和媒体平台也能够有效完成广告投放归因,高效进行流量变现,促进企业商业化变现升级。

自3月底发布以来,个推OneID已凭借着打通率高、数据能力强、安全保障好等能力优势,与来自工具、影音视频、新闻资讯、旅游出行等领域的20余家头部APP客户开启了价值共创,共同在精细化运营、商业化变现等方面探索落地应用。未来,个推还将持续发挥数据和技术的力量,不断推动OneID产品升级、深化应用场景,携手更多的行业伙伴,推动移动互联网行业健康绿色发展。

继续阅读 »

在存量时代,精细化运营成为移动互联网企业提升运营效率和效果、实现商业增长的重要手段。为了给用户提供全方位的优质服务,很多企业布局了APP、小程序、H5、快应用、Web等多个渠道,企业的数据来源容易分散,同时在较多情况下由于各平台之间彼此独立运营,数据无法互通,从而形成“数据孤岛”。企业运营人员也因此无法进行全局的用户洞察和数据分析,难以高效地完成投放、转化、归因等精细化运营环节。针对这一现象,个推将自身大数据能力与卓信ID深度融合,打造了OneID,帮助企业实现跨端数据互通,让企业用户运营更有效、商业增长更高效。

图:个推OneID增能APP精细化运营

卓信ID是中国信通院发布的移动互联网新一代匿名标识体系,具有匿名、可变、去标识化等特点,支持跨域数据合规流转,可实现跨APP、小程序、H5平台运营数据打通。OneID作为个推大数据能力与卓信ID融合的“集大成者”,一方面能够在安全、合规的前提下打通APP、小程序(包括微信、支付宝、抖音等平台)、H5、快应用等多端数据,帮助企业识别目标设备;另一方面配合个推用户运营平台的其他能力,也能帮助企业在更多维度地刻画用户画像,深入洞察用户的线上兴趣偏好,有效识别用户线下场景特征,帮助企业做好用户精细化运营。

在具体应用中,个推OneID在APP用户运营、商业变现、业务风控等场景中都能发挥出重要作用。

在用户运营场景下,企业要提升用户生命周期价值,需要优化其在获客、激活、留存、传播、转化等各环节的效率和效果。其中,在获客环节,由于流量红利消失以及“数据孤岛”难题,企业往往面临着拉新成本高、流量归因难的问题。OneID可以帮助企业识别设备来源、判断渠道质量,以优化投放策略、降低拉新成本。而在留存环节,企业则面临着数据维度不够丰富、用户画像不够全面立体的痛点。在个推OneID的能力加持下,企业能够打通设备在各渠道的数据,分析用户旅程中的特征变迁,及时捕获用户行为偏好和需求变化,帮助企业更针对性地进行用户精细化运营,让用户对企业的服务更加“欲罢不能”。

除了用户运营场景,个推OneID还能帮助移动互联网企业加速其商业化变现。具体而言,以往因为设备信息识别率不高,企业流量变现的效率往往较低。在使用个推OneID方案后,企业能够更好地识别设备真实来源,APP、小程序等流量和媒体平台也能够有效完成广告投放归因,高效进行流量变现,促进企业商业化变现升级。

自3月底发布以来,个推OneID已凭借着打通率高、数据能力强、安全保障好等能力优势,与来自工具、影音视频、新闻资讯、旅游出行等领域的20余家头部APP客户开启了价值共创,共同在精细化运营、商业化变现等方面探索落地应用。未来,个推还将持续发挥数据和技术的力量,不断推动OneID产品升级、深化应用场景,携手更多的行业伙伴,推动移动互联网行业健康绿色发展。

收起阅读 »

建议云打包使用包月制,而不是按次收费

云打包

目前云打包按20元一次收费,这样的设计其实一点都不科学!
为什么不科学,因为UniAPP的打包并不会像微信开发者工具一样,自动滚动版本号,开发人员经常打完包才发现TMD版本号忘记了修改,然后我改个版本号又要再付20,这不傻了吗?

可以把免费的和付费的用户分开,适当提速,这样你们的营收也会增加。

我想支援你们点钱,但看到20一次,简直把我当傻瓜。

继续阅读 »

目前云打包按20元一次收费,这样的设计其实一点都不科学!
为什么不科学,因为UniAPP的打包并不会像微信开发者工具一样,自动滚动版本号,开发人员经常打完包才发现TMD版本号忘记了修改,然后我改个版本号又要再付20,这不傻了吗?

可以把免费的和付费的用户分开,适当提速,这样你们的营收也会增加。

我想支援你们点钱,但看到20一次,简直把我当傻瓜。

收起阅读 »

接单,开发APP,小程序,网站,管理后台

DCloud PHP 外包接单

可承接:
uniapp + dcloud 云端一体 app 和小程序开发
uni-admin + 云空间 管理后台开发
laravel + php+mysql 网站和管理后台开发

欢迎加V详聊 shijian15978

可承接:
uniapp + dcloud 云端一体 app 和小程序开发
uni-admin + 云空间 管理后台开发
laravel + php+mysql 网站和管理后台开发

欢迎加V详聊 shijian15978

uni.vibrateShort无法触发的问题

在html5+规范中,触发震动可以用 plus.device.vibrate(milliseconds);

milliseconds — 震动时长。

uni.vibrateShort 中设定时长为 15ms。

当 milliseconds 时长太短时,无法感知到。
经测试,当 低于50ms时,震感已经微乎其微。

所以使用 h5+规范中的 plus.device.vibrate(milliseconds);

并设定时长 为 100 即可达到需求的震感

plus.device.vibrate(100);

继续阅读 »

在html5+规范中,触发震动可以用 plus.device.vibrate(milliseconds);

milliseconds — 震动时长。

uni.vibrateShort 中设定时长为 15ms。

当 milliseconds 时长太短时,无法感知到。
经测试,当 低于50ms时,震感已经微乎其微。

所以使用 h5+规范中的 plus.device.vibrate(milliseconds);

并设定时长 为 100 即可达到需求的震感

plus.device.vibrate(100);

收起阅读 »

每日互动(个推)与您相约2024 AI+研发数字峰会(AiDD)上海站

伴随着人工智能在众多行业领域的广泛应用及其带来的颠覆性变革,软件的开发模式、方式和实践也将发生巨大的变化。

5月17-18日,2024 AI+研发数字峰会(AiDD)上海站即将重磅开幕。峰会设置了15个主题论坛,策划60+精彩议题内容,邀请到了来自北京大学、清华大学、上海交通大学等高校的技术专家以及微软、阿里巴巴、百度等知名企业的一线从业者,从大模型开发到应用等多个层面进行深入分享、交流和共创,旨在推动研发全面进入数智化时代。数据智能上市企业每日互动(个推)受邀出席大会,并将在峰会现场A2展位亮相,为参会观众带来数据智能操作系统DiOS及AI研发创新成果。

会议主题:

“AI驱动研发迈进数智化时代”

会议时间:

2024年05月17-18日

会议地点:

上海明捷万丽酒店

立即报名:

AiDD研发数字峰会-上海站 https://aidd.vip/sh

每日互动成立于2010年,致力于用数据让产业更智能。为助力垂直行业客户的数字化转型升级,每日互动打造了数据智能操作系统DiOS(Data Intelligence Operating System),致力于“让数好用,把数用好”,帮助行业客户更高效地管理和使用数据。进入到大模型时代,每日互动也将LLMs的能力融入到DiOS产品中,实现数据治理和应用范式的变革,让行业客户可以用自然语言对话的方式使用DiOS,极其便捷地挖掘数据价值。

此外,每日互动也在探索大模型、RAG(检索增强生成)、PRA(机器人流程自动化)等前沿技术在商业服务和公共服务领域的落地,推动生产和研发效能的提升。比如在商业服务领域,每日互动面向品牌广告主推出了AITA智选人群新功能,让营销人员可以通过自然语言对话的方式快速进行人群洞察和定向,极大降低了数据的使用门槛;在公共服务领域,每日互动推出了惠企政策智配大模型,采用RAG技术,提升大模型回答的准确性和合规性。平台一方面帮助企业精准、快捷、全面地匹配政策,通过智能化的政策解读精简提炼政策条款,提高企业对政策的理解和应用能力;另一方面帮助政府机构更好地向企业传达政策信息,提高政策遵从度和落地效率。

更多大模型探索和数据智能创新实践,欢迎大家于5月17-18日前往2024 AI+研发数字峰会(AiDD)上海站 每日互动A2展位,和我们一起深入交流、探讨。

继续阅读 »

伴随着人工智能在众多行业领域的广泛应用及其带来的颠覆性变革,软件的开发模式、方式和实践也将发生巨大的变化。

5月17-18日,2024 AI+研发数字峰会(AiDD)上海站即将重磅开幕。峰会设置了15个主题论坛,策划60+精彩议题内容,邀请到了来自北京大学、清华大学、上海交通大学等高校的技术专家以及微软、阿里巴巴、百度等知名企业的一线从业者,从大模型开发到应用等多个层面进行深入分享、交流和共创,旨在推动研发全面进入数智化时代。数据智能上市企业每日互动(个推)受邀出席大会,并将在峰会现场A2展位亮相,为参会观众带来数据智能操作系统DiOS及AI研发创新成果。

会议主题:

“AI驱动研发迈进数智化时代”

会议时间:

2024年05月17-18日

会议地点:

上海明捷万丽酒店

立即报名:

AiDD研发数字峰会-上海站 https://aidd.vip/sh

每日互动成立于2010年,致力于用数据让产业更智能。为助力垂直行业客户的数字化转型升级,每日互动打造了数据智能操作系统DiOS(Data Intelligence Operating System),致力于“让数好用,把数用好”,帮助行业客户更高效地管理和使用数据。进入到大模型时代,每日互动也将LLMs的能力融入到DiOS产品中,实现数据治理和应用范式的变革,让行业客户可以用自然语言对话的方式使用DiOS,极其便捷地挖掘数据价值。

此外,每日互动也在探索大模型、RAG(检索增强生成)、PRA(机器人流程自动化)等前沿技术在商业服务和公共服务领域的落地,推动生产和研发效能的提升。比如在商业服务领域,每日互动面向品牌广告主推出了AITA智选人群新功能,让营销人员可以通过自然语言对话的方式快速进行人群洞察和定向,极大降低了数据的使用门槛;在公共服务领域,每日互动推出了惠企政策智配大模型,采用RAG技术,提升大模型回答的准确性和合规性。平台一方面帮助企业精准、快捷、全面地匹配政策,通过智能化的政策解读精简提炼政策条款,提高企业对政策的理解和应用能力;另一方面帮助政府机构更好地向企业传达政策信息,提高政策遵从度和落地效率。

更多大模型探索和数据智能创新实践,欢迎大家于5月17-18日前往2024 AI+研发数字峰会(AiDD)上海站 每日互动A2展位,和我们一起深入交流、探讨。

收起阅读 »

使用 bundle-analyzer 分析 uni-app 打包产物包含哪些东西

uniapp

之前陆陆续续有用户提到 uni-app 打包之后,体积突然变大了,或者突然变小了。不清楚 dist 目录的产物都包含哪些内容,这里提供构建产物分析的方案。

技术思路

uni-app 在使用 vue2 中使用 webpack 进行打包,在 vue3 中使用 vite 进行打包,在 webpack/vite 的插件生态中,有 bundle-analyzer 相关插件。

vue3

如果你在使用 HBuidlerX 或者 CLI 运行 vue3 版本的项目,你可以在对应的工程目录安装。

npm install --save-dev rollup-plugin-visualizer  
# or  
yarn add --dev rollup-plugin-visualizer

观察当前目录是否包含 vite.config.js,如果没有请创建,如果已经存在按照下面修改。

官方文档提到了 vite.config.js 的作用 vite.config.ts

修改为下面方案,具体根据项目的依赖进行修改。

import {  
  defineConfig  
} from 'vite';  
import uni from '@dcloudio/vite-plugin-uni';  
import {  
  visualizer  
} from "rollup-plugin-visualizer";  

export default defineConfig({  
  plugins: [  
    uni(),  

    visualizer({  
      emitFile: true,  
      filename: "111stats.html",  
    })  
  ],  
});

之后执行编译到对应平台,比如微信小程序平台,观察 unpackage/dist/dev/mp-weixin 是否读了一个 111stats.html 文件,拖入浏览器即可查看具体哪些产物多大体积。

如果你发现 uniapp 版本升级前后,尺寸发生了变化,可以前后两次编译产生的依赖图,供开发人员分析,具体哪个文件尺寸有异常。

vue2

如果在使用 HBuilderX 或者 CLI 运行 vue2 项目,可以按照下面的方案添加依赖

# NPM  
npm install --save-dev webpack-bundle-analyzer  
# Yarn  
yarn add -D webpack-bundle-analyzer

修改或者创建 vue.config.js,修改为下面方案

const path = require('path')  
const BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin;  

module.exports = {  
    configureWebpack: {  
        plugins: [  
            new BundleAnalyzerPlugin({  
         analyzerMode: 'static',  
        reportFilename: '111report.html'  
      })  
        ]  
    }  
}

之后执行编译到对应平台,比如微信小程序平台,观察 unpackage/dist/dev/mp-weixin 是否读了一个 111report.html 文件,拖入浏览器即可查看具体哪些产物多大体积。

如果你发现 uniapp 版本升级前后,尺寸发生了变化,可以前后两次编译产生的依赖图,供开发人员分析,具体哪个文件尺寸有异常。

依赖分析

一般情况下,依赖分成两个大的部分:

  • 依赖产物,在 vendor.js 中
  • 页面逻辑,一般以 pages 文件夹为主

正常情况下,编译提及发生变化,一般是 vendor 或者 node_modules 发生了变化,具体可以观察对应部分。

如果在 ask 社区提问请提供对应的前后尺寸对比。

备注:

  • link https://issues.dcloud.net.cn/pages/issues/detail?id=1133
继续阅读 »

之前陆陆续续有用户提到 uni-app 打包之后,体积突然变大了,或者突然变小了。不清楚 dist 目录的产物都包含哪些内容,这里提供构建产物分析的方案。

技术思路

uni-app 在使用 vue2 中使用 webpack 进行打包,在 vue3 中使用 vite 进行打包,在 webpack/vite 的插件生态中,有 bundle-analyzer 相关插件。

vue3

如果你在使用 HBuidlerX 或者 CLI 运行 vue3 版本的项目,你可以在对应的工程目录安装。

npm install --save-dev rollup-plugin-visualizer  
# or  
yarn add --dev rollup-plugin-visualizer

观察当前目录是否包含 vite.config.js,如果没有请创建,如果已经存在按照下面修改。

官方文档提到了 vite.config.js 的作用 vite.config.ts

修改为下面方案,具体根据项目的依赖进行修改。

import {  
  defineConfig  
} from 'vite';  
import uni from '@dcloudio/vite-plugin-uni';  
import {  
  visualizer  
} from "rollup-plugin-visualizer";  

export default defineConfig({  
  plugins: [  
    uni(),  

    visualizer({  
      emitFile: true,  
      filename: "111stats.html",  
    })  
  ],  
});

之后执行编译到对应平台,比如微信小程序平台,观察 unpackage/dist/dev/mp-weixin 是否读了一个 111stats.html 文件,拖入浏览器即可查看具体哪些产物多大体积。

如果你发现 uniapp 版本升级前后,尺寸发生了变化,可以前后两次编译产生的依赖图,供开发人员分析,具体哪个文件尺寸有异常。

vue2

如果在使用 HBuilderX 或者 CLI 运行 vue2 项目,可以按照下面的方案添加依赖

# NPM  
npm install --save-dev webpack-bundle-analyzer  
# Yarn  
yarn add -D webpack-bundle-analyzer

修改或者创建 vue.config.js,修改为下面方案

const path = require('path')  
const BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin;  

module.exports = {  
    configureWebpack: {  
        plugins: [  
            new BundleAnalyzerPlugin({  
         analyzerMode: 'static',  
        reportFilename: '111report.html'  
      })  
        ]  
    }  
}

之后执行编译到对应平台,比如微信小程序平台,观察 unpackage/dist/dev/mp-weixin 是否读了一个 111report.html 文件,拖入浏览器即可查看具体哪些产物多大体积。

如果你发现 uniapp 版本升级前后,尺寸发生了变化,可以前后两次编译产生的依赖图,供开发人员分析,具体哪个文件尺寸有异常。

依赖分析

一般情况下,依赖分成两个大的部分:

  • 依赖产物,在 vendor.js 中
  • 页面逻辑,一般以 pages 文件夹为主

正常情况下,编译提及发生变化,一般是 vendor 或者 node_modules 发生了变化,具体可以观察对应部分。

如果在 ask 社区提问请提供对应的前后尺寸对比。

备注:

  • link https://issues.dcloud.net.cn/pages/issues/detail?id=1133
收起阅读 »

uni.createInnerAudioContext() 报错{"errMsg":"MediaError","errCode":-5} 解决方案

audio

刚好在写关于控制音频播放的功能,H5、Android调试正常,在iOS端调试时onError报{"errMsg":"MediaError","errCode":-5}错误。说实话,和官方文档对比了一下,还是有点儿懵逼,复制粘贴的代码到了自己这儿居然报错。

疯狂三连 IDE没更新?姿势不对?我太菜了?

作为面向网络开发的我,遇事不解找度娘,发现遇到此问题的小伙伴也挺多的,也有部分小伙伴提供了一些解决思路:

https://ask.dcloud.net.cn/article/39258
https://www.php.cn/faq/469883.html

经过调试,发现iOS端音频播放技能前摇太长了,当然了,官方提供的API肯定是经过大面积测试的,一般来说都是咱们的使用姿势错了,细心看下文档和调试就能把问题解决了。

解决过程如下,希望对遇到此问题的小伙伴有帮助:

发现问题

按照官方API的示例直接复制或编写相同代码,H5、Android端调试正常,ios端报错

const innerAudioContext = uni.createInnerAudioContext();  
innerAudioContext.autoplay = true;  
innerAudioContext.src = 'https://web-ext-storage.dcloud.net.cn/uni-app/ForElise.mp3';  
innerAudioContext.onPlay(() => {  
  console.log('开始播放');  
});  
innerAudioContext.onError((res) => {  
  console.log(res.errMsg);  
  console.log(res.errCode);  
});
const innerAudioContext = uni.createInnerAudioContext();  
innerAudioContext.src = 'https://web-ext-storage.dcloud.net.cn/uni-app/ForElise.mp3';  
innerAudioContext.play()  

innerAudioContext.onPlay(() => {  
  console.log('开始播放');  
});  
innerAudioContext.onError((res) => {  
  console.log(res.errMsg);  
  console.log(res.errCode);  
});

在ios调试会分别发现:

初始化设置添加 innerAudioContext.autoplay = true;
onError事件被触发并返回{"errMsg":"MediaError","errCode":-5} 后onPlay事件会被触发,这问题应该是大多数小伙伴遇到的

初始化设置时执行 innerAudioContext.play() 方法
onError事件不会被触发,onPlay()事件被触发两次

至于ios端为什么会出现这样的问题,就需要Dcloud团队去处理了。

解决问题

相信各位小伙伴也注意到了官方文档中的onCanplay事件,在这里调用执行播放的事件就能解决问题了。
用大白话来讲:音频资源尚未加载完成,就已经执行播放事件。

               const innerAudioContext = uni.createInnerAudioContext();  
        innerAudioContext.src = 'https://web-ext-storage.dcloud.net.cn/uni-app/ForElise.mp3';  

        innerAudioContext.onCanplay(() => {  
            console.log('可以播放音频');  
            innerAudioContext.play()  
        })  
        innerAudioContext.onPlay(() => {  
            console.log('开始播放');  
        });  
        innerAudioContext.onStop(() => {  
            console.log('音频停止播放');  
        });  
        innerAudioContext.onEnded(() => {  
            console.log('音频自然播放结束事件');  
        });  
        innerAudioContext.onError((res) => {  
            console.log('播放错误');  
            console.log(err);  
        });

写在最后

这是本人这么多年第一次在互联网发表观点,如有不足之处,希望各位大佬多多斧正。

继续阅读 »

刚好在写关于控制音频播放的功能,H5、Android调试正常,在iOS端调试时onError报{"errMsg":"MediaError","errCode":-5}错误。说实话,和官方文档对比了一下,还是有点儿懵逼,复制粘贴的代码到了自己这儿居然报错。

疯狂三连 IDE没更新?姿势不对?我太菜了?

作为面向网络开发的我,遇事不解找度娘,发现遇到此问题的小伙伴也挺多的,也有部分小伙伴提供了一些解决思路:

https://ask.dcloud.net.cn/article/39258
https://www.php.cn/faq/469883.html

经过调试,发现iOS端音频播放技能前摇太长了,当然了,官方提供的API肯定是经过大面积测试的,一般来说都是咱们的使用姿势错了,细心看下文档和调试就能把问题解决了。

解决过程如下,希望对遇到此问题的小伙伴有帮助:

发现问题

按照官方API的示例直接复制或编写相同代码,H5、Android端调试正常,ios端报错

const innerAudioContext = uni.createInnerAudioContext();  
innerAudioContext.autoplay = true;  
innerAudioContext.src = 'https://web-ext-storage.dcloud.net.cn/uni-app/ForElise.mp3';  
innerAudioContext.onPlay(() => {  
  console.log('开始播放');  
});  
innerAudioContext.onError((res) => {  
  console.log(res.errMsg);  
  console.log(res.errCode);  
});
const innerAudioContext = uni.createInnerAudioContext();  
innerAudioContext.src = 'https://web-ext-storage.dcloud.net.cn/uni-app/ForElise.mp3';  
innerAudioContext.play()  

innerAudioContext.onPlay(() => {  
  console.log('开始播放');  
});  
innerAudioContext.onError((res) => {  
  console.log(res.errMsg);  
  console.log(res.errCode);  
});

在ios调试会分别发现:

初始化设置添加 innerAudioContext.autoplay = true;
onError事件被触发并返回{"errMsg":"MediaError","errCode":-5} 后onPlay事件会被触发,这问题应该是大多数小伙伴遇到的

初始化设置时执行 innerAudioContext.play() 方法
onError事件不会被触发,onPlay()事件被触发两次

至于ios端为什么会出现这样的问题,就需要Dcloud团队去处理了。

解决问题

相信各位小伙伴也注意到了官方文档中的onCanplay事件,在这里调用执行播放的事件就能解决问题了。
用大白话来讲:音频资源尚未加载完成,就已经执行播放事件。

               const innerAudioContext = uni.createInnerAudioContext();  
        innerAudioContext.src = 'https://web-ext-storage.dcloud.net.cn/uni-app/ForElise.mp3';  

        innerAudioContext.onCanplay(() => {  
            console.log('可以播放音频');  
            innerAudioContext.play()  
        })  
        innerAudioContext.onPlay(() => {  
            console.log('开始播放');  
        });  
        innerAudioContext.onStop(() => {  
            console.log('音频停止播放');  
        });  
        innerAudioContext.onEnded(() => {  
            console.log('音频自然播放结束事件');  
        });  
        innerAudioContext.onError((res) => {  
            console.log('播放错误');  
            console.log(err);  
        });

写在最后

这是本人这么多年第一次在互联网发表观点,如有不足之处,希望各位大佬多多斧正。

收起阅读 »

【公告】uni-app首期鸿蒙支持计划

鸿蒙

鉴于很多开发者都在咨询uni-app对于鸿蒙next的兼容支持计划,特发此公告。

uni-app 支持鸿蒙

Vue 2 已于 2023 年 12 月 31 日达到终止支持时间,uni-app团队不计划提供 vue 2 的鸿蒙支持,仅规划 vue 3 的鸿蒙兼容支持。建议开发者尽快将历史项目从 vue 2 升级到 vue 3 版本。

鸿蒙系统的兼容支持,是个复杂浩瀚的工作。经和鸿蒙团队交流,我们共同制定了首期 uni-app 鸿蒙支持计划,分2个时间点发布:

  • 2024年6月底:发布 alpha 版,完成基础组件及API的适配,资深开发者可抢先体验;
  • 2024年9月底:发布正式版,完成常用组件及API的适配。

鉴于时间原因,部分功能模块将无法在首期 uni-app 鸿蒙支持计划中实现,比如:nvue、蓝牙、fileSystemManager、uniCloud等。

uni小程序SDK支持鸿蒙

预计2024年9月底,uni小程序SDK将会支持鸿蒙next,仅支持 vue 3 编译后的wgt文件,不支持 vue 2 版本。

uni-app x 支持鸿蒙

预计2024年12月底,完成 uni-app x 对于鸿蒙next的兼容支持。

继续阅读 »

鉴于很多开发者都在咨询uni-app对于鸿蒙next的兼容支持计划,特发此公告。

uni-app 支持鸿蒙

Vue 2 已于 2023 年 12 月 31 日达到终止支持时间,uni-app团队不计划提供 vue 2 的鸿蒙支持,仅规划 vue 3 的鸿蒙兼容支持。建议开发者尽快将历史项目从 vue 2 升级到 vue 3 版本。

鸿蒙系统的兼容支持,是个复杂浩瀚的工作。经和鸿蒙团队交流,我们共同制定了首期 uni-app 鸿蒙支持计划,分2个时间点发布:

  • 2024年6月底:发布 alpha 版,完成基础组件及API的适配,资深开发者可抢先体验;
  • 2024年9月底:发布正式版,完成常用组件及API的适配。

鉴于时间原因,部分功能模块将无法在首期 uni-app 鸿蒙支持计划中实现,比如:nvue、蓝牙、fileSystemManager、uniCloud等。

uni小程序SDK支持鸿蒙

预计2024年9月底,uni小程序SDK将会支持鸿蒙next,仅支持 vue 3 编译后的wgt文件,不支持 vue 2 版本。

uni-app x 支持鸿蒙

预计2024年12月底,完成 uni-app x 对于鸿蒙next的兼容支持。

收起阅读 »

uniappx中uni.switchTab跳转tabBar页面,url用相对路径报错绝对路径成功

uniappx中uni.switchTab跳转tabBar页面,url用相对路径报错目标页面不是tabBar页面使用绝对路径时可以

uniappx中uni.switchTab跳转tabBar页面,url用相对路径报错目标页面不是tabBar页面使用绝对路径时可以

开发一个定位拍照、打卡的程序,付费形式

外包

开发一个带地图定位拍照、打卡的程序,有偿付费

开发一个带地图定位拍照、打卡的程序,有偿付费

默认了加 count,选项卡字体无法实现变绿色效果,问题是出在哪里

<template>
<view class="home">
<view class="courseIntroduce_box">
<view class="courseIntroduce_des">
<view class="courseIntroduce_info">{{ introduce }}</view>
</view>
<courseIntroduceData :msg="introduceList"/>
<view class="question_line"></view>
<view class="courseIntroduce_tab_box">
<view class="courseIntroduce_tab_nav">
<view v-for="(item,index) in items" :class="{ 'btna':count === index }" @tap="change(index)" :key="index">{{ item }}</view>
</view>
<view class="courseIntroduce_tab_con">
<view class="discount_info" :class="{dis:count === 0}">
内容1
</view>
<view class="discount_info" :class="{dis:count === 1}">
内容2
</view>
</view>
</view>
</view>
</view>
</template>

<script>
import courseIntroduceData from "../../../components/courseIntroduce-data/courseIntroduce-data.vue"
export default {
data() {
return {
introduce:"",
introduceList:[],
items:["课程章节","课程介绍"],
count:0
}
},
components:{
courseIntroduceData
},
onLoad(options) {

        uni.request({  
            url:"https://www.itbaizhan.cn/api/course/detail",  
            data:{  
                id:options.id,  
                course:options.course  
            },  
            success: (res) => {  
                this.introduce = res.data.data.introduce  
                this.introduceList = res.data.data.introduceList  
            }  
        })  
    },  
    methods: {  
        change(index){  
            this.count = index;  
        }  
    }  
}  

</script>

<style lang="scss">
.courseIntroduce_box {
display: flex;
box-sizing: box;
flex-direction: column;
margin-bottom: 90px;

    .courseIntroduce_des {  
        display: flex;  
        box-sizing: border-box;  
        flex-direction: column;  
        justify-content: center;  
        align-items: center;  
        width: 100%;  
        background-color: #0c9c8f;  
        padding: 0 10px 15px;  
        overflow: hidden;  

        .courseIntroduce_info {  
            display: flex;  
            box-sizing: box;  
            width: 100%;  
            color: #fff;  
            font-size: 16px;  
            line-height: 24px;  
        }  
    }  

    .courseIntroduce_tab_box {  
        display: flex;  
        box-sizing: border-box;  
        flex-direction: column;  

        .courseIntroduce_tab_nav {  
            display: flex;  
            box-sizing: border-box;  
            flex-direction: row;  
            background-color: #fff;  
            border-bottom: 1px solid #e4e4e4;  
            margin-bottom: 20px;  

            view {  
                height: 50px;  
                line-height: 50px;  
                font-size: 16px;  
                flex-grow: 1;  
                text-align: center;  
                background-color: #fff;  
            }  
        }  
        .discount_info {  
            display: nome;  
        }  
        .btna {  
            display: flex;  
            box-sizing: border-box;  
            justify-content: center;  
            color: $zhu-color;  
            position: relative;  
        }  
        .btna::after {  
            content: '';  
            width: 40px;  
            height: 3px;  
            background-color: $zhu-color;  
            position: absolute;  
            bottom: 0;  
            left: 50%;  
            margin-left: -20px;  
        }  
        .dis {  
                display: block;  
        }  
    }  
}  

</style>
这个编程运行是这个效果:


我想要的是点课程章节或课程介绍会出现绿色字体效果,哪里有出错:

继续阅读 »

<template>
<view class="home">
<view class="courseIntroduce_box">
<view class="courseIntroduce_des">
<view class="courseIntroduce_info">{{ introduce }}</view>
</view>
<courseIntroduceData :msg="introduceList"/>
<view class="question_line"></view>
<view class="courseIntroduce_tab_box">
<view class="courseIntroduce_tab_nav">
<view v-for="(item,index) in items" :class="{ 'btna':count === index }" @tap="change(index)" :key="index">{{ item }}</view>
</view>
<view class="courseIntroduce_tab_con">
<view class="discount_info" :class="{dis:count === 0}">
内容1
</view>
<view class="discount_info" :class="{dis:count === 1}">
内容2
</view>
</view>
</view>
</view>
</view>
</template>

<script>
import courseIntroduceData from "../../../components/courseIntroduce-data/courseIntroduce-data.vue"
export default {
data() {
return {
introduce:"",
introduceList:[],
items:["课程章节","课程介绍"],
count:0
}
},
components:{
courseIntroduceData
},
onLoad(options) {

        uni.request({  
            url:"https://www.itbaizhan.cn/api/course/detail",  
            data:{  
                id:options.id,  
                course:options.course  
            },  
            success: (res) => {  
                this.introduce = res.data.data.introduce  
                this.introduceList = res.data.data.introduceList  
            }  
        })  
    },  
    methods: {  
        change(index){  
            this.count = index;  
        }  
    }  
}  

</script>

<style lang="scss">
.courseIntroduce_box {
display: flex;
box-sizing: box;
flex-direction: column;
margin-bottom: 90px;

    .courseIntroduce_des {  
        display: flex;  
        box-sizing: border-box;  
        flex-direction: column;  
        justify-content: center;  
        align-items: center;  
        width: 100%;  
        background-color: #0c9c8f;  
        padding: 0 10px 15px;  
        overflow: hidden;  

        .courseIntroduce_info {  
            display: flex;  
            box-sizing: box;  
            width: 100%;  
            color: #fff;  
            font-size: 16px;  
            line-height: 24px;  
        }  
    }  

    .courseIntroduce_tab_box {  
        display: flex;  
        box-sizing: border-box;  
        flex-direction: column;  

        .courseIntroduce_tab_nav {  
            display: flex;  
            box-sizing: border-box;  
            flex-direction: row;  
            background-color: #fff;  
            border-bottom: 1px solid #e4e4e4;  
            margin-bottom: 20px;  

            view {  
                height: 50px;  
                line-height: 50px;  
                font-size: 16px;  
                flex-grow: 1;  
                text-align: center;  
                background-color: #fff;  
            }  
        }  
        .discount_info {  
            display: nome;  
        }  
        .btna {  
            display: flex;  
            box-sizing: border-box;  
            justify-content: center;  
            color: $zhu-color;  
            position: relative;  
        }  
        .btna::after {  
            content: '';  
            width: 40px;  
            height: 3px;  
            background-color: $zhu-color;  
            position: absolute;  
            bottom: 0;  
            left: 50%;  
            margin-left: -20px;  
        }  
        .dis {  
                display: block;  
        }  
    }  
}  

</style>
这个编程运行是这个效果:


我想要的是点课程章节或课程介绍会出现绿色字体效果,哪里有出错:

收起阅读 »