인프런 커뮤니티 질문&답변

Su Yeoun Lee님의 프로필 이미지

작성한 질문수

워드프레스 제대로 개발하기 - 어드민 편

save_post action 다듬기

미디어에서 이미지 추가시 시간이 좀 느려서...

해결된 질문

작성

·

248

·

수정됨

0

디버깅을 해보고 싶은데요.

어디에서 시작해야 할 지 모르겠습니다.

진입 포인트에 대해 힌트를 주시면 감사하겠습니다.

 

답변 2

1

워드프레스 개발님의 프로필 이미지
워드프레스 개발
지식공유자

안녕하세요 🙂

질문 감사합니다.

워드프레스 미디어 업로더는 파일이 업로드되면 리사이즈를 수행합니다. 리사이즈가 느리면 업로드가 느리다고 느낄 수 있을 것입니다.

리사이즈는 서버 성능을 많이 탑니다. 가격이 낮으면 성능이 그만큼 떨어지고, 이미지 리사이즈는 성능을 타는 작업이기 때문에 느려집니다. 예컨대 오라클 클라우드의 무료 티어를 사용한다면 리사이즈는 상당히 느릴 겁니다.

또, 리사이즈용 플러그인이 설치돼 있다면 느릴 수 있습니다. 예컨대 이미지를 WebP로 변환하는 플러그인이나, 원본까지 리사이즈하는 플러그인, 리사이즈 개수를 늘리는 플러그인이 있을 수 있습니다.

그러나 느려도 정상적인 과정입니다.

물론 서버를 업그레이드하거나 플러그인을 비활성화하는 방법으로 해결할 수 있습니다.

 

미디어 업로드 기능을 디버깅해 보시려면 업로드한 파일이 어디로 전송되는지 찾아 보시면 됩니다. 우선 실마리는 미디어 업로더 페이지에 있습니다. 개발자 도구로 검사해 보시면 form의 action이 /wp-admin/media-new.php를 가리키고 있는 것을 확인할 수 있습니다. 일단 이 파일을 살펴 보는 것도 도움이 될 것입니다.

image업로드를 해 보면 ajax 업로드 경로는 또 다른 걸 알 수 있습니다.

image/wp-admin/async-upload.php인데요. 파일은 하나 올렸는데 두 번 요청이 간 것이 재밌네요. 첫 번째 요청에서는 파일을 multipart/form-data로 전송한 것을 볼 수 있습니다. 응답으로 attachment_id를 받습니다.

image두 번째 요청에서는 방금 받은 attachment_idfetch란 파라미터에 3을 담아서 보내는데요. 응답은 HTML이 옵니다.

imageimage응답받은 HTML은 업로드 결과를 표시하기 위한 것임을 알 수 있죠.

 

설명하다 보니 옆길로 좀 샜는데요. 이렇게 개발자 도구를 통해서 진입점을 찾으시고 디버깅하시면 되겠습니다. (참, 저는 파이어폭스에서 개발자 도구를 사용한 것인데요, 크롬에서는 표시가 조금 다릅니다. 그러나 기능은 같아서 금방 찾으실 수 있을 겁니다.)

 

즐거운 코딩 되시길 바랄 게요~!

감사합니다.

Su Yeoun Lee님의 프로필 이미지
Su Yeoun Lee
질문자

이렇게 정성 가득한 답변을 주실 것이라고는 생각지 않았습니다.

정말이지 뭐라고 감사의 말씀을 드려야 할지 모겠습니다.

정말 감사합니다.

0

안녕하세요, 인프런 AI 인턴입니다.

워드프레스에서 이미지를 추가할 때 속도가 느린 문제를 해결하기 위해 디버깅을 하고자 하신다면, 다음과 같은 절차를 따르시면 좋을 것 같습니다.

  1. 워드프레스 디버깅 모드 활성화: wp-config.php 파일에서 define('WP_DEBUG', true); 를 설정하여 디버그 모드를 활성화합니다. 이렇게 하면 오류 메시지를 더 자세히 볼 수 있습니다.

  2. 플러그인 충돌 확인: 모든 플러그인을 비활성화한 상태로 문제가 해결되는지 확인해보세요. 문제가 해결되었다면 하나씩 플러그인을 활성화하면서 문제를 일으키는 플러그인을 찾아냅니다.

  3. 테마 문제 확인: 기본 테마(예: Twenty Twenty)로 변경하여 문제가 계속 발생하는지 확인합니다.

  4. 서버 로그 확인: 웹 호스팅 계정의 에러 로그를 확인하여 어떤 문제가 발생하고 있는지 파악합니다.

  5. 미디어 라이브러리 문제 확인: 워드프레스 미디어 라이브러리에 너무 많은 파일이 있거나, 서버의 파일 처리 속도가 느린 경우에도 문제가 발생할 수 있습니다.

  6. 서버 리소스 점검: 서버의 CPU, 메모리, I/O 사용량 등을 점검하여 자원 제한에 걸리는지 확인합니다.

  7. 서버 사양 확인: 서버의 사양이 워드프레스 사이트의 요구 사항을 충족하는지 점검합니다. 필요하다면 호스팅 계획을 업그레이드할 수도 있습니다.

각 단계를 체계적으로 따라가면서 문제의 원인을 좁혀갈 수 있습니다. 필요한 경우 워드프레스 커뮤니티나 전문가에게 문의하는 것도 좋은 방법입니다.

질문에 대한 원하는 답을 찾지 못하셨나요?
그럼 인프런 FAQ에서 직접 문의하시면 최대한 빠르게 답변드리겠습니다.

행운을 빕니다, Su Yeoun Lee님!