每天进步一点点:网页播放音乐


虽然家里在香蕉派上设置了一个报警器,但是毕竟不便携带。当然了,如果不懒的话,我可以把他做成一个盒子,无论到哪里接上网络就可以使用,但是一个懒字道尽一切。


(图源 :pixabay)

然而出门在外,没有报警器的日子,心里没底。其实安信可(Ai-Thinker) GPRS+GSM A9开发板加SIM卡也可以搞定这事,不过涉及硬件的东西总要调试一下。

那么就有没有其它办法呢?想了一下,其实完全可以用网页搞定嘛,实现思路也超级简单,在PHP中做一些检查,发现系统故障时,播放报警音。

播放声音

要实现上述功能,首先要学习的是如何在网页中嵌入声音,嵌入声音其实还是很简单的啦,我大致了解一下,至少有两种方法。

在HTML5中引入了新的标签<audio>,所以在网页中加入如下代码即可:

<audio id="audio" src="http://www.xxx.com/test.mp3" ></audio>

这样网页加载后就会自动播放指定的音乐🎵。

除了<audio>外,还可以使用<embed>标签,也是HTML5中引入的新标签哦,使用起来也非常简单:

<embed src="http://www.xxx.com/test.mp3" width="0" >

浏览器问题

上述两组代码,在我自己的电脑上测试,在Microsoft EDGE浏览器中可以正常的播放声音,在Firefox中被阻止🚫,在Chrome中没啥效果。

火狐中可以通过设置来解除阻止:

其实我觉得通过设置都可以搞定,不过毕竟是自己用,有一个浏览器好用就行了。

自动刷新

将上述代码插入到我的PHP代码中,并加入一些判断,就可以解决报警的问题了。

不过我要是自己不断访问网页,等它报警,也就没有什么意义了,所以加入自动刷新还是很有必要的。

在HTML头部插入如下代码就可以啦:

``

自此,一个网页版的自动报警器就搞定了,无论到那,我只要在笔记本上打开网页,然后就可以该做啥做啥啦,如果有故障发生,网页就会给我自动播放音乐啦。

虽然解决的方法很简单,但是能解决问题就好啦。

相关链接


Vote For Me As Witness
https://steemit.com/~witnesses type in oflyhigh and click VOTE

Vote @oflyhigh via Steemconnect
Thank you!

Comments 2


Thank you so much for participating in the Partiko Delegation Plan Round 1! We really appreciate your support! As part of the delegation benefits, we just gave you a 3.20% upvote! Together, let’s change the world!

03.10.2019 13:30
0

!thumbup
恭喜你!您的这篇文章入选 @justyy 今日 (2019-10-04) 榜单 【优秀的文章】, 回复本条评论24小时内领赏,点赞本评论将支持 @dailychina 并增加将来您的奖赏。
@justyy 是CN区的见证人,请支持他,给他投票,或者设置justyy为见证人代理。感谢!@justyy的主要贡献:https://steemyy.com

Congratulations! This post has been selected by @justyy as today's (2019-10-04) 【Good Posts】, Steem On! Reply to this message in 24 hours to get rewards. Upvote this comment to support the @dailychina and increase your future rewards! ^_^

SteemIt 工具、API接口、机器人和教程
SteemIt Tools, Bots, APIs and Tutorial



If you believe what I am doing, please consider a spare vote voting me here, thank you very much indeed.

@justyy - the author of https://SteemYY.com and I have been a Steem Witness for more than a year now.

04.10.2019 08:02
12