새소식

Framework/✨ Google Firebase

[Firebase] Cloud function을 이용하여 Firebase SEO 이슈를 해결하는 방법

  • -
728x90

Intro

안녕하세요. 이사작전의 개발팀 플랫폼공작소입니다. 오늘은 Firebase Cloud function을 이용하여 Firebase SEO 이슈를 해결하는 방법을 공유하려합니다. 포스팅에 reference를 충실히 남깁니다. 모두 참고하였던 문서이며 정상적으로 동작하는 문서이니 참고하시면 해결하실 수 있습니다.


이슈 발생

Firebase로 개발된 프로젝트에서 SEO문제가 발생

구글에서는 노출이 정상적으로 이뤄지나,

네이버 웹 마스터 분석 결과, 제목이 같은 페이지가 다수 발견


해결

Firebase SEO이슈를 function과 선례를 응용하여 해결

https://www.google.co.kr/search?q=firebase+function+seo&oq=firebase+function+seo&aqs=chrome..69i57j69i60.8037j0j4&sourceid=chrome&ie=UTF-8

https://hackernoon.com/firebase-to-the-rescue-dynamic-routing-via-hosting-functions-integration-aef888ddf311

https://gist.github.com/pejalo/1715c896658d660e0ded0d49d9910896


Cloud 함수로 동적 콘텐츠 제공, 메뉴얼

https://firebase.google.com/docs/hosting/functions?hl=ko


function 중요한 특이사항

URL을 입력하였을 때, 해당 URL에 매칭되는 파일이나 폴더가 없어야 function이 동작합니다. -   -;

rewrite rule is only applied if a file or folder does not exist at the specified source, and returns the actual content of the file at the destination instead of an HTTP redirect.

https://stackoverflow.com/questions/44871075/redirect-firebase-hosting-root-to-a-cloud-function-is-not-working


함수 및 호스팅 배포 명령어

firebase deploy --only functions

firebase deploy


결과

Cloude Functions으로 SEO 이슈 해결



SPA방식은 UX에 좋은 영향을 미치나 SEO에는 치명적. 그 이슈를 해결하기 위해서, 티스토리 URL처럼 https://이사작전.com/posts/123으로 HTTPS요청을 받으면 저 Node.js 함수가 동작, SEO에 영향을 미치는 meta 태그를 수정한 다음에 원하는 페이지인 https://이사작전.com/detail.html로 이동하도록 개발.



결국 SEO의 초석은 기술적으로 HTML의 TITLE, description 등을 동적으로 바뀌게 만들고 검색엔진이 인식할 수 있게 만드는 것입니다. 키워드 작업 따위는 마케터의 도움에 힘입어 작업하면 되는 것이지요. 아래의 결과는 네이버 웹 마스터 도구의 웹 페이지 최적화 검증의 결과입니다.


URL : https://이사작전.com/posts/2/-LH2Lz85BE70Fpt__pdw/인천광역시


URL : https://이사작전.com/posts/2/-LGYPoPNJuQkCmseKRb_/인천광역시

정상적으로 반영된 것을 확인할 수 있었습니다. 위 포스팅이 도움이 되었기를 바랍니다.

궁금한 점이 있다면 댓글남겨주세요. 감사합니다.


#firebase #function #seo #cloud

반응형
Contents

포스팅 주소를 복사했습니다

이 글이 도움이 되었다면 공감 부탁드립니다.