如何在GWT客户端应用启动时自动播放音频

现代浏览器出于防骚扰的安全策略，会拦截无用户交互触发的自动音频播放，这就是你遇到必须点击窗口后音频才能播放的核心原因。目前没有完全绕过该策略的纯程序化手段（浏览器会直接阻止此类操作），但可以通过监听用户首次交互事件，在用户与页面发生任何交互时自动触发音频播放，这是符合规范的可行方案。

实现代码示例 #

import com.google.gwt.core.client.EntryPoint;
import com.google.gwt.media.client.Audio;
import com.google.gwt.user.client.Window;
import com.google.gwt.user.client.event.ClickEvent;
import com.google.gwt.user.client.event.ClickHandler;
import com.google.gwt.user.client.event.KeyDownEvent;
import com.google.gwt.user.client.event.KeyDownHandler;
import com.google.gwt.user.client.event.ScrollEvent;
import com.google.gwt.user.client.event.ScrollHandler;

public class YourEntryPoint implements EntryPoint {
    private Audio mistakeAudio;
    private boolean hasPlayed = false;

    @Override
    public void onModuleLoad() {
        // 初始化音频对象
        mistakeAudio = Audio.createIfSupported();
        if (mistakeAudio != null) {
            mistakeAudio.setSrc("waves/Gong.wav");
            mistakeAudio.load();
            mistakeAudio.setLoop(true);

            // 监听多种用户交互事件，确保首次交互时触发播放
            Window.addWindowClickListener(new ClickHandler() {
                @Override
                public void onClick(ClickEvent event) {
                    tryPlayAudio();
                }
            });
            Window.addKeyDownHandler(new KeyDownHandler() {
                @Override
                public void onKeyDown(KeyDownEvent event) {
                    tryPlayAudio();
                }
            });
            Window.addWindowScrollHandler(new ScrollHandler() {
                @Override
                public void onWindowScroll(ScrollEvent event) {
                    tryPlayAudio();
                }
            });
        }
    }

    private void tryPlayAudio() {
        if (!hasPlayed && mistakeAudio != null) {
            mistakeAudio.play();
            hasPlayed = true;
            // 播放成功后移除所有监听，避免重复触发
            Window.removeWindowClickListener(Window.getWindowClickListener());
            Window.removeKeyDownHandler(Window.getKeyDownHandler());
            Window.removeWindowScrollHandler(Window.getWindowScrollHandler());
        }
    }
}

说明 #

• 该方案会在用户首次与页面发生交互（点击、按键、滚动）时自动播放音频，无需用户特意点击指定按钮
• 播放触发后会移除所有交互监听，避免后续操作重复触发播放
• 这是目前唯一符合浏览器安全规范的实现方式，任何试图跳过用户交互的手段都会被浏览器的自动播放拦截机制阻止

内容的提问来源于stack exchange，提问作者RG01