网站网页无障碍

网页无障碍

我找到的git地址:
https://github.com/muzihuaner/assist (打开有点慢 多试几次才能打开 感谢这位muzihuaner开发者的帮助)

可以看看:https://github.com/duheng/assist

无障碍指读无声

在我写的时候 指读没有声音 是因为音频找不到 改了一下assist-entry.js中的
playAudio: function playAudio(text) 方法下的 audio.src。 改成了
audio.src = “https://tts.baidu.com/text2audio?cuid=baike&lan=zh&ctp=1&pdt=301&vol=9&rate=32&per=0&tex=” + encodeURI(text);

参考的是:fyonecon 的 js实现语音播报+html自动播放音频 这篇文章
原文链接:https://blog.csdn.net/weixin_41827162/article/details/106281713
以下为文章内容:

1. js生成语音源(利用百度的TTS):

let str = "测试测试测试测试测试测试测试123测试测试测试测试测试测试123435";
let make_mp3 = "https://tts.baidu.com/text2audio?cuid=baike&lan=zh&ctp=1&pdt=301&vol=9&rate=32&per=0&tex=" + encodeURI(str);
2. js实现自动播放音乐:

Audio标签由于浏览器不允许自动play(),因此,为了实现该功能,只能用AudioContext来实现。参考:https://blog.csdn.net/wo240/article/details/82748474。

另外,Chrome或Safari里面如果还不能正常播放,就得用Edge浏览器(或Edge谷歌内核版)、火狐浏览器等。

以下是自动播放部分的代码:

(mplayer.js下载:备1:https://download.csdn.net/download/weixin_41827162/12447011  备2:https://cdnaliyun.oss-cn-hangzhou.aliyuncs.com/js/mplayer.js)

    // 开源文档https://github.com/haima16/MPlayer
    // 需先引入mplayer.js依赖文件
    let player = new MPlayer(make_mp3, {
        loop: false,
        volume: 1,
        auto: true,
        index: 1,
        analyser: {
            size: 1024,
        }
    });
    player.onload = function() {
        console.log("=开始播放=");
        this.play()
    };
    player.onended = function() {
        console.log("=播放完成=");
 
    };
-

百度语音:

tex 必填 合成的文本,使用UTF-8编码。小于2048个中文字或者英文数字。(文本在百度服务器内转换为GBK后,长度必须小于4096字节)

tok 必填 开放平台获取到的开发者access_token(见上面的“鉴权认证机制”段落)

cuid 必填 用户唯一标识,用来计算UV值。建议填写能区分用户的机器 MAC 地址或 IMEI 码,长度为60字符以内 ctp 必填 客户端类型选择,web端填写固定值1 lan 必填 固定值zh。语言选择,目前只有中英文混合模式,填写固定值zh spd 选填 语速,取值0-15,默认为5中语速 pit 选填 音调,取值0-15,默认为5中语调

vol 选填 音量,取值0-15,默认为5中音量

per(基础音库) 选填 度小宇=1,度小美=0,度逍遥=3,度丫丫=4 per(精品音库) 选填 度博文=106,度小童=110,度小萌=111,度米朵=103,度小娇=5 aue 选填 3为mp3格式(默认); 4为pcm-16k;5为pcm-8k;6为wav(内容同pcm-16k); 注意aue=4或者6是语音识别要求的格式,但是音频内容不是语音识别要求的自然人发音,所以识别效果会受影响。 tex字段2次urlencode 由于urlencode有两个标准 RFC 1738和RFC 3986. 百度为了更好地兼容,支持1次及2次urlencode, 其中2次urlencode可以覆盖全部的特殊字符。因而推荐传递tex 参数时做2次urlencode编码。

-

API:

属性 props

duration 获取音频总时长number
state 获取当前音频的状态,running | suspend
volume 获取当前音量number
loop 获取音频是否循环boolean
auto 是否自动播放boolean
方法 methods

on(type, fn) 绑定事件,type可选值(load | ended),fn回调函数
off(type, fn) 解绑事件,type可选值(load | ended),fn回调函数
emit(type) 手动触发监听事件
getData 获取分析的音频数据,类型Uint8Array,需要开启analyser选项
play 播放音频
pause 暂停播放
toggle 音频状态切换
playPrev 播放上一首
playNext 播放下一首
start(offset) 设置音频开始播放的时刻,offset的范围为0~duration
setLoop(bool) 设置音频是否循环播放
setVolume(val) 设置音频音量,0 ~ 1.0
getCurrentTime 获取当前播放的时长
setOptions(options) 可以统一设置,如:{ loop: true, volume: 0.5 }
事件 events

onload:音频解析完成时触发

onended:音频播放完触发
————————————————
版权声明:本文为CSDN博主「fyonecon」的原创文章
原文链接:https://blog.csdn.net/weixin_41827162/article/details/106281713
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值