JS 오류로 인해 비디오 파일 업로드 실패

일반적으로 Discourse는 비디오 업로드를 위한 플랫폼이 아니라는 것을 알고 있습니다. 하지만, 제가 겪고 있는 문제를 해결할 방향을 알려줄 사람이 있을까 해서 문의드립니다.

일부 비디오 파일을 업로드하면 “업로드 중 100%” 상태에 무한정 멈추게 됩니다. 사용자가 취할 수 있는 유일한 조치는 페이지를 새로고침하거나 게시물을 닫는 것입니다. 얼마나 오래 기다리거나 파일 크기가 얼마나 작든 관계없이 이 현상은 반복됩니다.

명백히 어떤 형태의 검증이나 체크 코드가 파일을 멈추게 하고 있는데, 저는 Ruby on Rails / Discourse 개발에 아직 초보라 파일이 어디에서 막히는지 파악하지 못했습니다. 다만, 사용자에게는 매우 불편한 방법이지만 이 문제를 우회하여 파일을 문제없이 업로드하는 방법은 찾았습니다.

같은 파일을 파일 확장자를 .mp4에서 .pdf로 변경하여 업로드하면 아무 문제 없이 업로드가 완료되며, 실제로도 올바른 확장자로 추가됩니다.

예를 들어,
PXL_12234563421LS.mp4로 업로드하면 파일이 무한정 멈추지만, PXL_12234563421LS.pdf로 업로드하면 업로드가 완료되고 게시물에 올바른 비디오 마크다운이 삽입됩니다:

![PXL_20200811_12234563421LS|video](upload://sxVpgLrc3L2MukaD5eS5QOgPY7j.mp4)

이 처리 경로에 익숙하신 분이 이 현상의 원인을 설명해 주실 수 있을까요? 그리고 어딘가에서 이 기능을 비활성화할 방법이 있을까요? 또한, 문제의 정확한 위치를 파악하여 버그를 보고하는 것도 기꺼이 도와주실 수 있습니다. 조금의 가이드라인만 주신다면요.

감사합니다.

4개의 좋아요

아마도 인터넷 문제일 수 있습니다.
하지만 보통 페이지를 새로고침하면 해결되며, 영상을 업로드할 수 있습니다.

답변은 감사하지만, 이것은 인터넷 문제가 아닙니다. 모든 컴퓨터와 브라우저에서 발생하고 있습니다. 이 디스코urs 인스턴스가 실행 중인 네트워크에서 업로드하고 있으므로, 인터넷으로 전송되는 것이 아닙니다.

원본 파일이 여전히 "업로드 중"인 동일한 게시물에서 확장자를 변경했을 때 업로드가 성공했다는 사실은, 디스코urs에서 비디오 파일에 대해 실행되는 코드가 특정 파일을 영원히 처리하지 못하고 있다는 점을 분명히 시사합니다.

1개의 좋아요

콘솔에 표시되는 오류가 있나요?

try.discourse.org에 영상을 업로드해 주시겠어요?

1개의 좋아요

파일 크기가 얼마나 되나요? 최대 파일 크기는 30MB라고 알고 있습니다.

모바일인지 PC인지도 물어볼 뻔했지만, 아래에서 컴퓨터를 언급하고 있으니 필요 없겠네요.

try.discourse.org에서 이 작업을 시도해 보았지만, .mp4 파일이 허용되지 않아 죄송합니다. 원래 게시글에 이를 언급했어야 했는데 그러지 못했습니다.

또한, 이 파일은 8메가바이트밖에 되지 않는 작은 파일입니다. 파일 크기는 문제가 되지 않는 것으로 확인되었습니다.

콘솔에서 에러가 발생하는지 여부에 대해 말씀하셨을 때, 저는 로그를 보고 있는데 업로드가 시작된 후 해당 이벤트에 대해 아무것도 표시되지 않습니다. 제가 봐야 할 다른 콘솔이 따로 있는 건가요?

모바일과 PC 모두 동일한 문제가 발생하며, 이는 분명히 생성된 파일 자체에 관련된 문제입니다. ffmpeg로 파일을 다시 인코딩하면 문제도 사라집니다. 또한 Chrome과 Firefox를 모두 시도해 보았지만 두 브라우저 모두 동일한 문제가 나타났습니다.

명확히 말씀드리면, 제가 하는 일은 단순히 파일명을 "movie.mp4"에서 "movie.pdf"로 변경하는 것뿐인데, 그렇게 하면 갑자기 "업로드 100%"에서 멈추지 않고 정상적으로 업로드가 됩니다.

파일 크기는 8MB이며, 이 문제가 나타나는 영화 파일은 크기에 관계없이 다양합니다. 업로드 과정에서 이 파일이 어떤 경로를 거치는지 파악하고 추적할 수 있다면, 어디서 막히는지를 좁혀낼 수 있을 것입니다.

지금 시도해 보세요. 방금 추가했거든요.

브라우저 콘솔을 말씀하신 건데, 거기에 아무것도 표시되지 않나요? 아니면 서버 로그(/logs)에 표시되나요?

좋아요, 해당 환경에서 재현할 수 있었습니다. 조금 더 작은 예제를 찾아야 했지만, 충분한 예제가 있으니 괜찮습니다 :slight_smile:

첫 번째 사진은 .mp4 확장자로 파일을 업로드하는 모습을 보여줍니다. 아무리 기다려도 "업로드 중 100%"에 멈춰 있습니다. 스크린샷을 찍기 전에 5분 정도 기다렸습니다.

try.discourse.org에서 게시물을 열어 두었고, “업로드 중 100%” 상태에 머물러 있습니다. 사용자: testdub. 이것이 도움이 된다면 좋습니다. 회신이 올 때까지 열어 둘 것입니다.

PDF는 허용하지 않지만 TXT는 허용하므로, 파일명을 .txt로 변경했을 때 업로드가 완료되었습니다.

같은 파일을 .txt 확장자로 업로드하면 몇 초 만에 완료되고 비디오 마크다운으로 표시됩니다.

참고로 업로드한 파일들의 md5 값은 다음과 같습니다:

62b865b29c47acbce859c27246c0d7c3  PXL_20240812_174504425.LS.mp4
62b865b29c47acbce859c27246c0d7c3  PXL_20240812_174504425.LS.txt

해당 파일을 업로드할 때 브라우저 콘솔에서 확인되는 오류입니다:

image

Uncaught IndexSizeError: Failed to execute 'getImageData' on 'CanvasRenderingContext2D': The source width is 0.
    at composer-video-thumbnail-uppy.js:80:31

8998f3f964284f7e0ab4007836dbddd736757617.mp4.gz (3.3 MB)

이것은 클라이언트 측에서 수정해야 할 문제입니다.

2개의 좋아요

네, 감사합니다, 마이클!

나도 비슷한 내용으로 답장하고 있었는데:


파이어폭스의 콘솔을 보면 이런 내용이 보입니다:

Media resource blob:devsite.net could not be decoded, error: Error Code: NS_ERROR_DOM_MEDIA_METADATA_ERR (0x806e0006)

크롬에서는 여기서 무슨 일이 일어나고 있는지 더 잘 파악할 수 있는, 아마도 더 나은 에러 메시지가 표시됩니다:

Uncaught DOMException: Failed to execute 'getImageData' on 'CanvasRenderingContext2D': The source width is 0.
    at https://devsite.net/assets/chunk.d340137c92abde91812c.d41d8cd9.js:74:3649
3개의 좋아요

저도 WordPress에서 비슷한 문제를 겪었습니다. 그 후 MP4 파일이 손상되었습니다. 짧은 MP4 파일은 문제없이 업로드되었으니, MP4 파일 자체나 그 파일을 생성한 프로세스를 확인해 보는 것이 좋겠습니다.

해결하셨나요?

네, 수정 사항을 확인 중입니다.

3개의 좋아요

이 문제의 수정이 이제 적용되었습니다:

3개의 좋아요

Blake님, 이렇게 빠르게 처리해 주셔서 감사합니다! 테스트해 보니 Chrome에서는 잘 작동하지만, Firefox에서는 작동하지 않습니다. 여전히 "Uploading 100%"에서 멈추고, 콘솔에 다음과 같은 오류가 표시됩니다:

Media resource blob:https://devsite.net/a2deff66-3376-4c6e-9cca-f18275c312ce could not be decoded.
Media resource blob:https://devsite.net/a2deff66-3376-4c6e-9cca-f18275c312ce could not be decoded, error: Error Code: NS_ERROR_DOM_MEDIA_METADATA_ERR (0x806e0006)

Firefox 129.0.2에서 테스트했습니다.

추가로 제공해 드릴 정보가 있다면 알려 주세요.

1개의 좋아요

이 수정으로 해결될 것입니다. 이 경우 해당 비디오에 썸네일이 생성되지 않지만, 이번에는 업로드 자체는 막히지 않을 것입니다.

3개의 좋아요

감사합니다. Firefox로 성공적으로 업로드했습니다. 빠른 답변과 후속 조치에 진심으로 감사드립니다!

2개의 좋아요

이 주제는 마지막 답변 후 3일이 지나면 자동으로 닫힙니다. 새로운 답변은 더 이상 허용되지 않습니다.