Skip to content

Instantly share code, notes, and snippets.

@bagbag

bagbag/index.html

Last active Apr 1, 2022
Star
Embed
What would you like to do?
Learn more about clone URLs
Download ZIP
MediathekViewWeb API Samplecode
Raw
index.html
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>MediathekViewWeb API</title>
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
</head>
<script>
const query = {
queries: [
{
fields: ['title', 'topic'],
query: 'sturm der liebe'
},
{
fields: ['channel'],
query: 'ard'
}
],
sortBy: 'timestamp',
sortOrder: 'desc',
future: false,
offset: 0,
size: 10,
duration_min: 20,
duration_max: 100
};
const queryString = JSON.stringify(query);
const request = new XMLHttpRequest();
const requestURL = 'https://mediathekviewweb.de/api/query';
request.open("POST", requestURL);
request.addEventListener('load', function (event) {
let response;
try {
response = JSON.parse(request.responseText);
} catch (e) { }
if (request.status == 200 && typeof response != 'undefined') {
for (let i = 0; i < response.result.results.length; i++) {
let entry = response.result.results[i];
let row = $('<tr>');
row.append($('<td>').text(entry.channel));
row.append($('<td>').text(entry.topic));
row.append($('<td>').text(entry.title));
row.append($('<td>').text(entry.description));
row.append($('<td>').text(entry.url_video));
$('#mediathek > tbody').append(row);
}
$('#responseText').text(JSON.stringify(response, null, 2));
} else {
if (response) {
console.log(response.err);
$('#errorText').html(response.err.join('</br>'));
}
else {
$('#errorText').html(request.statusText + '</br>' + request.responseText);
}
}
});
request.send(queryString);
</script>
<style>
table,
th,
td {
border: 1px solid black;
border-collapse: collapse;
}
th,
td {
padding: 5px;
}
th {
text-align: left;
}
</style>
<body>
<table id="mediathek" class="table table-striped table-hover">
<thead>
<tr>
<th>Sender</th>
<th>Thema</th>
<th>Titel</th>
<th>Beschreibung</th>
<th>URL</th>
</tr>
</thead>
<tbody>
</tbody>
</table>
<p id="errorText"></p>
</br>
<p id="responseText" style="white-space:pre-wrap;"></p>
</body>
</html>
@PapeCoding
Copy link

PapeCoding commented Aug 31, 2020

For everyone using JQuery for the whole code, this code example might be useful:

$.post({
	url: 'https://mediathekviewweb.de/api/query',
	type: 'POST',
	data: JSON.stringify(query),
	contentType: 'text/plain',
	success: function (data) {
		// ... Do something with data.result.results ...
	}
});

Note the contentType: 'text/plain', which has to be sent to avoid an Unexpected token o in JSON at position 1 - error

@axaneco
Copy link

axaneco commented Aug 22, 2021 •
edited

For everyone using PHP, this is a working sample code that produces the same result as the index.html above:

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title>MediathekViewWeb API</title>
    </head>
    <style>
        table, th, td {
            border: 1px solid black;
            border-collapse: collapse;
        }

        th, td {
            padding: 5px;
        }

        th {
            text-align: left;
        }
    </style>
    <body>
        <?php
        $api_url = 'https://mediathekviewweb.de/api/query';

        function callmvapi($api_url, $query) {
            $ch = curl_init($api_url);
            curl_setopt_array($ch, array(
                CURLOPT_POST => 1,
                CURLOPT_POSTFIELDS => $query,
                CURLOPT_HTTPHEADER => array('User-Agent: ax mvclient 0.1.1', 'Content-Type: text/plain'),
                CURLOPT_RETURNTRANSFER => 1
            ));
            $result = curl_exec($ch);
            curl_close($ch);
            return $result;
        }

        $query = '{"queries":[{"fields":["title","topic"],"query":"sturm der liebe"},'
                . '{"fields":["channel"],"query":"ndr"}],"sortBy":"timestamp","sortOrder":"desc",'
                . '"future":"false","offset":"0","size":"10"}';

        $result = callmvapi($api_url, $query);
        $array = json_decode($result, true);
        ?>

        <table id="mediathek" class="table table-striped table-hover">
            <thead>
                <tr>
                    <th>Sender</th>
                    <th>Thema</th>
                    <th>Titel</th>
                    <th>Beschreibung</th>
                    <th>URL</th>
                </tr>
            </thead>
            <tbody>
                <?php
                foreach ($array['result']['results'] as $entry) {
                    echo '<tr>';
                    echo '<td>' . $entry['channel'] . '</td>';
                    echo '<td>' . $entry['topic'] . '</td>';
                    echo '<td>' . $entry['title'] . '</td>';
                    echo '<td>' . $entry['description'] . '</td>';
                    echo '<td>' . $entry['url_video'] . '</td>';
                    echo '</tr>';
                }
                ?>  
            </tbody>
        </table>

        <?php
        echo '<pre>';
        echo nl2br(json_encode(json_decode($result), JSON_PRETTY_PRINT));
        echo '</pre>';
        ?>
    </body>
</html>

@MrFly72
Copy link

MrFly72 commented Nov 27, 2021 •
edited

And this is the same example which makes use of Powershell Desktop (5.1) or Powershell Core (Windows+Linux tested):

$MediathekQuery = @{
    queries = @(
        # fields is casted to array, as some queries require fields to be an array, even if only one value!
        @{fields = @("title","topic"); query = "sturm der liebe" }
        @{fields = @("channel"); query = "ard" }
    )
    sortBy = "timestamp"
    sortOrder = "desc"
    future = $false
    offset = 0
    size = 10
    duration_min = 20
    duration_max = 100
}

if ($PSVersionTable.PSEdition -eq "Desktop") {
    $QueryJSON = $MediathekQuery | ConvertTo-Json -Depth 20
}
else {
    #Powershell Core supports a new escaping, which is needed for umlauts in core, but not in 5.1
    $QueryJSON = $MediathekQuery | ConvertTo-Json -Depth 20 -EscapeHandling EscapeNonAscii
}

$Antwort = Invoke-RestMethod -Method Post -Uri "https://mediathekviewweb.de/api/query" -Body $QueryJSON -ContentType "text/plain"

Output is a Powershell Object in the following form:

channel            : ARD
topic              : Sturm der Liebe
title              : Hinter den Kulissen: Backstage bei der Textprobe von Erich und Lorenzo
description        : Achtung, volle Konzentration! In diesem Behind-the-Scenes-Clip zeigen wir Euch, wie Erich Altenkopf alias Dr. Michael Niederbühl und 
                     Robert-Saalfeld-Darsteller Lorenzo Patané kurz vor dem Dreh nochmal ihren Text durchgehen.
timestamp          : 1627903500
duration           : 59
size               : 15728640
url_website        : https://www.ardmediathek.de/video/Y3JpZDovL2Rhc2Vyc3RlLmRlL3N0dXJtIGRlciBsaWViZS8zNmI5NjM0Ni04MDliLTRjYTItYTdhOC1iOTc4OTg0Mjg1NDE
url_subtitle       : 
url_video          : https://pdvideosdaserste-a.akamaihd.net/int/2021/08/02/36b96346-809b-4ca2-a7a8-b97898428541/960-1_948286.mp4
url_video_low      : https://pdvideosdaserste-a.akamaihd.net/int/2021/08/02/36b96346-809b-4ca2-a7a8-b97898428541/640-1_948286.mp4
url_video_hd       : https://pdvideosdaserste-a.akamaihd.net/int/2021/08/02/36b96346-809b-4ca2-a7a8-b97898428541/1280-1_948286.mp4
filmlisteTimestamp : 1627935420
id                 : hikmS6Vj8lCcV5iVpXxb1DKD32rfnVoNBTx8dxzvhqg=

Easy to parse with eg.:
$Antwort[0].url_video to get the video URL.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment