HTML5-Player für MP3-Datei einbetten

Ich hatte gehofft, den folgenden Code einfach in ein Diskussions-Thema einfügen zu können, um einen HTML5-MP3-Player zu erhalten. (Diese eingebettete Quelle stammt von einem Plugin auf meiner WordPress-Website.)

Hinweise, Gedanken, … ??

<blockquote class="wp-embedded-content"><a href="https://moversmindset.com/083-cara-michele-nether-aikido-wellness-and-honesty/">083. Cara-Michele Nether: Aikido, wellness, and honesty</a></blockquote>
<script type='text/javascript'>
<!--//--><![CDATA[//><!--
		/*! This file is auto-generated */
		!function(d,l){"use strict";var e=!1,o=!1;if(l.querySelector)if(d.addEventListener)e=!0;if(d.wp=d.wp||{},!d.wp.receiveEmbedMessage)if(d.wp.receiveEmbedMessage=function(e){var t=e.data;if(t)if(t.secret||t.message||t.value)if(!/[^a-zA-Z0-9]/.test(t.secret)){var r,a,i,s,n,o=l.querySelectorAll('iframe[data-secret="'+t.secret+'"]'),c=l.querySelectorAll('blockquote[data-secret="'+t.secret+'"]');for(r=0;r<c.length;r++)c[r].style.display="none";for(r=0;r<o.length;r++)if(a=o[r],e.source===a.contentWindow){if(a.removeAttribute("style"),"height"===t.message){if(1e3<(i=parseInt(t.value,10)))i=1e3;else if(~~i<200)i=200;a.height=i}if("link"===t.message)if(s=l.createElement("a"),n=l.createElement("a"),s.href=a.getAttribute("src"),n.href=t.value,n.host===s.host)if(l.activeElement===a)d.top.location.href=t.value}}},e)d.addEventListener("message",d.wp.receiveEmbedMessage,!1),l.addEventListener("DOMContentLoaded",t,!1),d.addEventListener("load",t,!1);function t(){if(!o){o=!0;var e,t,r,a,i=-1!==navigator.appVersion.indexOf("MSIE 10"),s=!!navigator.userAgent.match(/Trident.*rv:11\./),n=l.querySelectorAll("iframe.wp-embedded-content");for(t=0;t<n.length;t++){if(!(r=n[t]).getAttribute("data-secret"))a=Math.random().toString(36).substr(2,10),r.src+="#?secret="+a,r.setAttribute("data-secret",a);if(i||s)(e=r.cloneNode(!0)).removeAttribute("security"),r.parentNode.replaceChild(e,r)}}}}(window,document);
//--><!]]>
</script><iframe sandbox="allow-scripts allow-same-origin" security="restricted" src="https://moversmindset.com/083-cara-michele-nether-aikido-wellness-and-honesty/embed/" width="500" height="350" title="&#8220;083. Cara-Michele Nether: Aikido, wellness, and honesty&#8221; &#8212; movers mindset" frameborder="0" marginwidth="0" marginheight="0" scrolling="no" class="wp-embedded-content"></iframe>
1 „Gefällt mir“

Vielleicht CSP?

Fügst du das in einen Beitrag ein oder …?

1 „Gefällt mir“

Oooooh, das sieht genau nach dem Problem aus… Ich werde mal testen, die CSP so zu erweitern, dass die WP-Seite erlaubt wird…

1 „Gefällt mir“

Überprüfen Sie das Fehlerprotokoll der Browserkonsole..

1 „Gefällt mir“

Beiträge in Discourse werden niemals zufällig eingefügtes JS ausführen lassen, da dies aus Sicherheitsgründen blockiert wird.

Wenn alles, was Sie benötigen, über das iframe bereitgestellt wird, können Sie diese spezifische Domain in den Seiteneinstellungen zulassen und sie in einem Thema einfügen.

2 „Gefällt mir“

Ich habe die CSP in der Admin-Oberfläche komplett deaktiviert (nur um zu prüfen, ob das der Grund ist, warum mein Iframe nicht korrekt funktioniert). Hinweis: Der gesamte Code, den ich eingefügt habe, befindet sich im Code-Block meines Eröffnungsposts.

Es funktioniert immer noch nicht… Merkwürdigerweise erhalte ich nur drei Konsolenfehler, und alle stammen von Discourses CDN. . . Der Code wird direkt vor “Mehr erfahren” eingefügt.

1 „Gefällt mir“

:confused: …oh, das ergibt jetzt Sinn, seit du es sagst.

Ich hatte gehofft, einfach einen Haufen Einbettungscode von dem WordPress-Plugin, das ich verwende, kopieren und einfügen zu können; ich wollte einen HTML5-Player für MP3-Audiodateien einbetten. Also, das wird nicht funktionieren. Schade.

1 „Gefällt mir“

Wir bieten umfangreiche Unterstützung für eingebettete und nicht eingebettete Player – direkt ab Werk.

YouTube

Vimeo

SoundCloud

https://soundcloud.com/silkmusic/silkm265-1?in=silkmusic/sets/silkm265

Sie können MP3- und MP4-Dateien sogar direkt hochladen, und sie werden automatisch zu einem Player.

3 „Gefällt mir“

…ja, aber basiert das nicht alles darauf, dass Open Graph korrekt vom anderen Server gesendet wird? (Ich habe solche SoundCloud-Einbettungen schon gesehen/verwendet – sie sind großartig.)

Meine WordPress-Seite sendet Open Graph, aber nicht mit ausreichend cleveren OG-Daten…

https://moversmindset.com/083-cara-michele-nether-aikido-wellness-and-honesty/ ist eine Seite mit einem HTML5-Player – diese wird genau so eingeblendet, wie ich es erwarte/hoffe…

https://moversmindset.com/083-cara-michele-nether-aikido-wellness-and-honesty/083-cara-michele-nether-aikido-wellness-and-honesty/ ist die WordPress-URL für das Medienitem … aber wiederum ist WordPress nicht intelligent genug, um genügend OG-Informationen für eine wirklich clevere Einbettung zu senden…

…Ich werde versuchen, die MP3-Datei direkt hochzuladen … ich bin mir nicht sicher, ob ich ~40 MB große MP3s (mal 80+ Episoden) auf meinem gehosteten Discourse hochladen kann…

1 „Gefällt mir“

Das Hinzufügen eines Links zu einer MP3-Datei in einer einzigen Zeile wie:

https://moversmindset.com/podcast-player/7711/083-cara-michele-nether-aikido-wellness-and-honesty.mp3

wird zu

2 „Gefällt mir“

Ich habe die mp3-Erweiterung für Uploads erlaubt, aber ich bin gerade auf ein Größenlimit gestoßen.

…was sinnvoll ist.

Ich habe sie eigentlich bereits auf einem Dateifreigabedienst (unserer eigenen Website)… aber wenn ich eine reine MP3-Datei-URL einfüge, bekomme ich nur einen simplen browserbasierten Player [zumindest glaube ich, dass das der nächste Absatz ist].

1 „Gefällt mir“

Das ist ein guter erster Schritt.

Von hier aus können Sie sich nach Folgendem umsehen:

  • Eine bessere Einbettungs-Podcast-Plattform, die Sie sowohl in WordPress als auch in Discourse über iframes nutzen können
  • Die Übertragung Ihres aktuellen Players von WordPress nach Discourse.
2 „Gefällt mir“

…ja, das ist der Fels, auf dem ich befürchte, scheitern zu müssen. Ich müsste unser gesamtes Podcast-Hosting/Lösungskonzept überarbeiten. (Nicht unmöglich, aber auch nicht trivial.)

…vielleicht kann ich bei Castos (den Machern des Seriously Simple Podcasting-Plugins für WordPress, das wir nutzen) eine Feature-Anfrage stellen, die genau erklärt, welche OG-Informationen benötigt werden, um einen schönen, SoundCloud-ähnlichen Onebox-Player zu erstellen.

:man_shrugging:

1 „Gefällt mir“

Es scheint, dass einige Dienste in ihrem Angebot einbettbare Player haben, wie mein erstes Google-Ergebnis:

3 „Gefällt mir“

Ja. Mein Traum ist es, einen zu finden, der Kapitelmarken in MP3-Dateien versteht und unterstützt, die bei Podcasts mittlerweile üblich sind, und der das „Springen zu

2 „Gefällt mir“

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.