vue 对接有道文本翻译(生成单词语音)
1.先附上有道产品文档地址
https://ai.youdao.com/DOCSIRMA/html/%E8%87%AA%E7%84%B6%E8%AF%AD%E8%A8%80%E7%BF%BB%E8%AF%91/API%E6%96%87%E6%A1%A3/%E6%96%87%E6%9C%AC%E7%BF%BB%E8%AF%91%E6%9C%8D%E5%8A%A1/%E6%96%87%E6%9C%AC%E7%BF%BB%E8%AF%91%E6%9C%8D%E5%8A%A1-API%E6%96%87%E6%A1%A3.html
链接地址右下方有 js demon,下面粘贴一份:
<!doctype html> <head> <meta charset="utf-8"/> </head> <body> <div>可打开浏览器控制台查看结果</div> <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script> <script src="https://cdn.bootcdn.net/ajax/libs/crypto-js/4.0.0/crypto-js.js"></script> <script type="text/javascript"> var appKey = \'\'; var key = \'\';//注意:暴露appSecret,有被盗用造成损失的风险 var salt = (new Date).getTime(); var curtime = Math.round(new Date().getTime()/1000); var query = \'您好,欢迎再次使用有道智云文本翻译API接口服务\'; // 多个query可以用\n连接 如 query=\'apple\norange\nbanana\npear\' var from = \'zh-CHS\'; var to = \'en\'; var str1 = appKey + truncate(query) + salt + curtime + key; var vocabId = \'您的用户词表ID\'; //console.log(\'---\',str1); var sign = CryptoJS.SHA256(str1).toString(CryptoJS.enc.Hex); $.ajax({ url: \'http://openapi.youdao.com/api\', type: \'post\', dataType: \'jsonp\', data: { q: query, appKey: appKey, salt: salt, from: from, to: to, sign: sign, signType: "v3", curtime: curtime, vocabId: vocabId, }, success: function (data) { console.log(data); } }); function truncate(q){ var len = q.length; if(len<=20) return q; return q.substring(0, 10) + len + q.substring(len-10, len); } </script> </body>
具体参数注释产品文档有详细介绍,这里就不多解释了,来看看还需准备什么 appKey 和 key
2.登录注册有道智云AI开放平台—->控制台—->创建应用,如下图
创建应用成功,先别着急用,需要再绑定语音合成功能,否则会报 110 错误,点击修改选取如下:
修改成功之后就可以用了,如下图:appKey=应用ID
key = 应用秘钥
但是!!!!提供的demon并不适合vue项目重复调用,需要封装,代码如下:
import $ from \'jquery\'
import CryptoJS from \'./CryptoJS.js\'
var appKey = \'应用ID
\';
var key = \'应用秘钥\'; //注意:暴露appSecret,有被盗用造成损失的风险
var from = \'en\';
var to = \'en\';
var vocabId = \'\'; //您的用户词表ID
// 多个query可以用\n连接 如 query=\'apple\norange\nbanana\npear\'
function getMp3Url(query) {
let salt = (new Date).getTime();
let curtime = Math.round(new Date().getTime() / 1000);
var str1 = appKey + truncate(query) + salt + curtime + key;
var sign = CryptoJS.SHA256(str1).toString(CryptoJS.enc.Hex);
return new Promise((resolve, reject) => {
$.ajax({
url: \'https://openapi.youdao.com/api\',
type: \'post\',
dataType: \'jsonp\',
data: {
q: query,
appKey: appKey,
salt: salt,
from: from,
to: to,
sign: sign,
signType: "v3",
curtime: curtime,
vocabId: vocabId,
voice: \'0\'
},
success: function(data) {
resolve(data)
},
fail(err) {
reject(err)
}
});
})
}
function truncate(q) {
var len = q.length;
if (len <= 20) return q;
return q.substring(0, 10) + len + q.substring(len - 10, len);
}
export default getMp3Url
使用方法:
全局挂载
import youdao from \'./assets/js/youdao.js\'
app.config.globalProperties.$getMp3Url = youdao
页面使用:
this.$getMp3Url(\'需要传入的单词\').then((res) => {
});
加密库CryptoJS.js文件下载地址:
链接: https://pan.baidu.com/s/1NH-IRCdywMEaMA5K8J87Tw 提取码: gtbp 复制这段内容后打开百度网盘手机App,操作更方便哦