暑くて長い夏がやっと一段落したと思ったら急に冷えこみだし、カレンダーも残りわずかとなりました。毎度のことながら一年の早さを思い知る今日このごろ、皆さまいかがお過ごしでしょうか。
さて、本連載では過去に何度かNHKのインターネットラジオ
また、NHKラジオは2026年度から現在の3波体制が2波に整理されるそうで、1波減る分、従来よりも
なお、今回取りあげる
動的サイトと「ウェブ開発ツール」
「らじる★らじる」
しかしながら、その後あれこれと経験を積むうちにずいぶん便利なツールがごく身近にあることに気づきました。それはFirefoxブラウザに組み込まれている
筆者のような旧世代の人間だと、ウェブサイトを解析する際、まずは
ブラウザが、読み込んだHTMLファイルを元にCSSで修飾しJavaScriptの処理を施した結果がDOMです。DOMそのものはブラウザのメモリ上に構成されたツリー状のデータ構造で、それを可視化したのがウェブページとなります。今回紹介する
「らじる★らじる」と「インスペクター」
まずは現状の
このようなページを解析する際には
「インスペクター」
今回は、音声プレイヤーがどうやって配信URLを扱っているかといったあたりを調べたいので、ウェブページ上のプレイヤー部分に該当する箇所を
「インスペクター」
<div class="nol_audio_player" data-exvolume="true" data-hlsurl="https://simul.drdi.st.nhk/live/5/joined/master.m3u8" data-skin="raFM" data-aa="simul; クラシックの庭 シューベルトのピアノ・ソナタ ト長調;r3,130;2025111969155;2025-11-19T07:25:00+09:00_2025-11-19T09:15:00+09:00" data-type="LIVE" data-autoplay="true">
<iframe id="_apIfr0" name="_apIfr0" scrolling="no" frameborder="0" title="音声再生プレーヤー" src="https://www.nhk.or.jp/common/aplayer/ifr.html" style="height: 85px; overflow: hidden;"></iframe>
</div>
ざっと見、
この
$ mpv https://simul.drdi.st.nhk/live/5/joined/master.m3u8 [ffmpeg] https: Cannot reuse HTTP connection for different host: simul.drdi.st.nhk:-1 != simulosa.drdi.st.nhk:-1 [ffmpeg/demuxer] hls: keepalive request failed for 'https://simulosa.drdi.st.nhk/live/5/joined/audio/media.m3u8' with error: 'Invalid argument' when parsing playlist ● Audio --aid=1 (aac 2ch 48000 Hz 97 kbps) ○ Audio --aid=2 (aac 2ch 48000 Hz 97 kbps) AO: [pipewire] 48000Hz stereo 2ch floatp A: 00:00:17 / 00:00:30 (56%) Cache: 13s/487KB
すこし試したところ、
「らじる★らじる」と「デバッガー」
さて、とりあえず現在配信中のURLはわかったものの、このURLがどのようにタイトルや曲目といった番組情報等と結びついているかはもう少し遡って調べる必要があります。というのも、DOMはHTMLファイルを元にCSSやJavaScriptが処理を行った
その際に便利なのが
左側のペインにあるスクリプトの一覧を見てみると、このページではwww.
そこでplayer.
/////////らじる★らじる 音声プレーヤー/////////
$(function() {
$.ajax({
url: "/radio/config/config_web.xml?250303",
cache: !0,
dataType: "xml",
名前からしてこれが設定ファイルだろうと調べてみれば、
<?xml version="1.0" encoding="UTF-8"?>
<radiru_config>
<!-- お知らせ -->
<info><![CDATA[/radio/include/oshirase.txt]]></info>
<!-- 各地域のストリームURL -->
<stream_url>
<data>
<areajp>札幌</areajp>
<area>sapporo</area>
<apikey>700</apikey>
<areakey>010</areakey>
<r1hls><![CDATA[https://simul.drdi.st.nhk/live/6/joined/master.m3u8]]></r1hls>
<r2hls><![CDATA[https://simul.drdi.st.nhk/live/4/joined/master.m3u8]]></r2hls>
<fmhls><![CDATA[https://simul.drdi.st.nhk/live/7/joined/master.m3u8]]></fmhls>
</data>
このファイルの最後の方には、番組情報へのアクセスポイントらしき記述もあります。
<!-- noa api -->
<url_program_noa><![CDATA[//api.nhk.jp/r7/pg/now/radio/{area}/now.json]]></url_program_noa>
一方、player.
function getAPI() {
$.ajax({
url: $config.url_program_noa.replace(/{area}/, findAreakey($area)),
cache: !0,
dataType: "json",
このAPIを使えば放送中の番組
$ curl https://api.nhk.jp/r7/pg/now/radio/010/now.json | jq .
% Total % Received % Xferd Average Speed Time Time Time Current
Dload Upload Total Spent Left Speed
100 76338 0 76338 0 0 525k 0 --:--:-- --:--:-- --:--:-- 528k
{
"r1": {
"previous": {
"type": "BroadcastEvent",
"id": "r1-010-2025112169523",
"name": "大相撲（２０２５年） 九州場所 十三日目",
"description": "＜中断＞（５：００）ニュース",
"startDate": "2025-11-21T16:05:00+09:00",
....
届いたJSONファイルを調べると、各チャンネルを示す["previous"]["present"]["following"]
とりあえずこれくらいわかれば十分なので、まずはこれらの情報を以前書いたタイマー予約用スクリプトに反映させることにしました。
今回は最近の