Kako vstaviti zvočni posnetek v html. Zvok iz interneta shranjujemo v datoteke. Kako nastaviti glasbo v ozadju v html

Pozdravljeni vsi skupaj. To je Andrej.

V tej epizodi se bomo naučili povezovanja zvok v HTML stran, tj. zvočne datoteke za vaše spletno mesto.

Obstajajo 3 metode vdelave zvočne datoteke.

S klikom na to povezavo se samodejno zažene standardni program za predvajanje datotek določenega formata, običajno ta Windows Media(predvaja datoteke AIFF, AU, MIDI, WAV in MP3). Ta možnost vam je znana, zato pojdimo naprej.

drugič način je uporaba posode .

Ta vsebnik vam omogoča poslušanje z orodji za predvajanje, ki so prikazana neposredno na spletni strani, vendar je lahko nadzorna plošča za predvajanje videti drugače različne brskalnike.

Da bi bil ta vsebnik prikazan, mora biti v brskalnik nameščen poseben vtičnik. IN internet Explorer je privzeto, vendar ga morda nimajo vsi, kar velja za druge brskalnike. Potem ga boste morali namestiti.

XHTML

Parameter src je obvezen in določa ime datoteke, ki se predvaja. Drugi parametri morda niso določeni. Njihov seznam je podan spodaj.

ŠIRINA=n— določa širino konzole v slikovnih pikah.

VIŠINA=m— določa višino konzole v slikovnih pikah.

SAMODEJNI ZAGON=TRUE|FALSE— če je TRUE, se predvajanje začne samodejno.

SAMODEJNO NALOŽENJE=TRUE|FALSE- če ima vrednost FALSE, se datoteka ne prenese samodejno.

STARTTIME="mm:ss"— predvajanje se začne od trenutka, določenega v minutah in sekundah od začetka datoteke.

PONOVI = DRŽI/NE PRAV— dovoli ali prepove ponavljanje avdio/video posnetka.

PREDVAJANJE ZANKE=Z— če ste podali REPEAT-TRUE, tukaj namesto Z navedite število ponovitev.

VOLUME=odstotek— glasnost predvajanja, navedena kot odstotek največje.

ALIGN="vrednost"— poravna nadzorno konzolo glede na besedilo strani. Lahko ima vrednosti CENTER, BASELINE ZGORNJE LEVO, DESNO.

CONTROLS="vrednost"— določa nabor kontrolnikov konzole. Ima lahko naslednje vrednosti (razloženo spodaj) - CONSOLE, SMALLCONSOLE, PLAYBUTTON PAUSEBUTTON, STOPBUTTON IN VOLUMELEVER.

KONZOLA— popoln nabor kontrol.

MAJHNA KONZOLA— kompaktna predstavitev konzole. Celoten nabor kontrolnikov razen gumba za premor.

GUMB ZA PREDVAJANJE- Samo gumb za predvajanje.

GUMB ZA PREMOR- samo gumb za premor.

STOP BUTTON- samo gumb za zaustavitev. Datoteka se nato prenese.

VOLUMELEVER- samo nadzor glasnosti.

Ugotovili smo parametre.

Predlagam, da poskusite sami uporabiti različne parametre in preverite, kako delujejo (tu ni nič zapletenega).

Tretjič Način je, da določite zvočno datoteko kot zvok v ozadju za stran.

Sintaksa tukaj je preprosta:

src=ime datoteke- zvočna datoteka

zanka=n- število ponovitev (neskončno - neprekinjeno)

glasnost- glasnost (od 10000 do 0,0 - privzeta vrednost)

ravnovesje- ravnotežje med levim in desnim zvočnikom, vrednost se lahko spreminja od -10000 (največ za levi kanal) do 10000 (največ za desni kanal).

Govorili smo že o uporabi HTML5 in zakaj je danes pomemben. Zdaj pa si podrobneje oglejmo vprašanje "Kako vstaviti zvok na spletno mesto z uporabo HTML5."

Z oznako lahko na spletno mesto dodate glasbo zvok. Primer najenostavnejše izvedbe te oznake:

Ampak spet, tako kot pri videu, ni tako preprosto. Vsi brskalniki ne podpirajo zahtevanih zvočnih kodekov. Poglejmo tabelo:

BrskalnikGoogle ChromeMozilla FirefoxSafariOperainternet Explorer
mp3 Jejte št Jejte št Jejte
wav Jejte Jejte Jejte Jejte št
A.A.C. Jejte št Jejte št Jejte
ogg/vorbis Jejte Jejte št Jejte št

Kot je razvidno iz tabele, je najbolj »univerzalen« format .wav. Vendar ga Internet Explorer ne podpira. Zato je priporočljivo pretvoriti zvočno datoteko v več formatov in uporabiti več zvočnih kodekov. Naslednji primer ponazarja enega od načinov dodajanja zvoka HTML na spletno stran:

Videz predvajalnika zvoka bo odvisen od brskalnika, tukaj je na primer videz predvajalnika zvoka v brskalniku Firefox:

Atributi oznake AUDIO

Na glavne atribute oznake zvok nanašati:

  • src- pot do zvočne datoteke (lahko jo določite ločeno z vdelano oznako vir);
  • kontrole- prikaže se avdio nadzorna plošča (predvajanje, premor, glasnost itd.);
  • samodejno predvajanje- predvaja zvočno datoteko takoj po nalaganju spletne strani;
  • zanka- ciklično predvajanje;

Ugnezdena oznaka vir ima lahko naslednje atribute:

  • src- pot do zvočne datoteke;
  • vrsta- vrsto avdio vira;
  • mediji- vrsta naprave, na kateri se bo zvočna datoteka predvajala (vse - na vseh napravah, tv - televizija itd.);

Zakaj potrebujete glasbo na spletnem mestu?

Precej zanimivo vprašanje: predvajanje glasbe ali glasovnih datotek na spletnem mestu ali vgrajeni predvajalnik pomaga obiskovalcem spletnega mesta, da se sprostijo, vzbudi pozitivna čustva in jih spravi v pravo razpoloženje, tako rekoč olajša interakcijo s spletnim mestom. Toda ti učinki delujejo le, če je glasba na spletnem mestu pravilno izbrana in glasnost zvoka ne presega sprejemljivih meja, sicer bodo vsi vaši napori zaman in bodo med obiskovalci spletnega mesta povzročili negativna čustva.

Kako vstaviti zvok (glasbo) na spletno stran v html?

Pogosto se nam postavlja to vprašanje; glasba na spletni strani je pomemben in kreativen element, načinov predvajanja pa je veliko in jih ni tako težko izvesti. Začnimo z dejstvom, da vsak uporabnik globalnega omrežja uporablja nekakšen brskalnik za dostop do interneta in ni splošne in univerzalne tehnologije za predvajanje zvočnih in glasbenih datotek, vsak brskalnik deluje po svojih algoritmih in se nekoliko razlikujejo. drug od drugega, zato lahko pri predvajanju glasbe z vdelavo v kodo HTML strani nastanejo težave. A kot veste, so vse težave rešljive!

Vstavite glasbo na spletno mesto na načine HTML, JavaScript, jQuery, AJAX:

1 način.

Ustvarjanje predvajalnika zvočne glasbe na spletnem mestu ali predvajalniku

Tehnologija je preprosta, datoteka predvajalnika je ustvarjena tako, da ne obremenjuje strani ali strežnika, izberemo tehnologijo, ki jo bomo uporabili: JavaScript, jQuery, AJAX. Na podlagi izbrane tehnologije izdelamo skripto za našo stran in jo vstavimo v spletno stran. Skript se ustvari glede na to, kaj potrebujete: samodejno predvajanje glasbe v ozadju na spletnem mestu ali predvajalnik, ki ga upravlja obiskovalec. Nato ustvarite mapo v korenu mesta za glasbo in vanjo naložite zvočne datoteke.

Ali pa kot alternativno metodo lahko ustvarite predvajalnik s tehnologijo Flash; tak predvajalnik bo videti bolj impresiven. Resnica bo za spletno mesto dražja in težja (podaljšal se bo čas nalaganja strani spletnega mesta).

Metoda 2.

Namestitev glasbe na spletno mesto z uporabo HTML

Z uporabo zmožnosti HTML in brskalnika lahko na spletno mesto vstavite predvajalnik ali glasbo v ozadju. Tehnologija je prav tako preprosta: ustvari se koda HTML5 z oznako »avdio« in ta koda se zapiše na spletno mesto, in ko uporabnik obišče spletno mesto, vidi pomanjšan predvajalnik, obiskovalec samodejno pritisne gumb za predvajanje ali glasbo v ozadju. začne igrati. Videz predvajalnika bo odvisen od brskalnika, iz katerega je obiskovalec prišel, funkcionalnost pa bo ostala standardna: gumbi Predvajaj, Stop, Naprej, Nazaj, Glasnost. Predvajalnik s kodo HTML izgleda takole:

Sama vdelana koda izgleda takole:

Kot ste morda opazili, ukaz »controls autoplay« omogoči samodejno predvajanje glasbe takoj, ko obiskovalec vstopi na spletno mesto.

Alternativna različica kode HTML je oznaka "bgsound", ki sploh ne uporablja vizualnega predvajalnika; ko obiščete spletno mesto, se bo glasba na spletnem mestu začela predvajati, vendar lahko prilagodite glasnost, začasno ustavite itd. uporabnik ne bo mogel. Nastavitev glasnosti predvajanja zvočne datoteke je konfigurirana v sami kodi.

Formati zvočnih datotek za predvajanje glasbe na spletnem mestu so lahko: WAV, AU, MIDI, MP3, OGG (razširitve). Glasbene datoteke se naložijo na spletno mesto ali se uporabljajo povezave do tistih spletnih mest, kjer se nahaja zvočna datoteka, glavna stvar je, da je v javni domeni.

Vendar pa so internetne vsebine pogosto unikatne, na primer ne vključujejo le glasbe, ampak tudi komentarje izvajalcev, intervjuje, najrazličnejše zgodbe o ustvarjanju itd.

Ustvarjenih je bilo neverjetno število pripomočkov za prenos pretočne vsebine iz interneta - nekateri so univerzalni, drugi so "prilagojeni" za posebne storitve. Nekateri programi dobijo dostop do izvornih avdio in video datotek in jih preprosto berejo bajt za bajtom iz interneta, nekateri pa lahko prenašajo datoteke, nalagajo datoteke v več tokov, delajo s skupinami datotek itd. Opis toka je lahko xml datoteko v formatu ASX (za Windows Media Player) ali shranjeno v datotekah formata RealAudio (razširitve .ra in .rm - za zvok, .rv - za video) itd. Takšni tokovi se dostavljajo ne le prek standardnih protokolov http , udb / tcp, temveč tudi prek posebnih - rtsp, mms, rtp, pa tudi prek tehnologij enakovrednih, ki se uporabljajo na primer v tako priljubljeni storitvi internetne televizije, kot je SopCast. Za predvajanje teh formatov seveda potrebujete ustreznega odjemalca - recimo Windows Media Player, VLC media player itd. Slednji, mimogrede, ne more samo predvajati pretočne vsebine, ampak jo tudi shraniti na lokalne pogone. To bomo uporabili, ker je večina sredstev zanj precej težka.

Torej, če želite posneti spletni radijski program ali posebno podcast, morate najprej pridobiti povezavo do pretočne vsebine in jo nato vnesti v predvajalnik VLC. Če spletno mesto za predvajanje zvoka uporablja Windows Media Player, bo dostop do povezave enostaven. Z desno miškino tipko morate klikniti predvajalnik, vgrajen v stran spletnega mesta, in izbrati »Lastnosti«. V polju »Lokacija« poiščite naslov in ga kopirajte v odložišče. Če spletno mesto uporablja predvajalnik Flash ali predvajalnik, razvit na podlagi HTML5, je verjetno, da boste morali brskati po izvorni kodi strani ali se obrniti na posebne pripomočke, da "iztrgate" povezave.

Naslednji korak je pretvorba pretočnega zvoka. Morda ne morete reči, da je ta operacija v VLC preprosta in očitna. Nasprotno, je okoren in zmeden. Z ukazom menija »Media Open URL« lahko pretočno vsebino zapišete v datoteko. VLC je privzeto konfiguriran za predvajanje povezave, in če jo želite shraniti v datoteko, morate v pogovornem oknu, ki se odpre, način spremeniti v »Pretvori«. Pogovorno okno se bo spremenilo - v novem oknu je prikazana ciljna datoteka in izbran je profil (tj. format, v katerem bo shranjen posnetek). Po kliku na gumb »Start« predvajalnik začne kopirati pretočni zvok v datoteko. To počne popolnoma neopazno in načeloma lahko piše, kolikor dolgo želi - ta proces bo moral nadzorovati neodvisno. Upoštevajte, da ko ustavite in nadaljujete postopek pretvorbe, se nastala datoteka ponastavi na nič. Zato morate preimenovati predhodno shranjene datoteke.

Povsem očitno je, da je vsakokratno ponavljanje takšne operacije zelo težavno. Še posebej, če morate pisati različne teme ob različnih časih. Predvajalnik VLC ponuja preprosto orodje za prenos po urniku, imenovano VLC Configurator. Označuje, kaj in kam pisati (ti parametri so konfigurirani na enak način, kot je opisano zgoraj) in kako dolgo. Na primer, če morate vsak dan posneti določen internetni radijski program, morate v pogovornem oknu nastaviti možnosti »Ponovi« in »Interval med ponovitvami«. Zdaj, po zagonu, bo program samostojno pretvoril pretočno vsebino.

Mimogrede, VLC bo pomagal tudi pri pretvorbi tokov, na primer datotek ASF v MP3, ki je žepnim predvajalnikom bolj znan in razumljiv. To operacijo lahko izvedete bodisi ročno, tako da vsakič pretvorite lokalno datoteko, ali samodejno z uporabo preprostega skripta Powershell, ki je, kot veste, vključen v Windows 7 in je na voljo v prejšnjih različicah tega operacijskega sistema. Skriptu se posreduje več parametrov - pot do datotek, maska ​​datoteke in po želji nastala mapa, v kateri so shranjene datoteke (če ni navedena, se datoteke zapišejo v izvorni imenik). Znotraj zanke se pokliče program VLC, kateremu se pošljejo parametri: kaj kodirati, kam napisati in dejanski parametri kodiranja. Ko je kodiranje končano, se VLC razloži iz RAM-a. To lahko preverite z zadnjim konstruktom, ki čaka, da se proces razloži iz pomnilnika. Takšen skript lahko vnesete v kateri koli urejevalnik besedil - beležnico ali poseben "vizualni" urejevalnik Powershell ISE. Če ga shranite v datoteko, na primer convert.ps1, se zažene s konstruktom, kot je:

. convert.ps1 c:  datoteke  glasba *.asf.

Na koncu velja omeniti še nekaj značilnosti scenarija. Operacijski sistem Windows ne določa samodejno poti do programov, zato mora skript podati tudi pot do vlc.exe: v 64-bitni različici - C: 'Program Files (x86)'  VideoLAN  VLC (upoštevajte, da so vrstice s presledki v narekovajih) in v 32-bitnem - C:  'Program Files'  VideoLAN  VLC  . Prepričajte se tudi, da zapustite program VLC, preden zaženete skript, sicer se bo metoda waitforexit() izvajala za nedoločen čas (zaradi dejstva, da se bo program, ki ga kliče v skriptu, zaprl, vendar bo njegova kopija ostala). Seveda je mogoče identifikatorje procesov obdelati tudi v skriptu, vendar bo takšna možnost samo zapletla. Če želite rešiti to težavo, preprosto dodajte prisilno prekinitev vseh delujočih VLC na začetek skripta: ps vlc* | %($_.kill()). Druga funkcija je povezana z varnostnim sistemom Windows 7, ki zahteva, da so vsi skripti podpisani. Ukaz Set-ExecutionPolicy RemoteSigned vam lahko pomaga obiti to omejitev; zagnati ga morate v Powershell kot skrbnik.

Skript convert.ps1 na Powershell za pretvorbo pretočne vsebine v MP3

param ($inputpath, $wildcard, $outputpath = $inputpath)

ls -path $inputpath  $wildcard | % (

pisanje gostitelja $outputfile

vlc -i dummy $_.fullname ¨:sout=#transcode (acodec=mp3,ab=128,channels=2):standard (access=file,mux=asf,dst=$outputfile)¨ vlc://quit

Izvleček zvoka iz videoposnetkov FLV

Drug primer skupne uporabe VLC in Powershell je pridobivanje zvoka iz videoposnetkov Flash v formatu FLV. Takšni videoposnetki so shranjeni na specializiranih portalih, kot je znani YouTube. Seveda se Google in drugi lastniki video gostovanj po svojih najboljših močeh trudijo preprečiti nalaganje vsebine, a vedno se bodo našli načini, kako zaobiti zaščito in dobiti video, ki vam je všeč ...

Vendar pa je naloga, o kateri razpravljamo tukaj, naslednja: kako iz datoteke FLV, prenesene na kateri koli znan način, izvleči zvok, da bi ga na primer poslušali v žepnem predvajalniku. Takšna operacija je povsem v zmožnostih VLC, tako v GUI kot v ukazni vrstici. Mimogrede, v prvem primeru morate narediti skoraj enak nabor dejanj kot prej: v meniju izberite ukaz »Mediji - Pretvori/Shrani«, določite izvorno in rezultatsko datoteko ter parametre pretvorbe, tj. ustrezen kodek.

Če želite izvesti ročno pretvorbo s pomočjo Powershell, morate, kot prej, sestaviti majhen skript (imenujmo ga flv2mp.ps1), v katerega se pošljejo imena izvorne in ciljne mape (privzeto enako kot vir). Celoten trik je v posredovanih parametrih: ker videoposnetek ni potreben, uporabite navidezni parameter, določite parametre datoteke v standardnem bloku in da vas skript ne moti s pojavnimi okni, jih preprosto blokirajte z možnostjo –dummy-quiet –sout.

param($inputpath, $outputpath = $inputpath)

ls -path $inputpath  *.flv | % (

$outputfile = pridružitvena pot $outputpath($_.name.replace($_.extension, '.mp3'))

pisanje gostitelja $outputfile

vlc $filename -I dummy --dummy-quiet --sout ¨#transcode (acodec=mp3,vcodec=dummy):standard (access=file,mux=raw,dst='$outputfile')¨ vlc://quit

ps vlc | %($_.waitforexit())

Glasba na spletnem mestu je bolj redkost kot običajno. Ko vstavljate glasbo na spletno mesto, morate razumeti, da lahko nekatere uporabnike to popolnoma odvrne. V tem članku si bomo ogledali več možnosti za vstavljanje glasbe na spletno mesto in pogledali, kako narediti glasbo v ozadju.

Kako vstaviti glasbo v ozadju na spletno mesto

Vstavljanje glasbe v ozadju na spletno stran je najbolj nevarna možnost z vidika izgube obiskovalcev. Ker glasbe v ozadju ne samo da ni mogoče izklopiti, ampak tudi njene glasnosti ni mogoče na noben način prilagoditi (vse je odvisno od trenutne glasnosti na računalniku). Zato morate stokrat premisliti, preden vstavite glasbo v ozadju.

Obstajata dva načina za vstavljanje glasbe v html

Možnost 1. Prek oznake html

Sintaksa za vstavljanje glasbe v ozadju

Pri oznaki obstaja več atributov:

  • loop="value" - število ponovitev glasbe (če je -1, se ponavlja neskončno)
  • balance="value" - stereo ravnovesje (od -10000 do 10000)
  • volume="value" - glasnost (največ 0, najmanj -10000)

Glasba se samodejno predvaja, ko se stran naloži.

Na primer

Možnost 2. Skozi oznako

Sintaksa za vstavljanje predmeta z glasbo

Pri oznaki Uporabijo se lahko naslednji atributi:

  • width="value" - širina (v slikovnih pikah ali odstotkih)
  • height="value" - višina (v slikovnih pikah ali odstotkih)
  • align="value" - poravnava (levo - levo, desno - desno, sredina - sredina)
  • hidden="value" - vidnost plošče (true - skrij, false - pokaži), privzeto je plošča vidna
  • autostart="value" - predvajanje glasbe ob nalaganju (true - da, false - ne)
  • loop="value" - vrednost true - igra v krogu, false - enkrat

Na primer

Standardni predvajalnik bo za vsak brskalnik videti drugače, zato vsakega od njih ne bomo obravnavali posebej.

V html5 lahko uporabite oznako

Pomen uporabe oznake

Sintaksa oznake

Uporabijo se lahko naslednji atributi:

  • autoplay="value" - vklopite glasbo takoj, ko se stran naloži
  • controls="value" - prikaže nadzorno ploščo predvajalnika v brskalniku
  • loop="value" - odgovoren za cikličnost
  • preload="value" - naloži glasbo takoj, ko se stran naloži

Obravnavane možnosti po mojem mnenju niso idealne rešitve, saj vse temeljijo na standardnih igralcih. Vsak brskalnik bo imel svoj privzeti predvajalnik, v nekaterih pa morda sploh ne bo deloval. Zato je najbolje, da predvajalnik prenesete na svojo spletno stran in z njega naložite glasbo. Takšen predvajalnik bo imel funkcije za ustavitev, prilagajanje glasnosti itd. - vse potreben komplet za običajnega uporabnika.