我要评论1: ①:需求 : 边说话边翻译成汉字
②:需求效果图(阿里云的示例,无代码) :
2: 实现流程: 点击话筒 初始化websocket , 调起 麦克风 , 获取语音 实时发送, 拿到返回的 汉字处理成数组遍历展示出来.
3:用到的主要技术: websocket, js-audio-recorder
4:遇到的问题:
①:本地运行代码, 调不起麦克风, 一直报 getusermedia 找不到 ! 如图:
原因: 浏览器不支持http开头的路径，认为这个路径不安全，只支持file:,https:,http://localhost
解决办法：浏览器地址栏输入: chrome://flags/#unsafely-treat-insecure-origin-as-secure按下图配置:
②: websocket 一直会断联 ! 目前我遇到的原因有两个:
a: 刚连上就直接断联, 是因为没有实时语音发送过去
b: 链接一段时间 ,也返回了 语音转换后的汉字, 但 不到 1分钟 又断联了 , 原因是: 语音发送太快,语音文件太大 .
各种试, 自己没解决掉这种问题, 因为js-audio-recorder插件没提供 截取音频 合并音频等方法.
最后是 后端 修改了 js-audio-recorder 的底层 recorder.js文件,然后 用引入的方式 放到本地用
(修改的逻辑就是 : 不把 语音整段(会议开始---->会议结束)发送过去, 看底层代码,可以看出 他是把 每段录制到的语音整合成一个文件发过去的,这样文件会过大,导致websocket 自己断联, 直接修改掉他整合的代码, 每次都给清空掉, 可自行看代码)
如下: (可以拷去,按需修改)
/*!
*
* js-audio-recorder - js audio recorder plugin
*
* @version v1.0.7
* @homepage https://github.com/2fps/recorder
* @author 2fps <echoweb@126.com> (https://www.zhuyuntao.cn)
* @license mit
*
*/
!function (t, e) {
"object" == typeof exports && "object" == typeof module ? module.exports = e() : "function" == typeof define && define.amd ? define([], e) : "object" == typeof exports ? exports.recorder = e() : t.recorder = e()
}
(this, function () {
return function (t) {
var e = {
};
function n(i) {
if (e[i])
return e[i].exports;
var o = e[i] = {
i: i,
l: !1,
exports: {
}
};
return t[i].call(o.exports, o, o.exports, n),
o.l = !0,
o.exports
}
return n.m = t,
n.c = e,
n.d = function (t, e, i) {
n.o(t, e) || object.defineproperty(t, e, {
enumerable: !0,
get: i
})
},
n.r = function (t) {
"undefined" != typeof symbol && symbol.tostringtag && object.defineproperty(t, symbol.tostringtag, {
value: "module"
}),
object.defineproperty(t, "__esmodule", {
value: !0
})
},
n.t = function (t, e) {
if (1 & e && (t = n(t)), 8 & e)
return t;
if (4 & e && "object" == typeof t && t && t.__esmodule)
return t;
var i = object.create(null);
if (n.r(i), object.defineproperty(i, "default", {
enumerable: !0,
value: t
}), 2 & e && "string" != typeof t)
for (var o in t)
n.d(i, o, function (e) {
return t[e]
}
.bind(null, o));
return i
},
n.n = function (t) {
var e = t && t.__esmodule ? function () {
return t.default
}
: function () {
return t
};
return n.d(e, "a", e),
e
},
n.o = function (t, e) {
return object.prototype.hasownproperty.call(t, e)
},
n.p = "",
n(n.s = 1)
}
([function (t, e, n) {
"use strict";
function i(t, e, n) {
for (var i = 0; i < n.length; i++)
t.setuint8(e + i, n.charcodeat(i))
}
object.defineproperty(e, "__esmodule", {
value: !0
}),
e.compress = function (t, e, n) {
for (var i = e / n, o = math.max(i, 1), r = t.left, a = t.right, s = math.floor((r.length + a.length) / i), u = new float32array(s), c = 0, l = 0; c < s; ) {
var f = math.floor(l);
u[c] = r[f],
c++,
a.length && (u[c] = a[f], c++),
l += o
}
return u
},
e.encodepcm = function (t, e, n) {
void 0 === n && (n = !0);
var i = 0,
o = t.length * (e / 8),
r = new arraybuffer(o),
a = new dataview(r);
if (8 === e)
for (var s = 0; s < t.length; s++, i++) {
var u = (c = math.max(-1, math.min(1, t[s]))) < 0 ? 128 * c : 127 * c;
u = +u + 128,
a.setint8(i, u)
}
else
for (s = 0; s < t.length; s++, i += 2) {
var c = math.max(-1, math.min(1, t[s]));
a.setint16(i, c < 0 ? 32768 * c : 32767 * c, n)
}
return a
},
e.encodewav = function (t, e, n, o, r, a) {
void 0 === a && (a = !0);
var s = n > e ? e : n,
u = r,
c = new arraybuffer(44 + t.bytelength),
l = new dataview(c),
f = o,
p = 0;
i(l, p, "riff"),
p += 4,
l.setuint32(p, 36 + t.bytelength, a),
i(l, p += 4, "wave"),
i(l, p += 4, "fmt "),
p += 4,
l.setuint32(p, 16, a),
p += 4,
l.setuint16(p, 1, a),
p += 2,
l.setuint16(p, f, a),
p += 2,
l.setuint32(p, s, a),
p += 4,
l.setuint32(p, f * s * (u / 8), a),
p += 4,
l.setuint16(p, f * (u / 8), a),
p += 2,
l.setuint16(p, u, a),
i(l, p += 2, "data"),
p += 4,
l.setuint32(p, t.bytelength, a),
p += 4;
for (var d = 0; d < t.bytelength; )
l.setuint8(p, t.getuint8(d)), p++, d++;
return l
}
}, function (t, e, n) {
"use strict";
var i,
o = this && this.__extends || (i = function (t, e) {
return (i = object.setprototypeof || {
__proto__: []
}
instanceof 
发表评论