Audio 및 Video

[- Disclaimer -] 아래 내용은 정보보안 공부 목적으로 작성된 것이나, 이를 토대로 허가되지 않은 대상에 실습을 진행할 경우 해킹 시도로 간주하여 법적 처벌을 받을 수 있음을 알려 드립니다.

✦ Web Browser 상에서 재생 불가능한 비 표준 Media 등 외부 파일 삽입/재생

✧ Java Applet, Flash, PDF 등

✦ 추가 Plugin 필요

<object data="dodoria.pdf" name="호랑이삼촌" type="text/html" width="1000" height="1000">
</object>
Plain Text
복사

✦ <object> 미지원 Web Browser에서는 <embed> 사용

<embed src="dodoria.pdf" name="호랭이삼촌" type="text/html" width="1000" height=1000">
</embed>
Plain Text
복사

✦ Web Browser 상에서 재생 가능한 표준 Media 삽입/재생

// <audio>
src 속성: 경로
controls 속성: Media 제어기 표시
autoplay 속성: 자동 재생
               보안 상 잘 안 먹을 수 있음
loop 속성: 반복 재생 수
preload 속성: Web Browser에서 미리 Loading 여부
              auto        // Load 후 바로 Audio 다운 (Default)
              metadata    // 사용자가 재생 전까지 Audio 크기, 관련 정보 등 Meta Data만 다운
              none        // 사용자가 재생 전까지 Audio 다운 안함
Plain Text
복사

// <video>
src, controls, autoplay, loop, <audio> 속성과 동일    // preload도 유사
videoWidth 속성, videoHeight 속성: Video 자체 너비 및 높이
poster 속성: Loading 시 표시 Image
Plain Text
복사

✦ Ex) - 1

<audio controls src="C:\Users\aapsemiordoenus\Desktop\Ys VIII OST - Next Step Toward The Unknown.mp3" loop="2" autoplay>
ㅇㅅㅇ 어때
</audio>
Plain Text
복사

✦ <source>

✧ Web Browser 상에서 해당 Audio 파일 형식 미지원 시 여러 형식으로 지정하여 되는 걸로 재생 가능

<audio controls autoplay>
    <source src="C:\Users\aapsemiordoenus\Desktop\Vince Staples - Waterpark.mp3" type="audio/mp3">
    <source src="C:\Users\aapsemiordoenus\Desktop\Vince Staples - Waterpark.ogg" type="audio/ogg">
    <source src="C:\Users\aapsemiordoenus\Desktop\Vince Staples - Waterpark.wav" type="audio/wav">
도키도키요
</audio>
Plain Text
복사

✦ Ex) - 2

<video controls src="brandish 2 - Soldiers` Sorrow.mp4" width="100" height="100" preload="none">
</video>
Plain Text
복사

<video width="360" height="240" src="landstalker - Treasure Hunter Nigel(Remix).mp4" preload="metadata">
</video>
Plain Text
복사

✦ 영상 상의 src 영역 복붙

✧ <iframe>을 <embed>로 바꾸어도 무관

<iframe width="560" height="315" src="https://www.youtube.com/embed/ycNOfscqWU8" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" allowfullscreen></iframe>
Plain Text
복사

<embed width="560" height="315" src="https://www.youtube.com/embed/ycNOfscqWU8" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" allowfullscreen></embed>
Plain Text
복사

<a href="https://www.youtube.com/embed/ycNOfscqWU8" target="hello">ㅇㅅㅇ</a><br />
<iframe src="https://aapsemiordoenus.tistory.com" name="hello" width="800" height="600" frameborder="0"></iframe>
Plain Text
복사