跳转到内容

MediaWiki:Gadget-AudioText.js:修订间差异

来自电棍ottowiki
第2行: 第2行:
(function() {
(function() {
     mw.hook('wikipage.content').add(function() {
     mw.hook('wikipage.content').add(function() {
        alert("🎉 JS脚本已加载!"); // 1. 脚本加载确认
         document.querySelectorAll('.audio-trigger').forEach(element => {
         document.querySelectorAll('.audio-trigger').forEach(element => {
             element.addEventListener('click', async function(event) {
             element.addEventListener('click', function() {
                 try {
                 alert("🖱️ 点击事件已触发!"); // 2. 点击事件确认
                    event.preventDefault();
               
                   
                const audioFile = element.dataset.audioFile;
                    // === 调试1: 点击事件触发 ===
                alert("📁 音频文件名: " + audioFile); // 3. 显示模板参数
                    alert("🖱️ 点击事件已触发!");
 
                // 构造API请求URL
                const apiUrl = mw.util.wikiScript('api') + '?action=query&titles=' +
                    encodeURIComponent(audioFile) + '&prop=imageinfo&iiprop=url&format=json';
                alert("🔗 即将请求API: \n" + apiUrl); // 4. 显示API地址


                    // 1. 立即创建空音频对象并尝试播放(同步获取用户授权)
                // 发送API请求
                    const audio = new Audio();
                fetch(apiUrl)
                     audio.autoplay = true;
                     .then(response => {
                   
                        alert("📡 API响应状态: " + response.status); // 5. HTTP状态码
                    // === 调试2: 开始获取用户播放权限 ===
                        return response.json();
                    alert("🔑 正在请求播放权限...");
                     })
                     await audio.play().catch(() => {}); // 静默忽略首次错误
                    .then(data => {
                   
                        alert("📦 API返回原始数据: \n" + JSON.stringify(data)); // 6. 原始API数据
                    // 2. 异步获取真实音频URL
                       
                    const audioFile = element.dataset.audioFile;
                        const pages = data.query.pages;
                    const apiUrl = mw.util.wikiScript('api') + '?action=query&titles=' +
                        const pageId = Object.keys(pages)[0];
                         encodeURIComponent(audioFile) + '&prop=imageinfo&iiprop=url&format=json';
                        const audioUrl = pages[pageId].imageinfo[0].url;
                         alert("🎵 解析出的音频URL: \n" + audioUrl); // 7. 最终音频地址


                    // === 调试3: 显示API请求URL ===
                        // 尝试播放
                    alert("🌐 请求API:\n" + apiUrl);
                        const audio = new Audio(audioUrl);
                   
                        audio.play()
                    const response = await fetch(apiUrl);
                            .then(() => alert("✅ 播放成功!"))
                    const data = await response.json();
                            .catch(e => alert("❌ 播放失败: " + e.message)); // 8. 播放结果
                   
                     })
                    // === 调试4: 显示原始API响应 ===
                     .catch(error => {
                    alert("📦 API原始数据:\n" + JSON.stringify(data).slice(0, 200) + "...");
                        alert("💥 发生严重错误: " + error.message); // 9. 全局错误捕获
                   
                     });
                    const pages = data.query.pages;
                    const pageId = Object.keys(pages)[0];
                    const audioUrl = pages[pageId].imageinfo[0].url;
                   
                    // === 调试5: 显示解析后的URL ===
                    alert("🎵 获得音频地址:\n" + audioUrl);
                   
                    // 3. 替换音频源并播放
                     audio.src = audioUrl;
                     await audio.play();
                   
                    // === 调试6: 播放成功反馈 ===
                    alert("✅ 播放成功!");
                } catch (error) {
                    // === 调试7: 错误捕获 ===
                     alert(`❌ 发生错误:\n${error.name}: ${error.message}`);
                }
             });
             });
         });
         });
     });
     });
})();
})();

2025年5月24日 (六) 22:35的版本

// MediaWiki:Gadget-AudioText.js
(function() {
    mw.hook('wikipage.content').add(function() {
        alert("🎉 JS脚本已加载!"); // 1. 脚本加载确认

        document.querySelectorAll('.audio-trigger').forEach(element => {
            element.addEventListener('click', function() {
                alert("🖱️ 点击事件已触发!"); // 2. 点击事件确认
                
                const audioFile = element.dataset.audioFile;
                alert("📁 音频文件名: " + audioFile); // 3. 显示模板参数

                // 构造API请求URL
                const apiUrl = mw.util.wikiScript('api') + '?action=query&titles=' + 
                    encodeURIComponent(audioFile) + '&prop=imageinfo&iiprop=url&format=json';
                alert("🔗 即将请求API: \n" + apiUrl); // 4. 显示API地址

                // 发送API请求
                fetch(apiUrl)
                    .then(response => {
                        alert("📡 API响应状态: " + response.status); // 5. HTTP状态码
                        return response.json();
                    })
                    .then(data => {
                        alert("📦 API返回原始数据: \n" + JSON.stringify(data)); // 6. 原始API数据
                        
                        const pages = data.query.pages;
                        const pageId = Object.keys(pages)[0];
                        const audioUrl = pages[pageId].imageinfo[0].url;
                        alert("🎵 解析出的音频URL: \n" + audioUrl); // 7. 最终音频地址

                        // 尝试播放
                        const audio = new Audio(audioUrl);
                        audio.play()
                            .then(() => alert("✅ 播放成功!"))
                            .catch(e => alert("❌ 播放失败: " + e.message)); // 8. 播放结果
                    })
                    .catch(error => {
                        alert("💥 发生严重错误: " + error.message); // 9. 全局错误捕获
                    });
            });
        });
    });
})();