NFC 音乐墙 (不限手机)[web 接口服务实现-折腾记录]

这篇具有很好参考价值的文章主要介绍了NFC 音乐墙 (不限手机)[web 接口服务实现-折腾记录]。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

功能简介:

手机读取 NFC 标签 (标签内容为:内网 url),点击 url 直接播放 本地音乐【勾选默认打开方式可以实现 “一触即放“ 的效果】

功能演示地址:NFC 音乐墙 (不限手机)[web 接口服务实现-折腾成果演示]_哔哩哔哩_bilibili

源码地址:NFC音乐墙: Java web 实现接口播放本地音乐


目录

一、具体背景

二、技术分析

三、代码实现

四、个人电脑部署流程


一、具体背景

前些天刷抖音,刷到了最近很火的 diy 音乐墙:就是将喜欢的音乐专辑打印出来,然后在背面贴上 NFC 标签,最后添加手机的快捷指令,实现一碰专辑照片就能自动播放音乐的功能,如下图:

NFC 音乐墙 (不限手机)[web 接口服务实现-折腾记录]

抖音链接:https://v.douyin.com/r1vQn55/https://v.douyin.com/r1vQn55/

二、技术分析

看完这个小视频我也非常想弄一面属于自己的音乐墙,毕竟生活需要点仪式感嘛,所以我就认真的看了几遍这个视频,打算自己也跟着弄一下。但在研究具体的操作过程中,发现了几点自己和视频博主使用需求不太一样的地方:

① 我用的是小米civi(不是苹果,也没有快捷指令)

② 视频中音乐是存储在手机中的,换了手机就用不了了

【先声明一下哈,此博文为个人折腾记录,就是发现了好玩的东西,然后用自己的方式来捣弄了一下,满足一下个人好奇心,顺便记录一下而已,完全没有任何冒犯的意思。如果您喜欢折腾的话,欢迎来评论区交流。还有就是我个人技术一般般,大哥们要喷的话请轻点喷。最后最重要的一点是,如果您不爱折腾的话,直接点上面的抖音链接,看看人家的效果就行,就不建议往下看了】

针对我的个人需求,我查了一下资料,也在抖音里找了其它的实现方式。发现了也有不限手机的实现方法:就是使用网易云(xxx.126.net/music.163.com)/酷狗(t4.kugou.com)等平台的音乐分享链接,在手机 nfc 读取到链接后,使用浏览器打开链接,再点击播放音乐,来实现效果。【这个方案大家也可以试一下,毕竟我下面记录的方法是真的很复杂】

上面的实现方式其实已经几乎满足需求了,但我还想播放本地的音乐,而且抖音上也有播放本地音乐的需求,所以都已经折腾了,干脆折腾到底吧。废话了这么多,终于讲到了我的实现方式:写一个服务(程序),提供播放音乐的接口,nfc 读取完标签后,跳转直接播放音乐。

和上面音乐平台分析链接的区别:

① 点击此链接直接就会播放音乐,无需跳转后再点击播放按键才开始播放音乐

② 播放的是本地音乐,即存储在电脑里的音乐,操作灵活性大(没有音乐平台链接有会员权限问题)

看一下效果:(上面有视频链接)

触碰直接跳转,直接播放音乐,同时显示:playing music:xxx

NFC 音乐墙 (不限手机)[web 接口服务实现-折腾记录]

显示正在播放的音乐  

NFC 音乐墙 (不限手机)[web 接口服务实现-折腾记录]

后台显示播放音乐接口被调用,且播放的音乐为:xxx

NFC 音乐墙 (不限手机)[web 接口服务实现-折腾记录]

三、代码实现

我的思路是:提供一个播放音乐的接口,接口参数为要播放歌曲的名字(例如:http://localhost:8080/play?name=句号-邓紫棋),只要打开此接口 url,后台服务就会去找本地的音乐文件,然后使用播放音乐的对象播放,流程如图:

NFC 音乐墙 (不限手机)[web 接口服务实现-折腾记录] 技术架构:Spring Boot + Maven

  1. Controller 层

@RestController
public class MusicPlayerController {
​
    private static final Logger log = LoggerFactory.getLogger(MusicPlayerController.class);
​
    @Autowired
    MusicPlayer musicPlayer;
​
    @GetMapping("/play")
    public ResponseEntity<String> playMusic(String name) throws Exception {
        log.info("play music : {}", name);
        musicPlayer.playMusic(name);
        return ResponseEntity.ok("playing music :" + name);
    }
​
    @GetMapping("/stop")
    public ResponseEntity<String> stopPlaying() {
        log.info("stop playing music");
        musicPlayer.stopMusic();
        return ResponseEntity.ok("stop playing music");
    }
}

2. Service 层

@Service
public class MusicPlayerImpl implements MusicPlayer {
​
    /**
     * 参考:Java 播放MP3
     * https://blog.csdn.net/qq_34814092/article/details/80889813
     *
     * @param musicInfo
     * @throws Exception
     */
    @Async
    @Override
    public void playMusic(String musicInfo) throws Exception {
        File file = new File("C:\\yuyu\\music\\" + musicInfo + ".mp3");
        FileInputStream stream = new FileInputStream(file);
        Player player = PlayerInstance.getPlayerInstance();
        if (player == null) {
            PlayerInstance.setPlayerInstance(stream);
            player = PlayerInstance.getPlayerInstance();
            player.play();
        } else {
            player.close();
            PlayerInstance.setPlayerInstance(stream);
            player = PlayerInstance.getPlayerInstance();
            player.play();
        }
    }
​
    @Override
    public void stopMusic() {
        Player player = PlayerInstance.getPlayerInstance();
        player.close();
    }
}

核心的服务在这一部分,这里有三个问题:

① 怎么用 Java 播放 MP3 音乐?

参考:Java 播放MP3_深色風信子的博客-CSDN博客_java播放音频文件

使用 Google 的 mp3spi

② 怎么保证只有一个音乐在播放,即怎么能实现切歌的功能?

单独定义了一个实例对象类,每次调用 playMusic 和 stopMusic 方法时都只调用同一个对象

serivce 层

Player player = PlayerInstance.getPlayerInstance();
if (player == null) {
    PlayerInstance.setPlayerInstance(stream);
    player = PlayerInstance.getPlayerInstance();
    player.play();
} else {
    player.close();
    PlayerInstance.setPlayerInstance(stream);
    player = PlayerInstance.getPlayerInstance();
    player.play();
}

实例对象 PlayerInstance

public class PlayerInstance {
​
    private static final Logger log = LoggerFactory.getLogger(PlayerInstance.class);
​
    public static Player player;
​
    public static Player getPlayerInstance() {
        return player;
    }
​
    public static void setPlayerInstance(FileInputStream stream) {
        try {
            player = new Player(stream);
        } catch (JavaLayerException e) {
            log.error("set player instance error", e);
        }
    }
}

③ 怎么在播放音乐的同时,立刻返回信息给用户?

因为播放音乐是耗时的操作,所以如果不处理,请求就会超时。即还在播放音乐,但页面显示访问超时。

解决方案:异步。具体实现是:将播放音乐的 service 方法设置成异步执行,controller 层在调用播放音乐的方法后,能立刻返回消息。

参考:SpringBoot 如何实现异步编程_榔娃的博客-CSDN博客_springboot 异步

在 playMusic( ) 方法添加注解 @Async

@Async
@Override
public void playMusic(String musicInfo) throws Exception {
    File file = new File("C:\\yuyu\\music\\" + musicInfo + ".mp3");
    FileInputStream stream = new FileInputStream(file);
    Player player = PlayerInstance.getPlayerInstance();
    if (player == null) {
        PlayerInstance.setPlayerInstance(stream);
        player = PlayerInstance.getPlayerInstance();
        player.play();
    } else {
        player.close();
        PlayerInstance.setPlayerInstance(stream);
        player = PlayerInstance.getPlayerInstance();
        player.play();
    }
}

完整代码链接:NFC音乐墙: Java web 实现接口播放本地音乐

四、个人电脑部署流程

这一部分是为想折腾的小伙伴准备的,但整个过程比较麻烦,安装 jdk 也稍微有点风险,建议完全不懂电脑环境配置的小伙伴就别折腾了,现在离开还来得及。然后本文只是我自己捣弄的记录,代码也比较简单(就是说 bug 比较多),所以非常不建议小白尝试,多刷会抖音不更香吗。

前提条件:

① 电脑、手机连着同一个 WiFi;

② 电脑需要有 jdk8 环境

(安装教程:win10中jdk安装详细安装过程:win10中jdk安装详细安装过程_默默爬行的虫虫的博客-CSDN博客_win10安装jdk;win10安装JDK8:win10安装JDK8 - 哔哩哔哩)

具体部署流程:

1、先确认 jdk8 环境没有问题。

win + R 键 --> 输入 : cmd 打开命令行窗口

NFC 音乐墙 (不限手机)[web 接口服务实现-折腾记录]

输入指令 java -version,正常会显示如下 :

NFC 音乐墙 (不限手机)[web 接口服务实现-折腾记录]

2、下载我打包好的 jar 包 (地址:package/music-play-0.0.1.jar · 欲伯先煜仔/NFC音乐墙 - Gitee.com),并放到一个指定的路径下。例如我放到 C盘 的 test 文件夹下:

NFC 音乐墙 (不限手机)[web 接口服务实现-折腾记录]

3、新建一个存放音乐的文件夹,位置为:C:\music (这个位置是固定的,因为是程序里写的)

如果用我打包好的 jar 包,存放音乐的文件夹的路径必须是 C:\music !!!

NFC 音乐墙 (不限手机)[web 接口服务实现-折腾记录]

4、写一个.bat 文件,目的是可以双击运行 Java 程序

效果:NFC 音乐墙 (不限手机)[web 接口服务实现-折腾记录]

步骤:

① 新建一个文本文档

NFC 音乐墙 (不限手机)[web 接口服务实现-折腾记录]

② 打开文本文档并复制如下内容(如果下载的 jar 包,存放的路径和我一样,可以直接复制,不一样的将下面的路径改成你自己的路径就行)

cd C:\test
​
java -jar music-play-0.0.1.jar

③ 修改文本文档名字和后缀:playMusic.bat

NFC 音乐墙 (不限手机)[web 接口服务实现-折腾记录]

5、查看并记住电脑的 IP 地址

win + R 键 --> 输入 : cmd 打开命令行窗口

NFC 音乐墙 (不限手机)[web 接口服务实现-折腾记录]

输入指令 ipconfig

NFC 音乐墙 (不限手机)[web 接口服务实现-折腾记录]

 NFC 音乐墙 (不限手机)[web 接口服务实现-折腾记录]

可以看到当前我电脑的 IP 为 192.168.31.63 (这个 IP 是家里路由器分配的)

6、双击上面第四步写好的 .bat 文件,疯狂右击一下(右键以管理员权限运行)程序才能正常运行,正常运行如下图:

NFC 音乐墙 (不限手机)[web 接口服务实现-折腾记录]

7、播放音乐的接口

http://192.168.31.63:8080/play?name=邓紫棋-句号

192.168.31.63 -> ip 地址为上面查的电脑的IP地址

邓紫棋-句号 -> 歌名,为上面存在 C:\music 路径下的歌名

8、停止播放音乐的接口(或者直接关掉上面的黑框,直接关掉程序)

http://192.168.31.63:8080/stop

9、把网址复制到浏览器并访问,显示 playing music:xxx ,并开始播放音乐,说明服务部署成功

NFC 音乐墙 (不限手机)[web 接口服务实现-折腾记录]

10、最后一步就是将上面的地址(例:http://192.168.31.63:8080/play?name=邓紫棋-句号)写进nfc 标签

11、标签写完之后,就可以使用连着同一个WiFi的带nfc的手机去:碰图听音了。

收藏一个在线转 gif 的网站:Convertio — 文件转换器文章来源地址https://www.toymoban.com/news/detail-454588.html

到了这里,关于NFC 音乐墙 (不限手机)[web 接口服务实现-折腾记录]的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

  • 基于XML的Web服务Java接口(JAX-WS)、Jakarta XML Web Services Eclipse 实现

    JAX-WS(Java API for XML-Based Web Services),是创建web服务的Java编程接口,特别是SOAP服务。是Java XML编程接口之一,是Java SE 和Java EE 平台的一部分。 JAX-WS 2.0 规范是代替JAX-RPC 1.0的下一代Web服务API。JAX-RPC(The Java API for XML Based RPC)是基于XML的RPC(远程过程调用)的Java API。 JAX-WS 2

    2024年02月08日
    浏览(48)
  • 用手机NFC复制校园一卡通

    NFC是Near Field Communication缩写,即 近距离无线通讯技术 。 校园卡一般是感应式CPU卡,是一种加密卡。 如果只有一个带nfc功能的安卓手机,那么手机只能复制校园卡的第0块第0扇区,类似于nfc卡的卡号或者有点像是nfc的名字。 加密部分都不能被读取出来。一般关于钱的部分都被

    2024年02月07日
    浏览(82)
  • 【折腾向】闲置手机 + 内网穿透 + caddy + rclone = ?

    通过 frp 内网穿透将闲置手机暴露至公网,并使用 caddy 搭建 webdav 服务,客户端使用 rclone 实现 webdav 挂载,达到类坚果云的效果。 要有公网 IP!要有公网 IP!要有公网 IP! 公网 IP 或者一台 VPS,这里我用的是阿里轻量,新加坡(没有特殊需求还是建议选国内)。 Android 手机

    2024年04月26日
    浏览(31)
  • RFID射频卡写入手机NFC心路小记

    声明: 本文仅是作者学习探索的心里路程日记,如果您看完以后,从中获得了一些经验,作者不胜荣幸。 文章中的方法仍需要经济支出,借助他人工具完成,如读者想全凭个人之力从零制作自己的读卡解码设备,可至此结束。   目前,各个小区多使用射频卡管理门禁和电

    2024年02月09日
    浏览(46)
  • 基于web的音乐网站的设计与实现

    系统包含:源码+ppt+论文+说明文档 所用技术:SpringBoot+Mybatis+Mysql 获取资料请滑到底部获取联系方式 随着信息技术在管理上越来越深入而广泛的应用,管理信息系统的实施在技术上已逐步成熟。本文介绍了音乐网站的开发全过程。通过分析音乐网站管理的不足,创建了一个计

    2024年02月22日
    浏览(37)
  • WEB通讯技术。前端实现SSE长连接,nodejs+express搭建简单服务器,进行接口调试,通过curl请求数据

    长连接(Keep-Alive)是一种HTTP/1.1的持久连接技术,它允许客户端和服务器在一次TCP连接上进行多个HTTP请求和响应,而不必为每个请求/响应建立和断开一个新的连接。长连接有助于减少服务器的负载和提高性能。 长连接的HTTP请求方法与普通HTTP请求方法相同,可以使用GET、P

    2024年02月09日
    浏览(50)
  • 超级SIM卡 SEID号读取 手机NFC门禁刷卡模块方案

    中国移动超级SIM卡是基于SIM卡安全芯片,利用其不同功能而实现不同等级认证的安全产品。简单来说,就是为了便利用户的生活而推出的更加安全的一体卡。 超级SIM卡,内含加密芯片以及NFC功能,线下可充当饭卡,门禁卡,交通卡,车钥匙;线上可以进行金融安全认证、5G电

    2024年02月11日
    浏览(73)
  • 市面上有几款手机有NFC功能的,什么牌子什么型号的?

    华为支持NFC功能型号有华为Mate系列,P系列,nova系列,荣耀note系列,荣耀Magic系列等;苹果支持NFC功能型号有iPhone11,iPhoneXS,iPhoneXR,iPhoneX,iPhone8,iPhone7,iPhone6s和iPhone6,iPhoneSE系列。..........................

    2024年02月11日
    浏览(36)
  • 阿里云99元服务器ECS经济型e实例3M带宽「不限流量」

    阿里云服务器优惠99元一年,配置为云服务器ECS经济型e实例,2核2G配置、3M固定带宽和40G ESSD Entry系统盘 ,CPU采用Intel Xeon Platinum架构处理器,2.5 GHz主频,3M带宽下载速度384KB/秒,上传速度1028KB/秒,阿腾云atengyun.com分享阿里云99元服务器性能测评及续费不涨价方法: 阿里云99元

    2024年02月22日
    浏览(48)
  • 【服务器】安卓手机使用Termux搭建web服务

      Yan-英杰的主页 悟已往之不谏 知来者之可追    C++程序员,2024届电子信息研究生 目录 概述 1.搭建apache 2.安装cpolar内网穿透 3.公网访问配置 4.固定公网地址 5.添加站点 Termux是一个Android终端仿真应用程序,用于在 Android 手机上搭建一个完整的Linux 环境,能够实现Linux下的许

    2024年02月06日
    浏览(69)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包