在 Android webview 中加载页面时，ResponsiveVoice 不起作用答案

【问题标题】：ResponsiveVoice doesn't work when page is loaded in Android webview在 Android webview 中加载页面时，ResponsiveVoice 不起作用
【发布时间】：2023-03-24 03:38:01
【问题描述】：

当我点击按钮时效果很好：

<!DOCTYPE html>
<html>
<head>


    <script src="https://code.responsivevoice.org/responsivevoice.js"></script>

    </head >

<body>

<button onclick="responsiveVoice.speak('Welcome to the Responsive Voice website');">Click</button>

</body>
</html>

但是当我想在 web 视图中加载页面时播放语音时不起作用：

<!DOCTYPE html>
<html>
<head>

    <script src="https://code.responsivevoice.org/responsivevoice.js"></script>

    </head >

<body>

<script>

   setTimeout(responsiveVoice.speak("Welcome to the Responsive Voice  website"),500);

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

安卓代码：

public void onCreate(Bundle savedInstanceState) {

        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        WebView webView = (WebView) findViewById(R.id.myWebview);
        webView.getSettings().setJavaScriptEnabled(true);
        webView.loadUrl("file:///android_asset/index.html");


    }

清单文件：

<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
    package="com.example.abdallah.test">

    <WebView  xmlns:android="http://schemas.android.com/apk/res/android"
        android:id="@+id/webview"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        />

    <uses-permission android:name="android.permission.INTERNET"/>
    <uses-permission  android:name="android.permission.ACCESS_NETWORK_STATE"/>

    <application
        android:allowBackup="true"
        android:icon="@mipmap/ic_launcher"
        android:label="@string/app_name"
        android:supportsRtl="true"
        android:theme="@style/AppTheme">
        <activity android:name=".MainActivity">
            <intent-filter>
                <action android:name="android.intent.action.MAIN" />

                <category android:name="android.intent.category.LAUNCHER" />
            </intent-filter>
        </activity>
    </application>

</manifest>

这是我点击按钮时的系统日志：

I/chromium: [INFO:CONSOLE(62)] "Voice support NOT ready", source: https://code.responsivevoice.org/responsivevoice.js (62)
I/chromium: [INFO:CONSOLE(62)] "Voice support NOT ready", source: https://code.responsivevoice.org/responsivevoice.js (62)
I/chromium: [INFO:CONSOLE(62)] "Voice support NOT ready", source: https://code.responsivevoice.org/responsivevoice.js (62)
I/chromium: [INFO:CONSOLE(63)] "RV: speechSynthesis present but no system voices found", source: https://code.responsivevoice.org/responsivevoice.js (63)
I/chromium: [INFO:CONSOLE(64)] "RV: Enabling fallback mode", source: https://code.responsivevoice.org/responsivevoice.js (64)
D/MediaResourceGetter: ethernet/wifi connection detected
D/MediaHTTPConnection: filterOutInternalHeaders: key=User-Agent, val= SonyD5803 Build/23.4.A.1.232 stagefright/1.2 (Linux;Android 5.1.1)
D/MediaHTTPConnection: proxy null port 0
D/MediaResourceGetter: resource doesn't have video
D/MediaResourceGetter: extracted valid metadata: MediaMetadata[durationInMilliseconds=0, width=0, height=0, success=true]
E/MediaPlayer-JNI: QCMediaPlayer mediaplayer NOT present
D/MediaPlayer: Couldn't open file on client side, trying server side
D/MediaHTTPConnection: filterOutInternalHeaders: key=User-Agent, val= SonyD5803 Build/23.4.A.1.232 stagefright/1.2 (Linux;Android 5.1.1)
D/MediaHTTPConnection: filterOutInternalHeaders: key=allow-cross-domain-redirect, val= false
D/MediaHTTPConnection: filterOutInternalHeaders: key=x-wap-profile, val= http://uaprof.sonymobile.com/D5803R2321.xml
D/MediaHTTPConnection: proxy null port 0
E/MediaPlayer: Should have subtitle controller already set
D/MediaPlayer: getMetadata

这是我想在页面加载时播放语音：

I/chromium: [INFO:CONSOLE(62)] "Voice support NOT ready", source: https://code.responsivevoice.org/responsivevoice.js (62)
I/chromium: [INFO:CONSOLE(62)] "Voice support NOT ready", source: https://code.responsivevoice.org/responsivevoice.js (62)
I/chromium: [INFO:CONSOLE(62)] "Voice support NOT ready", source: https://code.responsivevoice.org/responsivevoice.js (62)
I/chromium: [INFO:CONSOLE(62)] "Voice support NOT ready", source: https://code.responsivevoice.org/responsivevoice.js (62)
I/chromium: [INFO:CONSOLE(62)] "Voice support NOT ready", source: https://code.responsivevoice.org/responsivevoice.js (62)
I/chromium: [INFO:CONSOLE(63)] "RV: speechSynthesis present but no system voices found", source: https://code.responsivevoice.org/responsivevoice.js (63)
I/chromium: [INFO:CONSOLE(64)] "RV: Enabling fallback mode", source: https://code.responsivevoice.org/responsivevoice.js (64)
D/MediaResourceGetter: ethernet/wifi connection detected
D/MediaHTTPConnection: filterOutInternalHeaders: key=User-Agent, val= SonyD5803 Build/23.4.A.1.232 stagefright/1.2 (Linux;Android 5.1.1)
D/MediaHTTPConnection: proxy null port 0
D/MediaResourceGetter: resource doesn't have video
D/MediaResourceGetter: extracted valid metadata: MediaMetadata[durationInMilliseconds=0, width=0, height=0, success=true]

【问题讨论】：

标签： javascript android webview responsivevoice

【解决方案1】：

ResponsiveVoice 说：

在 iOS 上，某些事件（例如语音合成）需要由用户操作（即点击）触发。例如，这会导致 ResponsiveVoice 语音呼叫在页面加载时不起作用。

使用语音合成，用户触发的操作只需执行一次。第一个之后的进一步直接调用将按预期工作。

因此，建议的最佳做法是在体验中添加一个“开始”按钮供用户单击，并将其用作对 responsiveVoice.speak() 的初始化调用。如果需要，该调用可以有一个空格作为文本，因此对用户没有影响。

我认为android是一样的，但我找到了解决我的问题的方法：

首先，我将加载包含用于文本到语音的 javascript 函数的 html 页面。然后只加载函数本身，如下代码：

final Handler handler=new Handler();
handler.postDelayed(new Runnable() {

                        public void run() {
                            WebView webView = (WebView) findViewById(R.id.myWebview);
                            webView.loadUrl("javascript:speak('" + s + "');");

                        }
                    }, 5000 );

【讨论】：