링크프리뷰 모듈에 들어가는 내장 플레이어인데요.

접근 가능한 멀티미디어 파일을 video 태그에 넣어서 예쁘게 꾸며주고 iframe으로 불러오는 방식입니다.

 

https://dev.aporia.blog/board_fKje48/56240

페이지는 반응형으로 만들었으니까 얼마든지 다양한 사이즈로 임베드가 가능합니다

 

예전에 유튜브 뮤직 플레이어를 만들기도 했었는데, 비디오 플레이어는 그 이상으로 손이 많이 가네요;;;

디자인은 워낙 감각이 없으니까 그냥저냥 하는데, 이벤트 리스너 작업도 많이 해줘야 하고 재생 관련된 동작들 제어도 해줘야 해서 꽤 많은 시간을 투자하고 있습니다.

게다가 한 페이지에 여러 플레이어들이 임베드되는 걸 감안하고 서로 간섭 없이 재생 가능하도록 postMessage 쏴주고 message 이벤트로 받은 다음에 다시 postMessage 쏘고 그럽니다ㅋ

그리고 웹브라우저의 멀티미디어 항목 제어 기능에 제목, 대표 이미지, 재생 시간 등등도 반영하구요.

테스트를 마무리한다고 했는데 아직도 어딘가에 버그가 있을지 모르겠어요ㅜ

 

그나저나 첨부파일로 들어오는 mp3이나 mp4 등등을 웹브라우저 기본 플레이어 말고 이 플레이어를 이용해서 작동시킬 수도 있겠다는 생각이 들고 있습니다.

뭔가 하다 보면 중간에 새로 아이디어가 떠올라서 그때까지 했던 작업들을 처음부터 뜯어고치고 하는 일들의 연속이네요ㅋㅋㅋ

(벌러덩~) 이제 좀 쉬어야겠습니다;;

  • Lv3
    이쁘네요~
    저희는 video.js를 커스텀해서 독자 스킨으로 만들어 사용하고 있는데.. 업로드와 관련된 코어 js를 수정했다보니, 업데이트를 항상 변경점이 있는 파일만 내려받아 하고 있네요 ㅜ_ㅜ
  • Lv3 ? Lv1
    저는 좀 간편해보이는 자바스크립트 소스 팁을 기반으로 해서 시작했는데 결국엔 완전 개조처럼 돼버렸습니다.
    기존 라이브러리를 이용하는 게 속편하겠다 싶었는데, 말씀하신 것처럼 수정사항이 있으면 살짝 번거로워지기는 하겠네요;;
  • ? Lv1 Lv3
    video.js야 서버단에 직접 접근하진 않기 때문에.. 잘 작동하면 그만이라는 마인드이긴 하지만 ㅎㅎ;
    그래서 리팩토링을 하고 있는데 쉽지 않네요 ㅜ
  • Lv7
    엄청 이쁘네요~ 첨부파일도 이렇게 이쁘게 나올 수 있으면 한층 더 퀄리티가 높아지겠네요~
    암튼 새해 복 많이받으시고 너무 무리하지마셔요~ 건강이 최곱니다.
  • Lv7 ? Lv1
    대충은 성공한 거 같아요ㅋㅋㅋㅋ
    https://dev.aporia.blog/board_fKje48/56521
  • ? Lv1 ? Lv2

    남기신 링크에서 재생을 시도하면
    Uncaught (in promise) DOMException: The media resource indicated by the src attribute or assigned media provider object was not suitable.
    registerEvent https://dev.aporia.blog/modules/preview/libs/src/js/video_player.js:381
    와 같은 에러메세지가 표시되고있어요.
    근데 막상 원본 주소로 접속해서 재생해보면 잘됩니다.

    윈11/파이어폭스 134 입니다.

  • ? Lv2 ? Lv1
    아앗, 브라우저 문제겠죠?사파리 계열에서도 잘 되던데ㅜ
    오늘 저녁에 훑어보도록 하겠습니다. 에고...
  • ? Lv1 Lv7
    와우. 대단하십니다!!
  • ? Lv2 ? Lv1

    비디오 플레이어 html 파일에서 코어에 내장된 jQuery-2.2.4를 불러오고 있었는데, 3.6.3으로 바꿔주니 윈도우11 / 파이어폭스 134.0 (64비트) 버전에서도 잘 되는 것 같습니다.
    왜 때문인지는 잘 모르겠지만요ㅡㅜ

    순수 자바스크립트를 그냥 쓸 걸 괜히 귀찮다고 jQuery 썼다가 요상한 버그를 다 만났었네요;;;

    버그 짚어주셔서 감사합니다!

  • Lv6
    역시 윤삼님 대박
  • Lv6 ? Lv1
    아직 보완할 게 많아서 첩첩산중입니다ㅎㅎ
  • ? Lv1 Lv6
    윤삼님 성격상 미루지 못하시니 ㅎㅎㅎ
    건강 잘 챙기십시오.