Songle API
Songle API とは
能動的音楽鑑賞サービス Songle (ソングル)の機能や解析結果をあなたのアプリケーションから利用することができるアプリケーション開発者向け API です。 Songle API の提供する機能を組み合わせることで、ウェブ上の好きな音楽の再生に合わせて動作するアプリケーションを容易に開発することができます。大規模音楽連動制御プラットフォーム Songle Sync (ソングルシンク)の機能を使う場合も、こちらをご利用ください。
詳細な使い方は api.songle.jp よりご確認ください。
クイックスタート
動作要件
Songle API モジュールは、次の環境で動作することが確認されています。
ブラウザ
- Microsoft Edge 17
- Mozilla Firefox 62
- Google Chrome 70
- Safari 12
- Opera 55
- Android Browser 67
- iOS Safari 11.4
- Google Chrome for Android 69
Node.js
インストール
ブラウザ
Songle API モジュールは script
タグもしくは npm
などのパッケージマネージャからインストールすることができます。
<script src="https://api.songle.jp/v2/api.js"></script>
npm
$ npm install songle-api
Hello, Songle API !!
ウェブブラウザから Songle API モジュールを利用した場合、その利用準備の完了を通知する onSongleAPIReady
が Songle API モジュールによって自動的に呼び出されます。
self.onSongleAPIReady =
function(Songle) {
alert("Hello Songle API !!");
}
サンプルプログラム
次のサンプルプログラムは、音楽の拍子と連動するプログラムです。サンプルからも分かるように、音楽に連動したイベント駆動のプログラムを容易に記述することができます。
サンプルプログラム1
self.onSongleAPIReady =
function(Songle) {
var player =
new Songle.Player({
mediaElement: "#songle"
});
player.addPlugin(new Songle.Plugin.Beat());
player.useMedia("https://www.youtube.com/watch?v=zweVJrnE1uY");
player.on("beatPlay",
function(ev) {
switch(ev.data.beat.position) {
case 1:
console.log("1st beat !!");
break;
case 2:
console.log("2nd beat !!");
break;
case 3:
console.log("3rd beat !!")
break;
case 4:
console.log("4th beat !!");
break;
}
});
}
Songle Sync の使い方
Songle Sync (ソングルシンク)とは
ウェブ上の音楽の再生に合わせて多種多様な機器を同時制御することで、一体感のある演出ができる大規模音楽連動制御プラットフォームです。誰でも自分のスマートフォンやパソコン等の機器を自由自在に組み合わせて、好きな楽曲の再生に合わせて光ったり動いたりする演出を作ることができます。
はじめに
この機能を使うためには Songle API のウェブサイトからユーザ登録を行い、トークンを取得する必要があります。取得方法の詳細はチュートリアルのステップ3を参照してください。
チュートリアルサイトでは、より実践的な使い方を実際に体験しながら学ぶことができます。チュートリアルの内容は、アプリケーション開発者をメインターゲットとしていますが、途中までは、プログラミングの知識がない方でもより高度な大規模音楽連動制御を楽しみながら体験できます。
サンプルプログラム2
次のサンプルプログラムは、サンプルプログラム1を大規模音楽連動制御に対応させたプログラムです。取得したトークンを記述して複数のブラウザからマスターとスレーブを実行してみて、イメージを掴んでみましょう。
ウェブブラウザ / マスター
self.onSongleAPIReady =
function(Songle) {
var player =
new Songle.SyncPlayer({
accessToken: "YOUR-ACCESS-TOKEN-HERE",
secretToken: "YOUR-SECRET-TOKEN-HERE",
mediaElement: "#songle"
});
player.addPlugin(new Songle.Plugin.Beat());
player.useMedia("https://www.youtube.com/watch?v=zweVJrnE1uY");
player.on("beatPlay",
function(ev) {
switch(ev.data.beat.position) {
case 1:
console.log("1st beat !!");
break;
case 2:
console.log("2nd beat !!");
break;
case 3:
console.log("3rd beat !!")
break;
case 4:
console.log("4th beat !!");
break;
}
});
}
ウェブブラウザ / スレーブ
self.onSongleAPIReady =
function(Songle) {
var player =
new Songle.SyncPlayer({
accessToken: "YOUR-ACCESS-TOKEN-HERE",
mediaElement: "#songle"
});
player.addPlugin(new Songle.Plugin.Beat());
player.useMedia("https://www.youtube.com/watch?v=zweVJrnE1uY");
player.on("beatPlay",
function(ev) {
switch(ev.data.beat.position) {
case 1:
console.log("1st beat !!");
break;
case 2:
console.log("2nd beat !!");
break;
case 3:
console.log("3rd beat !!")
break;
case 4:
console.log("4th beat !!");
break;
}
});
}
Node.js / スレーブ
次のサンプルプログラムは Node.js 上で動作するスレーブのサンプルです。
var Songle = require("songle-api");
var player =
new Songle.SyncPlayer({
accessToken: "YOUR-ACCESS-TOKEN-HERE",
});
player.addPlugin(new Songle.Plugin.Beat());
player.on("beatPlay",
function(ev) {
switch(ev.data.beat.position) {
case 1:
console.log("1st beat !!");
break;
case 2:
console.log("2nd beat !!");
break;
case 3:
console.log("3rd beat !!")
break;
case 4:
console.log("4th beat !!");
break;
}
});
より詳細なサンプルプログラム
ライセンス
Songle API を利用するためには、利用規約に同意する必要があります。
Copyright (c) 2017-2019 AIST Songle Project