게시글에 내장된 GIF가 로컬로 다운로드된 후 정지됩니다

안녕하세요,

Discourse 게시물에 커스텀 GIF( ScreenToGif으로 생성)를 임베드할 때 문제가 발생하고 있습니다. GIF를 임베드하면 잠시 동안은 정상적으로 재생되다가 첫 번째 프레임에서 멈추는 현상이 발생합니다. 예를 들어:

게시물 미리보기에서는 정상적으로 동작하는 것처럼 보입니다. 또한 업로드한 GIF를 새 탭에서 열어도 정상적으로 재생됩니다. Discourse 본문에서만 멈추는 현상이 발생합니다.

다음과 같이 네 가지 우회 방법을 시도해 보았습니다:

  1. GIF를 다른 웹사이트(예: S3 버킷)에 업로드한 후 링크를 걸었습니다. 시스템 봇이 파일을 로컬로 다운로드하기 전까지는 정상적으로 작동했지만, 다운로드가 완료된 시점부터 다시 멈추기 시작했습니다.

  2. 리사이징 문제일 수도 있다고 생각하여 이미지 마크다운 형식을 제거해 보았습니다. 예를 들어:

    ![](upload://4IHl8zz0sJiYl5Vm3H21YTEFo9z.gif) 
    

    대신 이렇게 사용했습니다:

    ![example|690x383](upload://4IHl8zz0sJiYl5Vm3H21YTEFo9z.gif) 
    
  3. 링크를 새 탭으로 열었을 때 GIF가 정상 작동했으므로, ‘upload’ 약식 URI를 업로드된 이미지의 전체 URL로 대체해 보았습니다. 예를 들어:

    ![example|690x383](https://global.discourse-cdn.com/meta/original/3X/2/1/211635b9ae2b0960e8e135299b3a91189b00c289.gif)
    
  4. 마지막으로, 문제가 Discourse의 마크다운 코드 해석 방식과 관련이 있을 수도 있다고 생각해 업로드된 이미지의 전체 URL을 사용하여 원시 HTML 이미지 태그를 사용해 보았습니다:

    <img src="https://global.discourse-cdn.com/meta/original/3X/2/1/211635b9ae2b0960e8e135299b3a91189b00c289.gif">
    

아쉽게도 아무것도 효과가 없었습니다. 게시하려는 포럼을 직접 관리할 수 있었다면 로컬 다운로드 기능을 비활성화할 수 있었을 텐데, 아쉽게도 그럴 수 없습니다!

여기에서는 정상적으로 작동하지만, 귀하의 사이트에서는 작동하지 않는 것으로 보아, 사이트를 다시 빌드한 후 다시 시도해 보시는 것을 권장합니다. 최근 GIF 관련 부분에서 많은 변경 사항이 있었습니다. 귀하의 보고서와 유사한 버그가 발생한 기간이 있었고, 귀하의 사이트가 영향을 받은 버전일 수 있습니다.

그게 문제가 아니라고 생각해요. 제 환경에서는 동작하지 않거든요. 첫 번째 프레임만 보일 뿐이에요.

크롬의 다른 기본 설정 때문에 이런 문제가 발생하는 건가요?

아, 크롬에서 재현할 수 있네요. 정말 이상하네요.

원본

Gifscicle로 최적화한 결과
weird_optimized

Gifscicle로 처리한 후에는 잘 동작합니다:

재현해 주셔서 감사합니다. 최적화를 위해 어떤 gifcicle 명령어를 실행하셨나요?

간단합니다:

gifscicle original.gif -o fixed.gif

참고로 Discourse는 자동 재생 mp4와 WEBP 모두를 지원하므로, 더 나은 결과를 얻을 수 있습니다!

파일 크기 문제라고 생각하지 않아요. 훨씬 크거나 작은 GIF 파일로 시도해 봤지만, 여전히 안 되거든요.

좋아요, 제 실제 gif 파일에서도 이 방법이 작동하는지 확인해 볼게요. 끝나면 업데이트하겠습니다.

확실히 파일 크기의 문제가 아니라, gifscicle가 수정하는 "잘못된 형식"의 파일입니다. 일부 도구가 잘못된 파일을 생성하는 것은 흔한 일이죠. 저는 공유하기 전에 ffmpeg 같은 좋은 도구를 통해 GIF를 항상 처리합니다. 하지만 예를 들어 차원이 특이한 경우에도 여전히 쉽게 잘못된 형식의 파일이 될 수 있습니다.

GIF는 복잡한 형식이며, 대부분의 용도에는 MP4나 WEBP와 같은 더 나은 옵션이 nowadays 있습니다.

내 모든 GIF에서 작동했습니다. 경우에 따라 --colors 256 플래그도 추가해야 했습니다.

궁금해하시는 분들을 위해, 원래 버그가 있던 GIF는 ScreenToGif의 “Neural Network” GIF 생성기로 만들었습니다.

도움 주셔서 감사합니다 @Falco

@nbianca GIF 썸네일이 애니메이션되지 않는 이유에 대해 혹시 아이디어가 있으신가요? 원본 GIF는 한도 내에서 문제없는 것 같은데…

Firefox에서는 애니메이션이 재생됩니다. GIF 파일이 잘못 형성되었거나 Chrome의 버그일 가능성이 있습니다.

최신 FF / Windows 10 환경에서는 애니메이션이 재생되지 않습니다.

흥미롭네요! 제 Linux 환경에서는 다음과 같이 표시됩니다. 왼쪽은 Firefox, 오른쪽은 Chrome입니다:

이 주제에 있는 모든 GIF가 저에게는 애니메이션으로 표시됩니다(Chrome on Arch Linux). 하지만 현재 FastImage 버전은 이 버그 때문에 애니메이션이 아니라고 합니다.

그렇다면 늦기 전에, 빠를수록 좋으니 그 머지를 서둘러 진행해야겠어요 :+1:

참고로, gifsicle이 작동하지 않는 몇 가지 경우를 발견했습니다. 구체적으로, 제대로 작동하는 GIF를 얻으려면 때로는 --colors 256 플래그가 필요하고, 다른 때는 이 플래그를 생략해야 합니다.

안녕하세요,

해당 문제의 수정이 승인되었으며, 최신 버전에서 사용할 수 있습니다.