pywebview 通过 JSBridge 调用 TTS

belldeep

已于 2023-09-03 12:17:38 修改

阅读量485

点赞数

分类专栏： python 文章标签： python pywebview cef tts

于 2023-08-26 12:16:22 首次发布

本文链接：https://blog.csdn.net/belldeep/article/details/132510092

版权

python 专栏收录该内容

207 篇文章 22 订阅

订阅专栏

pip install pywin32 ;

pip install pywebview ; 通过 JSBridge 调用本机 TTS

pip install cefpython3
cefpython3-66.1-py2.py3-none-win_amd64.whl (69.0 MB)
Successfully installed cefpython3-66.1

编写 pywebview_tts.py 如下

# -*- coding: utf-8 -*-
""" pywebview 和 http交互的例子 """
import os
import webview
import pygame
import win32com.client  # TTS
sapi = win32com.client.Dispatch("SAPI.SpVoice")

#pygame.init()
pygame.mixer.init()

os.chdir('/mdict/doc')

class Api:
    """ pywebview Api """
    def speak(self,txt):
        """ text TTS """
        if txt.strip() !='':
            sapi.Speak(txt)

    def mplay(self,filename):
        """播放.mp3"""
        if pygame.mixer.music.get_busy():
            print("mixer.music.get_busy")
            return 1
        if not os.path.exists(filename):
            print(f"{filename} not found.")
            return 2
        fn,ext = os.path.splitext(filename)
        if ext.lower() == '.mp3':
            pygame.mixer.music.load(filename)
            pygame.mixer.music.play()
        else:
            print(f"{filename} is not .mp3")
            return 3
        return 0


if __name__ == '__main__':
    api = Api()
    window = webview.create_window('JSBridge 调用TTS示例',
                            url="http://localhost:8888/", 
                            js_api=api, width=1000, height=800)
    webview.start(gui='cef', debug=True)

编写 index3.html 如下

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">   
    <title>查询英汉词典</title> 
    <script src="jquery-3.2.1.min.js"></script>
<style>
/* portrait 判断为竖屏 */
@media only screen and (orientation: portrait){
     #lab1 {display:none;}
} 
/* landscape 判断为横屏 */ 
@media only screen and (orientation: landscape){
     #lab1 {display: ;} 
}    
</style>
</head>
<body>
  <form name="form" id="form" action="trans" method="POST" target="iframe">
    <label id="lab1">请输入：</label>
    <input type="text" name="txt" id='txt' size="30" placeholder="请输入 a word">
    <input type="submit" name="eng_han" value="英译汉">
    <input type="button" name="btn1" id="btn1" value="前缀查询">
    <input type="button" name="btn2" id="btn2" value="TTS读音" onclick="tts2();">
  </form>
  <p></p>
<div style="float:left; width:100%;">
  <div id="result" style="float:left; width:80%; height:400; border:2px;">
    <iframe name="iframe" id="iframe" width="100%" height="400"> </iframe>
  </div>
  <div id="alist" style="float:right; width:20%; height:400; border:2px;">
  </div>
</div>
  
  <script type="text/javascript">
    $(function(){
      $("#btn1").click(function(){
        $.getJSON("/prefix?txt="+$("#txt").val(), function(data){
          var items = [];
          $.each(data, function(i, item){
            if (i<=20){
              items[i] = '<a href="/trans?txt=' +item+ '" target="iframe">' +item+ "</a><br>";
            }
          });
          var a = items.join('\n');
          if (a) $('#alist').html(a);
        })
      })
    });
    // pywebview
    window.addEventListener('pywebviewready', function(){
        console.log('pywebview is ready');
    })
    // TTS
    function tts() {
        var txt = document.getElementById('txt').value;
        if (txt.length >1) {
            pywebview.api.speak(txt).then((response)=>{
                console.log(response);
            });
        }
    }

    // 屏幕双击取词
    function tts2() {
        // 获取iframe里的选择内容
        var select = window.frames['iframe'].getSelection();
        var txt = select.toString();
        if (txt.length >1) { // alert(txt);
          var input = document.getElementById('txt');
          input.value = txt.trim();
          pywebview.api.speak(txt).then((response)=>{
            console.log(response);
          });       
        } else {
          tts();
        }
    }

  </script> 
</body>
</html>

web 服务程序参见: python：mdict + bottle = web 查询英汉词典

记得：将其中 index.html 改为 index3.html

先运行 python mdict_bottle.py , 再运行 python pywebview_tts.py

belldeep

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
pywebview 通过 JSBridge 调用 TTS

pywebview 通过 JSBridge 调用本机 TTS；屏幕双击取词，TTS发音。先运行 mdict_bottle.py , 再运行 pywebview_tts.py
复制链接

扫一扫