내정보

Guest 님
보유포인트
0
  • 재구매 할인
    30%
  • 컨텐츠 환불
    100%
  • 평점 포인트
    10%
  • 포인트 자동책정
    0%
콘텐츠 수 404

oembed 애드온 개선판 및 멀티미디어 썸네일 애드온 개선판

최초 등록일: 2021.09.08 조회수 : 221

10P

5.0점 / 총 4명 참여
  • 구매자 18
  • 소개 기존 oembed 애드온 및 멀티미디어 썸네일 애드온의 개선 버젼입니다 
  • 설치경로  
  • 지원환경 Rhymix 
  • 라이선스 MIT License 
  • 분류 애드온
  • 제작자 단비아빠
  • 다운로드
    multimedia_thumbnail.3.0.2.zip 12.3KB (잔여일 : -, 잔여횟수 : -)
    oembed.2.0.2.zip 26.62KB (잔여일 : -, 잔여횟수 : -)

oembed 2.0.2 올렸습니다.

gfycat 추가했습니다

tiktok 추가했습니다

codepen 추가했습니다

captionpics 추가했습니다

mp4, avi, wmv, mpeg, mpg 등의 확장자에 대해 추가했습니다

yql을 써서 안되던 사이트들은 룰을 다 제거했습니다

------------------

멀티미디어 썸네일 수정했습니다.

oembed 수정했습니다.

인스타그램, soundcloud, imgur group에 대한 지원을 추가했습니다

그리고 버그도 하나 잡았구요

-----------------------------------------------------

parserlink 모듈이면 다 될 줄 알았는데

게시판을 보다 보니까 parserlink 모듈에 좀 문제가 있더군요.

base64로 이미지를 db에 저장하는 통에 db 사이즈가 어마어마하게 커진다는...

이미지 저장하는 부분은 덜어내서 가볍게 만들었지만 

parserlink가 최선의 솔루션이 아닐지도 모른다는 생각에 

게시판에 추천된 다른 방법들도 알아봤습니다.

xe 코어에서는 oembed라는 애드온을 쓰고 있더군요.

근데 오랫동안 버젼업이 안되서 방치되고 있는 것 같았습니다.

받아서 써보니까 그냥 jquery.oembed.js를 랩핑한 수준이더군요.

jquery.oembed.js 최신 버젼을 쓰면 될 것 같았습니다.

최신 버젼을 적용했지만 oembed 자체가 CORS 때문에 전에 비해서

안되는 곳이 엄청 많아진 것 같았습니다.

parserlink 모듈이 일일이 서버하고 통신하는 이유를 알 것 같다는...

이놈의 CORS 때문에 너무 짜증나네요... 

그래서 네이버tv, 카카오tv, 네이버 audiocloud, imgur 등은

규칙을 일일히 손으로 추가했습니다.

유튜브, 페북, 트위터는 잘 되기 때문에 

parserlink 모듈보다는 처리하는 곳이 좀 더 많을겁니다.

제가 테스트해본 곳 이외에 어디가 되고 어디가 안되는지는 잘 몰라요.

jquery.oembed.js가 기본으로 잔뜩 규칙을 가지고 있기는 한데

이게 업데이트된지 5년은 지난거라... 지금은 안되는 곳이 엄청 많더라구요.

CORS 문제도 있고.. 야후가 문닫은 문제도 있고.. (yql인가 하는걸 쓰더군요)

뭐 일단 테스트해본 곳만으로 충분할거란 생각은 드는데..

더 필요하심 말씀하세요.

그리고 parserlink하곤 다르게 서버 통신을 안하므로 매우 가볍구요.

그리고 추가적으로 그냥 이미지 링크를 붙여넣었을때도

처리했습니다.

 

https://xetown.com/files/attach/images/1089589/401/610/001/ed99fae067d99c80a9716987e420763d.jpg

 

이런 식으로 이미지 링크만 붙여넣으면 이미지가 나오는거지요.

이렇게 하면 외부 이미지 쓰기 되게 좋은데 왜 이걸 진작에 안지원해줬을까요..

 

그리고 겸사겸사 링크만 붙여넣어도 썸네일도 만들 수 있도록 했습니다.

기존에 멀티미디어 썸네일이라는 훌륭한 자료가 있었습니다만

이 애드온은 링크만으로는 처리가 안되고 iframe으로 붙여넣은 것만

썸네일을 만들어주더군요. (그리고 치명적인 버그도 하나 있더군요..)

그래서 약간? 수정해서 링크만 붙여넣어도 썸네일 만들어지도록 수정했습니다.

그리고 <img> 태그가 없이 이미지 링크만 붙여넣어도

썸네일 만들어지도록 했구요.

다만 링크만 붙여넣었을때 썸네일을 만드는 외부 서비스는 아직 유튜브뿐입니다.

네이버TV 카카오TV도 할려고 했는데 이건 썸네일 URL이 직관적으로 구해지질 않더라구요.

저쪽 서버하고 oembed 통신을 해야만 하는거라서...

이건 나중에 할려고 합니다. 버젼업되면 올려드릴께요.

 

하여튼 이 애드온 2개만 있으면 충분할 것 같습니다.

혹시 문제 있거나 처리를 추가하고 싶은 사이트가 있으면 댓글 남겨주세요.

그리고 oembed 처리는 parserlink 모듈을 안통해도 될 것 같지만

그래도 링크에 걸린 사이트 정보 미리 보는건 여전히 훌륭한 기능 같습니다.

저는 parserlink 모듈도 삼위일체로 함께 쓰려고 합니다. 

아참 parserlink 모듈은 현재 버젼 그냥 쓰시면 oembed와는 기능적으로 겹칩니다.

같이 쓰시려면 parserlink 모듈은 수정해야만 해요.

가능하면 이 3개의 분산된 기능을 하나로 합쳐서 모듈 하나로 만들까 하는데...

그렇게 해도 괜찮을지 모르겠습니다.

GPLv2라.. 제가 멋대로 수정하고 버젼도 올리긴 했습니다만..

아예 서로 다른 프로젝트끼리 합쳐버리면 좀 곤란할 것 같긴 한데요...

댓글 '21'

프로필 사진 profile
웅돌프 2021.09.08 19:34 댓글 별점
1등!! ㅎㅎ
올려주신 파일 2개를 애드온에 넣으면 될까요?
parserlink 모듈을 쓰고 있는데 같이 써도 무방한가요?
프로필 사진 profile
단비아빠 2021.09.08 20:04 댓글 별점
현재 배포되어 있는 parserlink와 oembed는 같이 사용할 수 없습니다.
정확히는 사용하면 서로 따로따로 동작해서 유튜브가 2개씩 나오고 뭐 그럴겁니다 아마...
프로필 사진 profile
웅돌프 2021.09.08 19:38 댓글 별점
참고로 압축 풀면 폴더명이 이렇게 되는데
multimedia_thumbnail.3.0
oembed.2.0.1

뒤에 버전 숫자를 지워야 됩니다.
multimedia_thumbnail
oembed
프로필 사진 profile
웅돌프 2021.09.08 19:45 댓글 별점
유튜브 링크를 남겨도 썸네일이 생성이 안됩니다.
스케치북 (웹진형) 입니다.
프로필 사진 profile
단비아빠 2021.09.08 20:03 댓글 별점
주소 좀 알려주세요
프로필 사진 profile
단비아빠 2021.09.08 20:10 댓글 별점
의심되는 부분을 수정했는데 한번 해보시고 여전히 안되시면 주소 좀 알려주세요
프로필 사진 profile
웅돌프 2021.09.08 23:07 댓글 별점
parserlink 모듈과 함께 사용해서 그런것 같기도 합니다.
다시 해보구 오겠습니다.
프로필 사진 profile
skyo 2021.09.09 00:09 댓글 별점
bb!!! 썸네일 관련해서 유료 자료를 쓰고 있었는데 필요가 없어졌습니다.~
프로필 사진 profile
skyo 2021.09.09 11:44 댓글 별점
버그 리포트 하나 합니다. 댓글에 링크가 포함된 댓글 회신시 js 에러가 나며 에디터를 불러 오지 못하네요
TypeError: undefined is not an object (evaluating 'settings.apikeys[embedProvider.name]')
아래 라인 이라고 합니다.
if (embedProvider.apikey) {
src = src.replace('_APIKEY_', settings.apikeys[embedProvider.name])
}
프로필 사진 profile
skyo 2021.09.09 12:34 댓글 별점
API 키를 입력 할 이유가 없어 보여 그냥 해당 부분 지워 버리니까 잘 동작 하는 것 같은데
다른 어떤 문제점이 있는지는 개발자가 아니라 확실하진 않습니다.
프로필 사진 profile
단비아빠 2021.09.09 20:04 댓글 별점
지금 소스를 살펴보니까 apikey를 필수로 요구하는 링크 타입은 딱 하나 아마존 뿐이네요.
혹시 아마존 관련 링크이셨나요?
아마존 링크가 있어서 oembed 처리를 할려고 했는데 apikey가 셋팅이 안되어 있으니까 에러가 난 것 같습니다. 말씀하신대로 apikey가 없이도 아마존 링크가 잘 처리된다면 구지 apikey를 요구할 필요 자체가 없겠죠. 이 부분은 제가 수정해놓겠습니다. 어차피 apikey를 쓰는 링크가 아마존 하나뿐이니 수정하신 것처럼 replace 하는 코드 자체를 삭제하더라도 실사용에는 전혀 차이는 없을 것으로 보입니다. 그냥 쓰시다가 나중에 새버젼으로 교체하셔도 무방할 듯 싶습니다.
아마존 링크가 아니었다면 제가 좀 상세히 체크할 수 있게 링크를 부탁드립니다.
프로필 사진 profile
skyo 2021.09.09 20:33 댓글 별점
네. 멎습니다. 아마존 링크 였습니다. 삭제해야 보이기는 한데
다만 키가 있으면 다르게 표현 되는지 등,..키값이 부여된 경우 뭐가 달라지는지는 잘 모르겠습니다
프로필 사진 profile
단비아빠 2021.09.14 18:05 댓글 별점
새로 올린 버젼에선 APIKEY가 있으면 집어넣고 없으면 안집어넣게 수정했습니다.
프로필 사진 profile
해태맛동산 2021.09.13 21:43 댓글 별점
감사합니다~
혹시 트위치도 지원이 가능한가요?
프로필 사진 profile
단비아빠 2021.09.13 23:24 댓글 별점
담번 버젼업때 포함시키겠습니다
프로필 사진 profile
맘잉 2021.09.13 23:11 댓글 별점
훌륭한 자료감사합니다
프로필 사진 profile
마음의빈자리 2021.09.14 10:52 댓글 별점
자료 공유 감사드려요 ^^
프로필 사진 profile
karius 2021.09.14 12:39 댓글 별점
훌륭한 자료 감사합니다. 한번 적용해보겠습니다!
프로필 사진 profile
skyo 2021.09.14 17:34 댓글 별점
eBay 가 제대로 동작 하지 않는 것 같습니다.
단비아빠님 홈페이지에서도 테스트 댓글 남겨 두었습니다.
프로필 사진 profile
단비아빠 2021.09.14 18:04 댓글 별점
이베이는 서비스 자체를 중단했네요..
togo라고 해서 플래시로 구현된 서비스가 있었나본데 지금은 사라졌습니다.
대체할만한 다른게 나오지도 않았네요... 룰은 삭제하겠습니다.
프로필 사진 profile
skyo 2021.09.15 08:44 댓글 별점
네, 가장 많이 상요하는 인스타 그램도 조치를 좀 취해야 할 것 같습니다.

instagram.com/xxxx 라는 계정 주소는 불러올 게시물이 없어서 그런지
빈 화면만 보여주는 상황입니다.

인스타 게시물 실제 공유 형태의 게시물 번호가 있는 경우에만 동작 하게 해야 할 듯 하네요
무조건 Instagram.com/p/xxxx 형태로 이뤄지는듯 한데 제가 인스타를 하지 않아 확실하진 않습니다