如何实现可分享音频链接、点击跳转SoundCloud应用的分享按钮
实现SoundCloud曲目跳转分享按钮的解决方案
嘿,我之前刚好做过类似的需求,给你几个亲测有效的方案,核心是利用SoundCloud的**深度链接(URL Scheme)**来直接唤起应用并打开指定曲目:
方案一:直接使用SoundCloud官方URL Scheme(最简单)
SoundCloud的移动端应用支持标准的URL Scheme格式,你可以直接构造链接来唤起应用并跳转到对应曲目:
1. 链接格式
soundcloud://tracks/{TRACK_ID}
{TRACK_ID}是你要分享的曲目的唯一ID,你可以从曲目网页版的URL里提取(比如网页URL是https://soundcloud.com/artist-name/track-title,打开网页后查看源码,搜索trackId就能找到一串数字;或者直接用SoundCloud开发者API获取)
2. 按钮实现(HTML/前端)
为了兼顾未安装App的用户,我们可以做一个“先尝试唤起App,失败则跳转到网页版”的按钮:
<button id="soundcloud-share-btn">打开SoundCloud曲目</button> <script> document.getElementById('soundcloud-share-btn').addEventListener('click', function() { const trackId = '你的曲目ID'; const appUrl = `soundcloud://tracks/${trackId}`; const webUrl = `https://soundcloud.com/tracks/${trackId}`; // 尝试唤起App const startTime = Date.now(); window.location.href = appUrl; // 1.5秒后如果没唤起成功,跳转到网页版 setTimeout(() => { if (Date.now() - startTime < 2000) { window.location.href = webUrl; } }, 1500); }); </script>
3. 平台适配注意事项
- iOS 9+:如果是在原生App内实现,需要在
Info.plist中添加以下配置,允许查询SoundCloud的Scheme:<key>LSApplicationQueriesSchemes</key> <array> <string>soundcloud</string> </array> - Android:原生App内实现的话,需要在
AndroidManifest.xml中添加对应的intent-filter(前端网页无需配置):<intent-filter> <action android:name="android.intent.action.VIEW" /> <category android:name="android.intent.category.DEFAULT" /> <category android:name="android.intent.category.BROWSABLE" /> <data android:scheme="soundcloud" android:host="tracks" /> </intent-filter>
方案二:使用SoundCloud分享API(更灵活)
如果你需要自定义分享内容(比如附带文字说明),可以调用SoundCloud的分享API,不过这个方式需要用户登录SoundCloud账号,适合需要更丰富分享场景的情况:
1. 核心逻辑
通过构造分享URL,引导用户完成分享,同时支持唤起App:
<a href="https://soundcloud.com/share?url=https%3A%2F%2Fsoundcloud.com%2Ftracks%2F{TRACK_ID}&title=来听这首好歌!" target="_blank">分享到SoundCloud</a>
- 这个链接会打开SoundCloud的分享界面,用户登录后可以直接分享曲目,并且如果安装了App,会优先唤起App进行操作。
小技巧:快速获取Track ID
如果你不想用API,直接从网页版曲目页面获取ID:
- 打开目标曲目网页
- 右键“检查”打开开发者工具
- 在控制台输入
SC.Widget('player').getCurrentSound(function(sound){console.log(sound.id);})(页面有播放器时可用),或者直接搜索页面源码中的trackId字段,就能找到对应的数字ID。
如果还有平台适配或者细节问题,随时问我哈!
内容的提问来源于stack exchange,提问作者Mohamed Salama




