Firebase-tools: prerender.io와 함께 호스팅 사용

안녕하세요,

현재 Firebase 호스팅의 재 작성 / 리디렉션 규칙은 사전 렌더링 서비스에 대해 충분히 상세하지 않지만 일부 고객은 html5 pushState를 사용하여 상당히 정적 인 사이트의 빌드 프로세스에 사전 렌더링 단계를 성공적으로 구축했습니다. 단일 페이지 앱을 기반으로 모든 페이지를 미리 렌더링하여 올바른 콘텐츠가 크롤러에 제공되도록 한 다음 사용자가 다른 페이지로 이동하면 웹앱이 페이지를 새로 고치지 않고 다시 렌더링합니다.

이것은 분명히 매우 복잡하고 분명히 이상적이지 않지만 우리는 이것을 훨씬 덜 고통스럽게 만들기 위해 노력하고 있습니다.

도움이되는 희망

크리스

겨우 두 달 밖에 안 됐다는 건 알지만, 업데이트가 있나요? 여러분은 현재 Google 소유이므로 firebase로 호스팅되는 사이트가 검색 서비스에 의해 색인 생성되기를 원한다고 가정합니다.

현재로서는 이에 대한 구체적인 업데이트가 없습니다. 단지 SEO가 우리에게 분명히 중요하고 Firebase 호스팅을 개발자와 관련되게 유지하는 것뿐입니다. 곧 업데이트를 받길 바랍니다.

안녕하세요! 이 업데이트의 상태를 알고 싶었습니다. 곧 올까요? 나는 Firebase 호스팅을 사용하고 내가 걱정하는 유일한 것은 SEO, 내 사이트가 Google 어디에도 표시되지 않고 firebase와의 SEO 통합을 검색했지만 솔루션을 찾을 수 없다는 것이 좋습니다. 나는 모든 것을 한곳에 보관하는 것을 정말로 좋아하므로 내 페이지를 Google의 크롤러 엔진에 제공 할 수있는 다른 서비스로 변경하는 것은 부끄러운 일입니다. Firebase가 현재 Google에서 소유하고 있다는 것을 알고 있기 때문에 이것은 큰 개선이 될 것입니다. 감사합니다!

이 서비스에도 여전히 관심이 있습니다. 감사!

스레드에 내 목소리 추가-이 기능이 있으면 좋을 것입니다!

+1

이것도 기다리고 있습니다.

대안으로 https://divshot.com + firebase를 사용하려고합니다.

+1

최근 DIvshot 및 Firebase 병합 발표로 인해이 문제가 다시 발생합니다. 실제로 무료 사용자 정의 도메인 및 prerender.io 기능을 모두 사용하기 위해 Divshot으로 이동했습니다. Fireabse는 이러한 문제를 어떻게 처리할까요? 프리 티어에 커스텀 도메인을 추가 하시겠습니까? prerender.io는 어떻습니까?

우리는 JS 사전 렌더링을 Firebase 호스팅으로 가져올 수있는 방법을 조사 중이지만 현재로서는 공유 할 확고한 계획이 없습니다. (개인 메모 : 나는 그것이 일어나는 것을 정말로보고 싶다).

Firebase는 모든 사이트가 HTTPS 전용이어야한다고 생각하기 때문에 사용자를 대신하여 SSL 인증서 프로비저닝을 관리합니다. 그렇게하는 데 드는 비용으로 인해 무료 맞춤형 도메인 호스팅을 제공 할 수 없습니다.

엄청나게 빠른 (말장난 의도 된) 답변에 감사드립니다.

어떤 종류의 SEO 기능은 정적 웹 앱 호스팅 플랫폼에 필요한 것 이상이므로 12 월 중순까지 작동 할 수 있기를 바랍니다. 그렇지 않으면 많은 개발자가 구식 호스팅 제공 업체로 전환해야합니다 (불행히도 저를 포함 ).

두 번째 대답은 완벽하게 이해되며 유료 계층으로 점프하는 것을 고려합니다. 동일한 추가 확장을 제공하지 않는 것이 유감입니다.

Firebase 호스팅 사이트의 100 %가 Fastly의 엄청나게 빠른 CDN에 있습니다. 무료 플랜 (사용자 지정 도메인이 아님)에서도 Divshot의 고성능 플랜의 모든 특전을 얻을 수 있습니다. 대역폭의 경우 10GB는 정적 웹 사이트에서 _ 많은 _ 대역이됩니다.

Divshot의 고성능 특전에 대해 알지 못함을 인정해야합니다. 어쨌든 내 앱을 마이그레이션하고 백엔드를 준비하고 새로운 기능을 지연해야 할 수도 있지만 CS 학위는 거의 모든 시간을 소모합니다. 내 프로젝트는 그렇게 발전하지 않았지만 다른 사람들은 엄청난 지연을 겪을 수 있으므로 Firebase가 SEO 친화적이되도록 도와 주거나 Divshot이 종료를 지연시킬 수 있기를 바랍니다. 나는 이것이 아마도 선택 사항이 아니라는 것을 이해하지만, 우리 중 일부가 마이그레이션하면 결코 돌아 오지 않을 수도 있습니다.

@mbleigh 인수를 축하합니다!

@DamodarSojka , 나는 당신과 완전히 동의합니다. 저는 기존 Divshot 유료 사용자입니다. 사전 렌더링은 Facebook에서 내 웹 사이트의 마케팅 / 공유를위한 필수입니다. Firebase에서 곧이 기능을 제공하지 않으면 다른 웹 호스팅 서비스로 마이그레이션해야합니다.

SEO 기능에 +1

우리는 또한 Divshot 고객에게 비용을 지불하고 있으며 Prerender 지원이 필요합니다. Divshot의 Prerender 지원은 이상적이지는 않지만 (공유 후 production.blabla.divshot.io URL 때문에) Firebase에서 Prerender 지원이 전혀 없다면 사용할 수 없습니다. 감사.

마찬가지로, SEO는 prerender.io를 사용하든 다른 유사한 솔루션을 사용하든 가장 중요합니다. divshot이 종료되기 전에 Firebase에서이 문제를 해결해야합니다.

그래도 서재응에 문제가있어

+1-유료 Divshot 고객, Firebase로 마이그레이션하려면 Prerender 지원이 필요합니다.

Completley는 동의합니다. Firebase는 사전 렌더링 기능이없는 경우 Divshot 대체품이 아닙니다. 저는 Divshot 유료 사용자입니다. Divshot이 종료된다는 2 개월의 통지와 함께. 다른 서비스로 마이그레이션해야합니까? 서버 구성에 시간을 투자해야합니까? 아니면 내가하던 일에 계속 집중할까요? 이것이 서비스의 아이디어 아닙니까? 서버 문제를 처리 할 필요가 없습니까? Firebase가 12 월 14 일 옵션인지 아니면 서버 구성에 시간을 할애해야하는지 설명해주세요.

Gents, Mike는 이미이 기능의 상태를 전체적으로 언급했습니다. 우리는 JS 사전 렌더링을 Firebase 호스팅에 가져올 수있는 방법을 조사 중이지만 현재로서는 공유 할 확고한 계획이 없습니다. (개인 메모 : 나는 그것이 일어나는 것을 정말로보고 싶다).

타임 라인이 없습니다. 우리는 당신만큼 그것을 원합니다.

무엇을해야하는지 스스로 결정해야합니다. 우리는 공공 도로지도가 없습니다. 요청이나 쿼리의 수에 관계없이 타임 라인에서 보장 할 수 없습니다. 행복하지 않은 솜털 대답은 아니지만, 현실적인 대답이 계획에 더 유용하길 바랍니다.

☼, 카토

당신이 그것에 대해 정말로 관심이 있다는 것을 보니 반갑습니다 :) 여러분 감사합니다!

@mbleigh / @katowulf Firebase에 JS 사전 렌더링을 도입하려는 계획에 대한 한 가지 질문 : Firebase가 제공하는 현재 SEO 지원이 JS 사전 렌더링이 어떻게 더 좋아 질까요?

이 SO 답변을 기반으로 Firebase는 이미 ng-conf 2015 이후로 즉시 SEO를 제공하고 있습니다.

그래서 나는 여전히 Prerender.io를 Firebase에서 사용하려는 전문가를 얻지 못합니다.

@douglascorrea for Google SEO 개선 사항은

이것에 대한 가장 큰 이득은 Facebook OpenGraph 태그, Twitter 카드 및 Google 이외의 검색 엔진에 대한 더 나은 지원을 제공하려는 사이트에 있습니다.

이 일을 명확히하고 나를 우리가 정말 자신의 의견에 말했다 지원 또는 @drtriumph 같은 대체 어떤 종류의 것인지 생각하게 당신을 @mbleigh 감사드립니다.

나는 해결책을 찾고 있었고 다른 독자들에게 도움이 될 수있는 다음 세부 사항을 발견했습니다.

• 2015 년 10 월에 Google은 _escaped_fragment_ 및 해시 뱅 (! #) 사용 권장 사항을 더 이상 사용하지 않습니다. 따라서 Google의 경우 모든 SPA는 html5 pushstate (angularjs의 html5mode)를 사용해야합니다. 그러나 그들은 hashbang (! #)을 계속 지원하고 잠시 동안 이스케이프 된 조각으로 번역 할 것입니다.
• Facebook 및 기타 크롤러는 여전히 escaped_fragment가 필요합니다. Facebook 자동 번역 해시 뱅을 _escaped_fragment 표기법으로 변환합니다. 그리고 아마도 다른 크롤러는 Google의 이전 권장 사항이기 때문에 동일한 작업을 수행합니다.
• Firebase는 아직 User-Agent를 기반으로 한 리디렉션을 지원하지 않기 때문에 크롤러가 hasbangs (! #)를 다음과 같이 escape_fragament로 변환하는 것을 희망합니다.
  URL이 다음과 같은 경우 :
  http://www.example.com/#!/user/1
  그런 다음 다음과 같이 URL에 액세스하십시오.
  http://www.example.com/?_escaped_fragment_=/user/1

따라서 잠시 동안 이것을 알아내는 한 가지 아이디어는 다음과 같습니다.

• html5 pushstate (Angular의 HTML5 모드)를 사용하지 말고 대신 hashbang (! #)을 사용하십시오.
• prerender.io를 사용하여 애플리케이션에서 원하는 모든 페이지의 정적 / 캐시 된 버전을 만듭니다 (일반적인 사전 렌더링 프로세스처럼).
• ?_escaped_fragment_= 폴더로 시작하는 폴더 구조에 캐시 된 버전을 저장하는 플러그인을 개발하고 다음과 같은 폴더를 만듭니다.
  URL이 다음과 같은 경우 :
  http://www.example.com/#!/user/1
  생성 된 폴더는
  ?_escaped_fragment_= +- /user +- /1

1 개의 파일이 실제 html 파일이됩니다.

• firebase-tools를 사용하여 루트 firebase 폴더에 해당 폴더를 배포합니다 (이 프로세스는 크론 작업 등에서 자동화 될 수 있음).

작동 방식 :

• 크롤러가 해시 뱅 URL을 확인하면 ?_escaped_fragment_= URL에 도달하려고 시도합니다. 이러한 폴더에 실제 HTML 파일이 있으므로 Firebase가 게재되고 index.html로 리디렉션되지 않으므로 크롤러가 읽는 HTML은 AngularJS 버전이 아닌 캐시 된 버전이됩니다.

이를 위해서는 모든 페이지에 대해 사전 렌더링을 실행하는 예약 된 작업을 만들고 해당 폴더를 저장하고 Firebase 배포를 수행해야합니다.

Firebase 배포는 부분 배포 (동기화 또는 증분 배포)를 지원하지 않으므로이 프로세스를 담당 할 서버에 배포의 업데이트 된 사본을 유지해야합니다.

설정을 시도하고 작동하는지 알려 드리겠습니다.

다른 헤더 키처럼 "X-Prerender-Token"을 설정하도록 허용 해 주시겠습니까 ???
https://www.firebase.com/docs/hosting/guide/full-config.html
https://prerender.io/install-token

+1

@ srk9 이 스레드의 용도를 변경하는 대신 별도의 문제를 제출하십시오.

이 문제가 종결 된 이유는 무엇입니까? 게시 된 솔루션이 보이지 않습니다.

@douglascorrea , 당신의 아이디어는 어떻게 되었습니까?

감사,
-D

안녕하세요 @bethuneco , 여기에 결과를 게시하지 않은 것에 대해 죄송합니다.

실제로 저는 기사를 작성하려고했지만이 솔루션이 프로덕션에서 작동하도록하기 위해 많은 "기계"로 구성 될 것이라는 사실을 깨달았고 방법을 모르기 때문에 "권장"하는 것이 불편 함을 느끼지 못했습니다. 대규모로 동작합니다.

그러나 기본적으로 앞서 설명한 것처럼 각 배포에 대해 모든 페이지를 사전 렌더링 / 스크랩하고 위에서 설명한 폴더 (/? _ escaped_framgment_ / xxxx)에 결과 HTML을 저장하는 "배포 / 프리 렌더링"서버가 필요합니다. 이러한 "실제 / 물리적"html은 "프리 렌더링 된"페이지가됩니다.

따라서 google / facebook / twitter 크롤러가 페이지로 이동하여 "? _escaped_fragment"접두사를 통해 "이스케이프 된 조각"을 요청할 때마다 실제로 실제 HTML이있는 실제 폴더를 가리키고 해당 HTML이 색인화됩니다.
실제 사용자가 응용 프로그램으로 이동하면? _escaped_fragment를 사용하지 않으므로 동적 페이지를 받게됩니다.

문제는이 "솔루션"이 각 페이지 또는 추가 페이지에 대해 HTML을 계속 생성해야한다는 것입니다. 예를 들어 애플리케이션이 단순한 CMS 인 경우 모든 새 게시물 / 기사 / 페이지에 대해 새 HTML 페이지를 생성하는 프로세스를 실행해야합니다. 그러나 예를 들어 각 사용자가 수백 개의 "프리 렌더링 가능한"페이지를 생성 할 수있는 동적 소셜 네트워크에 대해 이야기 할 때 문제는 더 커질 것입니다. 그러면 사전 렌더링 / 내부 크롤러가 항상 실행되어야합니다. 그리고 그것은 현실 세계에서 스토퍼가 될 수 있습니다.

이것은 작은 앱에서는 작동 할 수 있지만 실제 큰 앱에서는 작동하지 않는 매우 "속임수"솔루션입니다. 크롤러가 갈 때 실제로 HTML을 생성하고 크롤러를 온라인에서 사전 렌더링 할 사전 렌더링 서비스로 자동 리디렉션하지 않기 때문입니다. 일반적인 사전 렌더링 프로세스는 다음과 같습니다.)

따라서 지금까지는 Nginx 서버를 정적 서버로 사용하여 사전 렌더링을 수행하거나 단일 페이지 응용 프로그램에 대해 즉시 사용 가능한 사전 렌더링을 제공하는 https://www.netlify.com/ 과 같은 Divshot 경쟁 업체를 사용해야합니다. .

@douglascorrea ,

확장 된 설명에 감사드립니다. 당신이 Netlify를 처음 언급 한 사람 이니 제가 조사해 보겠습니다.

모든 것을 미리 렌더링하는 것이 작은 사이트에만 적합하다는 것이 맞습니다. 다행히도 내 앱은 상당히 작기 때문에 (최대 약 1,200 페이지) 작동 할 수 있습니다.

가장 간단한 솔루션 (Google이 피하는 솔루션)은 자바 스크립트를 사전 렌더링하고 로봇 사용자 에이전트가 감지되면 HTML을 제공하는 것입니다. Google은 이미 브라우저 외부에서 렌더링을 시연 했으므로 기술적으로 어렵지 않습니다. 광고 사업에서 경쟁자를 돕는 것처럼 보이기 때문에 전략적으로 도전적인 일입니다.

작동하는 것이 있으면 여기에 업데이트를 게시하겠습니다.

혼란 스러울 수있는 사람을 위해 여기에 몇 가지 명확성을 제공하겠습니다.

Firebase 호스팅은 서버에서 JS 사전 렌더링을 지원하나요? 아니, 그렇지 않습니다. 서버 측 사전 렌더링은 우리가 지원하고 싶고 장기적인 로드맵에 있지만 현재 발표 할 특정 날짜 나 일정이 없습니다. 특히 Facebook 공유 또는 Twitter 카드를 사용하는 사람들에게 이것이 고통스러운 점이라는 것을 알고 있으며 앞으로 이에 대해 더 많이 공유 할 수 있기를 바랍니다.

예를 들어 X-Prerender-Token 지원할 수 없습니까? 아니요, 작동하지 않습니다. 사전 렌더링은 ?_escaped_fragment_= URL에서 _ 실제 사전 렌더링 된 콘텐츠 _를 제공해야합니다. 즉, 헤더뿐만 아니라 서버가 인식하고 적절히 처리해야하는 콘텐츠를 의미합니다. 우리가 원하는만큼의 반쪽 측정 솔루션은 없습니다.

어떤 종류의 사전 렌더링이 가능합니까? 현재 할 수있는 유일한 실제 "프리 렌더링"은 정적 사이트 컴파일입니다. 일반적으로이 작업은 Jekyll과 같은 방식으로 수행되지만 로컬에서 헤드리스 브라우저를 사용하여보다 동적 인 사이트를 "프리 렌더링"할 수 있습니다. 각 URL을 철저히 렌더링 한 다음 배포해야하므로 현재로서는 환상적인 사용 사례가 아닙니다. CDN이 쿼리 매개 변수를 제거하고 일반적으로 지원되는 사용 사례가 아니기 때문에 ?_escaped_fragment_ 된 파일 이름을 만드는 것은 불가능합니다.

이것이 다른 크롤러를 차단하기위한 일종의 Google 전략입니까? 아니, 절대 아닙니다. Firebase 호스팅에 사전 렌더링하여 얻을 수있는 이점을 적극 지원하고자합니다. 모두 시간과 자원의 문제입니다.

소셜 미디어 태그 / 대체 SEO 문제로 인해 Firebase 호스팅에서 전환해야했습니다. 기술이 아닌 사람들이 우리가 인터넷의 다른 사람들처럼 우리의 링크에 멋진 사진이 없다는 것을 알아 차릴 때 그것은 거래를 깨는 것입니다.

phantomjs 및 prerender 미들웨어로 사전 렌더링 할 수 있습니다. 오픈 소스이고 잘 작동하지만 작업 작업을 피하기 위해 prerender.io를 사용했습니다. 첫 번째 요청에서는 약간 느리지 만 모든 페이지를 미리 요청하여 페이지를 캐시 할 수 있습니다.

모든 페이지를 요청하는 것도 좋습니다. 몇 가지 테스트를 실행하고 html을 구문 분석하여 태그와 콘텐츠가 올바르게 렌더링되는지 확인할 수 있습니다.

거대한 경고가 있습니다. 사전 렌더링은 라이브 Firebase 데이터에서 작동하지 않습니다. 어떻게 할 수 있습니까? Firebase 데이터는 실시간이며 연결은 지속적입니다. 사전 렌더링은 일회성이며 연결이 닫힙니다. 요청을 계산할 수 없기 때문에 페이지 렌더링이 언제 완료되었는지 알 수있는 방법이 없습니다.

이 문제를 해결할 몇 가지 아이디어가 있습니다.

1. .on("value") firebase 구독마다 GET 요청을합니다. 사전 렌더링 요청 인 경우 구독을 건너 뜁니다. 일반 사용자 인 경우 GET 요청을 건너 뜁니다. .on("child_*") 이벤트에는 작동하지 않습니다.
2. 기본 항목 파일 상단에서 전역 사전 렌더링 플래그를 false 로 설정 한 다음 데이터가로드되면 각 페이지 구성 요소에 대해 플래그를 true 설정합니다. 적절한 디자인을 사용하면 일반적으로 _loading state_ 및 _error state_ 및 _success state_가 있으므로 오류 / 성공 상태 도우미 메서드에서 플래그를 true 합니다.

고통 스럽지만 일부 동적 페이지 만 올바르게 렌더링되지 않으며 특별한 처리가 필요합니다. 여전히 정적 혜택이 비용보다 크다고 생각합니다.

@mbleigh는 앞으로 여러분이 무엇을 생각해

몇 가지 해결 방법을 찾고 있습니다. 백엔드가 필요한 유일한 이유는 트위터 카드와 오픈 그래프입니다. 확실히 백엔드는 동형 렌더링과 같은 단일 페이지 앱에 대해 몇 가지 다른 이점을 제공하지만 그저 좋은 방법입니다. Twitter 및 OG 태그는 공유가 필요한 모든 앱에 중요합니다.

파이어베이스 백엔드가 데이터베이스에서이 객체 / html을 제공하도록 명령하는 일종의 재 작성과 유사한 규칙이있을 수 있습니까?

이러한 객체는 모든 공유가 URL을 방문하거나 공유 버튼을 먼저 전달하는 것부터 시작되므로 미리 준비 할 수 있습니다.

bump .. 방금 Firebase에 놀랐고이 댓글을 읽고 사용할 수 없다는 것을 깨달았습니다 ..
나는 또한 Prerender와 같은 서비스가 필요하기 때문에 작동합니다. 그래서 이것에 대한 개발은 무엇입니까 ??

함께 Google! 당신은 freegin '검색 엔진입니다 !! :웃음:

심각하게 생각. 이건 정말 중요합니다. 이것은 그저 가장 저주받은 가장 중요한 일일 수 있습니다.

나는 그것이 농담 이었다는 것을 알고 있지만, 요점을 말하자면, 그 발언은 Google 검색이나 Google Firebase에 대한 것입니까? 그중 하나만 검색 엔진이고 그중 하나만 Firebase 호스팅을 제공합니다 (웹 페이지를 사전 컴파일하는 것은이 기능을 제공하는 도구와 더 잘 작동하도록 호스팅에 대한 명확한 부가가치가 있긴하지만).

관련 하우스 키핑 메모에서는 firebase-tools (예 :이 OSS 문제 추적기) 와도 관련이 없습니다. 우선 순위 토론에 귀하의 투표가 추가되었는지 확인하겠습니다. 메일 링리스트는 향후 핵심 기능 요청에 대해 연락하기 가장 좋은 곳일 것입니다.

가장 중요한 것은 우리가 이것을 잊지 않았다는 것입니다. 그것은 여전히 ​​우리에게 매우 중요합니다. Google Cloud Functions와 통합하고 애널리틱스, 오류보고, Test Lab을 통해 탄탄한 통찰력을 제공하는 것보다 덜 중요하지만 여전히 중요합니다.

다음에 우선 순위를 논의 할 때이 문제를 다시 언급하겠습니다. 피드백에 귀하의 의견을 추가해 주셔서 감사합니다. ☼☼☼

firebase @katowulf 에 대한 귀하의 노력에 대한 thx!
이것이 내 ng1 애플리케이션의 "호스트"로 firebase를 사용하지 못하게하는 유일한 방법입니다.

여기서 당신은 혼자가 아닙니다. 다른 사람들도 같은 제한에 부딪 혔습니다. 이제 Google에서 자바 스크립트 생성 콘텐츠의 색인을 생성 할 수 있고 Firebase 콘텐츠 색인을 생성하기위한 몇 가지 특별 조항이 있으므로 페이지에로드 된 인증되지 않은 Firebase 데이터는 이미 색인이 생성되고 있어야합니다. 그러나 완전한 사전 컴파일러 지원은 레이더에 있습니다.

@katowulf 는 headsup과

@samvloeberghs 그러나 Google이 이러한 지원을 제공하는 것은 다른 사람들이이를 따를 가능성이 있다는 의미라고 생각합니다. 그래서 저는 이것이 이것을 널리 보급하기위한 올바른 방향으로 나아가는 단계임을 암시하고자했습니다 (그리고 적어도 오늘날 Google과 함께 작동 함).

FB / LinkedIn / Twitter가 우리가 원하는대로 빠르게 전진 할 수있는 Google의 능력을 따를 가능성은 거의 없습니다. 배후에는 항상 주요 플레이어가 있으며 우리는이를 무시할 수 없습니다. 반면에 Google은 Angular Universal을 사용하는 서버 측 컴파일 기능을 제공하는 NG2에서 작업하여 문제를 해결하고 있습니다. :) 👍

구출 각도! 잠깐만 요, 기계 학습이이 모든 것을 해결하지 못한다는 말씀인가요?

2 센트를 제공하기 위해 고객이 소셜 미디어 카드를 최소한 SEO만큼이나 중요하게 여기는 것처럼 보입니다. 최근 프로젝트에서 말하면 Twitter / Facebook은 브랜드가 웹 사이트 링크를 공유하여 자신을 홍보하는 주요 방법이었습니다.

분명히 SEO는 여전히 중요하지만 소셜 미디어 카드를 공격하는 것이 더 간단하고 단기적인 솔루션일까요? 웹 카드는 메타 태그 일 뿐이므로 firebase.json에서 구조를 정의 할 수 있습니까 (보안 규칙과 유사)? Firebase는 트위터 / 페이스 북 크롤러에 적합한 메타 태그를 삽입 할 수 있지만 그렇게 간단하지는 않습니다 .😄

그럼에도 불구하고 훌륭한 작업과 커뮤니티 지원에 감사드립니다. 더 흥미로운 Firebase 기능 (클라우드 기능 👍!)을 기대합니다.

@katowulf , 내 의견은 무엇보다 강한 '범프'였습니다 ... 여러분들은 놀라운 일을하고 있습니다! 나는 전체적으로 Google에 대해 더 많은 농담을 보내고 있습니다. 그러나 저는 Firebase가이 "SPA / PWA-SEO 페이지 렌더링"문제 전체를 소유해야하는 새로운 * Google 부서라고 생각합니다.

이것에 대한 나의 생각은 ...

Google이 세상에 내놓는 모든 제품은 오늘날 우리가 사용하는 모든 플랫폼에서 완벽하게 작동해야하며 원래 제품인 Google 검색이 작동하고 반영하는 빛나는 예가되어야합니다.

SPA는 한동안 사용되어 왔습니다 ..Google에는 [Angular]와 [Polymer] 중 2 개가 있습니다. SEO (Meta Tags / OpenGraph / Schema)를 구현하는 것은 주요 블랙 박스입니다 (백엔드 닌자가 아니라면). Google 검색이 JS 처리를 시작했다는 것은 반가운 소식 이었지만, 이것은 확실히 절반에 불과합니다.

서비스로서의 백엔드 (BaaS) 인 Firebase는 전체 SPA 페이지 렌더링 작업을 원활하게 처리 할 수있는 완벽한 새 * Google 그룹 인 것 같습니다. 나는 여러분이 그것에 대해 알아볼 것이라는 것을 알고 있지만 이것이 중요 / 최우선 기능에 속해야한다고 강하게 느낍니다.

이 헤드 라인을 읽는다고 상상 해보세요 ...

FIREBASE 존재 ...
모든 단일 페이지 애플리케이션 (SPA) 및 프로그레시브 웹 애플리케이션 (PWA)을위한 새롭고 개선 된 SEO!

개발자들은 몰려들 것입니다 : +1 :

우리는 레이더에 이것을 확실히 가지고 있다는 것을 빨리 차임하고 싶었습니다. 중요하지만 다른 많은 것들이 그렇습니다 (Kato가 열거 한 것처럼). 우리는이 문제를 해결하기위한 몇 가지 좋은 방법에 대한 몇 가지 아이디어를 가지고 있지만, 그것들은 우리가 먼저 벗어나야 할 몇 가지 의존성을 가지고 있습니다. 인내심을 갖고 이것이 확실히 우리 마음에 있다는 것을 아십시오!

이것은 실망 스럽습니다. 이제 firebase 대안을 찾고 있습니다 ...

거의 3 년 ...

이것에 대한 업데이트 ..?

firebase가 divshot을 소유하고 있으므로 이제 작동하지 않아야합니까? PLZ 업데이트!

우리는 이러한 종류의 기능에 대한 열망을 잘 알고 있으며 여기에서 더 나은 솔루션을 제공하는 것이 우선 순위입니다. 아직 발표 할 일정이 없지만 여러분에 대해 잊지 않았습니다.

+1

:( :( :(

비슷한 결론에 도달했습니다. 또 뭘 봤어? ;)

Firebase 함수를 공유 링크 끝점으로 사용한 다음 JavaScript 및 링크로 리디렉션합니다.

이것을 보거나 보지 못했을 수도 있지만 Cloud Functions는 이제 Firebase 호스팅과 통합되었습니다 !!!

이는 Firebase 호스팅을 사용한 서버 측 렌더링에 대한 표준 솔루션으로 간주 될 수 있습니다. 즐겨!

@mbleigh OK 그래서 아래와 같은 메타 데이터가있는 전역 헤더 파일이 있으면 현재 프런트 엔드에서 복제되지 않습니다. 클라우드 기능을 설치하면이 기능을 켜는 데 필요한 모든 것입니다.

<meta name="description" content="{{ pageDescription }}">

업데이트 해주셔서 감사합니다.

2017 년 5 월 17 일 오후 5시 39 분에 "Michael Bleigh" [email protected]이 작성했습니다.

이것을 보거나 보지 못했을 수도 있지만 이제 Cloud Functions가 통합되었습니다.
Firebase 호스팅 https://firebase.google.com/docs/hosting/functions
!!!

이것은 서버 측 렌더링에 대한 표준 솔루션으로 간주 될 수 있습니다.
Firebase 호스팅으로. 즐겨!

—
댓글을 달았 기 때문에 수신 한 것입니다.
이 이메일에 직접 답장하고 GitHub에서 확인하세요.
https://github.com/firebase/firebase-tools/issues/33#issuecomment-302268864 ,
또는 스레드 음소거
https://github.com/notifications/unsubscribe-auth/AX5XbtWCdygdw4ozixK5_XcL2Dlznp4Jks5r65M-gaJpZM4CtPYG
.

나는 이것이이 의견에 대한 최선의 문제가 아니라는 것을 알고 있지만 내 문제를 검색하는 Google이 나를 이끌었고 적극적인 토론이있는 것처럼 보이므로 용서하십시오!

firebase에서 호스팅되는 SPA에서 소셜 사이트의 오픈 그래프 템플릿을 렌더링하는 문제를 해결하기 위해 제가보고 싶은 것은 사용자 에이전트를 통한 부하 분산 기능입니다.

클라우드 기능을 사용하여 memcache / cloudsql에서 일부 템플릿 데이터를 추출하고 템플릿 태그를 요청하는 소셜 플랫폼에 렌더링하지만 다른 모든 클라이언트에 대한 정적 호스팅으로 대체하고 싶습니다. 그러면 모든 요청에 ​​대해 전체 서버 측 렌더링이 필요하지 않습니다.

@cdharris Totally, ATM, 내가 window.location을 사용하여 정적 호스팅에 대한 추가 리디렉션 (클라이언트 / 방문자 용)을 만들려고 시도한 함수에 대한 모든 요청을 다시 작성했습니다. SEO 목적으로 작동하지 않았을 수 있습니다. 사회적 목적을 위해.

@mbleigh 크롤러 / 소셜의 요청을 클라이언트 / 방문자와 구별하여 다시 작성하는 옵션이 있습니까? 다른 glob 표현식 중에서 _escaped_fragment_로 테스트했습니다 ... 아무것도 = / 미리 감사드립니다

firebase 함수에서 무엇을 반환할지 결정하는 것이 효과적 일 수 있습니다. 우리는 말할 수 있습니다 : 요구 사항은 Facebot에서 오는 것입니까? 그런 다음 이러한 열린 그래프 태그를 반환합니다. 그렇지 않은 경우 index.html을 반환합니다. 하지만 firebase 함수에서 darn index.html을 어떻게 반환합니까?

fs.readFileSync ( './ index.htm')

2017 년 9 월 13 일 오전 4:34에 "Birowsky" [email protected]이 작성했습니다.

Firebase 함수에서 콘텐츠 결정을 내릴 수 있습니다. 우리는 말할 수있다:
요구 사항은 Facebot에서 오는 것입니까? 그런 다음 이러한 열린 그래프 태그를 반환합니다. 그렇지 않다면
index.html을 반환합니다. 그러나 어떻게하면 a에서 darn index.html을 반환합니까?
firebase 함수?

—
댓글을 달았 기 때문에 수신 한 것입니다.
이 이메일에 직접 답장하고 GitHub에서 확인하세요.
https://github.com/firebase/firebase-tools/issues/33#issuecomment-329140134 ,
또는 스레드 음소거
https://github.com/notifications/unsubscribe-auth/AX5XbrXQNbVMhRmeZQTbx3Z3vi0c1HXTks5sh728gaJpZM4CtPYG
.

@megamindbrian 함수가 호스팅 된 파일에 액세스 할 수 있음을 암시합니까? 어디에나 문서화되어 있습니까? 어쨌든 고맙습니다!

예. 그것이 내가 그것을 사용한 것을 기억하는 방법입니다. 문서를 찾으려고 노력하는 좋은 질문입니다.

2017 년 9 월 13 일 오전 7:09에 "Birowsky" [email protected]이 작성했습니다.

@megamindbrian https://github.com/megamindbrian 은
함수가 호스팅 된 파일에 액세스 할 수 있습니까? 어디에나 문서화되어 있습니까?
어쨌든 고맙습니다!

—
당신이 언급 되었기 때문에 이것을 받고 있습니다.

이 이메일에 직접 답장하고 GitHub에서 확인하세요.
https://github.com/firebase/firebase-tools/issues/33#issuecomment-329179741 ,
또는 스레드 음소거
https://github.com/notifications/unsubscribe-auth/AX5XbobjixHUterg61PAFmLc9v72C7kyks5sh-IogaJpZM4CtPYG
.

여기 하나
https://stackoverflow.com/questions/42960506/how-can-i-read-and-write-to-firebase-storage-from-within-cloud-functions-for-fir

2017 년 9 월 13 일 오전 7:09에 "Birowsky" [email protected]이 작성했습니다.

@megamindbrian https://github.com/megamindbrian 은
함수가 호스팅 된 파일에 액세스 할 수 있습니까? 어디에나 문서화되어 있습니까?
어쨌든 고맙습니다!

—
당신이 언급 되었기 때문에 이것을 받고 있습니다.
이 이메일에 직접 답장하고 GitHub에서 확인하세요.
https://github.com/firebase/firebase-tools/issues/33#issuecomment-329179741 ,
또는 스레드 음소거
https://github.com/notifications/unsubscribe-auth/AX5XbobjixHUterg61PAFmLc9v72C7kyks5sh-IogaJpZM4CtPYG
.

이것은 임시 디렉토리를 사용하지만 파일에서도 작동한다고 생각합니다.
프로젝트와 함께 업로드했습니다. 불변 일 수 있으므로
예제는 파일을 다른 곳에 저장하기 위해 오프로드하는 것입니다.
https://firebase.google.com/docs/storage/extend-with-functions

2017 년 9 월 13 일 오전 7:12에 "Brian Cullinan" [email protected]이 작성했습니다.

여기 하나 https://stackoverflow.com/questions/42960506/how-can-i-
Cloud-functions-for-fir에서 firebase-storage-to-firebase-storage-to-read-and-write-to-firebase-storage-from-in-cloud-functions-for-fir

2017 년 9 월 13 일 오전 7:09에 "Birowsky" [email protected]이 작성했습니다.

@megamindbrian https://github.com/megamindbrian 은
함수가 호스팅 된 파일에 액세스 할 수 있습니까? 어디에나 문서화되어 있습니까?
어쨌든 고맙습니다!

—
당신이 언급 되었기 때문에 이것을 받고 있습니다.
이 이메일에 직접 답장하고 GitHub에서 확인하세요.
https://github.com/firebase/firebase-tools/issues/33#issuecomment-329179741 ,
또는 스레드 음소거
https://github.com/notifications/unsubscribe-auth/AX5XbobjixHUterg61PAFmLc9v72C7kyks5sh-IogaJpZM4CtPYG
.

죄송합니다. 여전히 함수가 호스팅 된 파일에 개념적으로 연결되는 방식에 대한 적절한 소개가 보이지 않습니다. 설명해 주시면 몇 가지 포인트를드립니다 : https://stackoverflow.com/q/46192570/592641

코드 예제를 통해 답할 수 있었지만 명확하지 않았습니다.
함수 내에서 파일의 콘텐츠로 응답 할 수 있습니다.
당신의 프로젝트? 리디렉션이 아닙니다.
나는 더 많은 코드를 파헤칠 것이다.

2017 년 9 월 13 일 오전 7:18에 "Birowsky" [email protected]이 작성했습니다.

죄송합니다. 기능에 대한 적절한 소개가 아직 보이지 않습니다.
개념적으로 호스팅 된 파일에 연결됩니다. 설명 해주신다면
당신을위한 몇 가지 포인트 : https://stackoverflow.com/q/46192570/592641

—
당신이 언급 되었기 때문에 이것을 받고 있습니다.
이 이메일에 직접 답장하고 GitHub에서 확인하세요.
https://github.com/firebase/firebase-tools/issues/33#issuecomment-329182385 ,
또는 스레드 음소거
https://github.com/notifications/unsubscribe-auth/AX5XbnCSoaKUuVKUnfha5A-4K-p76kZ3ks5sh-QygaJpZM4CtPYG
.

@megamindbrian 방금 fs.readFileSync('./index.html') 시도했지만 안타깝게도 파일이 없습니다. 또한 암시 적으로 생성 된 일부 저장소 버킷에서 호스팅 된 파일을 찾고 싶었습니다. 어떻게 진행 하시겠습니까?

호스팅 public 디렉터리를 functions 디렉터리 내에 중첩하면 해당 디렉터리에서 사용할 수 있습니다.

@Birowsky Yup, 다음은 index.js와 같은 클라우드 기능에서 파일을 읽는 방법입니다.

const page = fs.readFileSync(__dirname + '/facebook-meta.html').toString();

그러나 프로젝트 레이아웃이 다음과 같은 경우 :

project/
project/src (<- actual source of app)
project/functions ( <- firebase functions)
project/dist (<- build output)

/ dist in에서 / functions로 관련 파일을 복사해야합니다.

이 문제는 알 모스가 3 년 (지금까지) 있었지만 아직 운이 없다 ????

아마 구글이 모든 것을 지원하는 도중에 파이어베이스를 포기할 것임을 의미합니다.
우리 앱.

이 문제에 대한 공식 솔루션은 Cloud Functions를 사용하는 것입니다.
정적으로 표시되어야하는 콘텐츠에 대한 서버 측 렌더링을 수행하는 방법
겉옷:

https://firebase.google.com/docs/hosting/functions

이것은 모든 종류의 작업을 허용하는보다 강력하고 일반화 된 솔루션입니다.
멋진 것들!

아직 빠진 것이 있다고 강하게 느끼시면
이를 해결하는 방법에 대해 생각할 수 있도록 자세한 사용 사례! :)

2017 년 9 월 14 일 목요일 오후 3:57 Brian Cullinan [email protected]
썼다 :

아마도 모든 것을 지원하는 중간에 firebase를 포기한 Google을 의미합니다.
우리 앱.

2017 년 9 월 14 일 목요일 오후 3:52, tofanelli [email protected]
썼다 :

이 문제는 알 모스가 3 년 (지금까지) 있었지만 아직 운이 없다 ????

—
당신이 언급 되었기 때문에 이것을 받고 있습니다.
이 이메일에 직접 답장하고 GitHub에서 확인하세요.
<
https://github.com/firebase/firebase-tools/issues/33#issuecomment -329630338
,
또는 스레드 음소거
<
https://github.com/notifications/unsubscribe-auth/AX5XbhBSDSl6TStSv7M02Dx0brb9MOPbks5sia44gaJpZM4CtPYG

.

—
당신이 언급 되었기 때문에 이것을 받고 있습니다.
이 이메일에 직접 답장하고 GitHub에서 확인하세요.
https://github.com/firebase/firebase-tools/issues/33#issuecomment-329631266 ,
또는 스레드 음소거
https://github.com/notifications/unsubscribe-auth/AAAD_iI6L-yu3RTECI88a2y_ZOzIxdDQks5sia9rgaJpZM4CtPYG
.

@mbleigh 아직 firebase 도메인의 루트에서 클라우드 기능을 사용할 수 있습니까?

예, 내가 당신을 올바르게 이해한다면. 전에 문제가 있었습니까?

2017 년 9 월 14 일 목요일 오후 6:38 Brian Cullinan [email protected]
썼다 :

@mbleigh https://github.com/mbleigh 클라우드 기능을 사용할 수 있습니까?
아직 firebase 루트 디렉토리?

—
당신이 언급 되었기 때문에 이것을 받고 있습니다.
이 이메일에 직접 답장하고 GitHub에서 확인하세요.
https://github.com/firebase/firebase-tools/issues/33#issuecomment-329653711 ,
또는 스레드 음소거
https://github.com/notifications/unsubscribe-auth/AAAD_g7BV3TMM_5nVX92_-3ai_mZHfHBks5sidUvgaJpZM4CtPYG
.

@mbleigh

이것은 모든 종류의 멋진 것들을 허용하는 더 강력하고 일반화 된 솔루션입니다!

SSR은 시스템을 더 복잡 하게 만듭니다 😢
사전 렌더링이 항상 좋은 것은 아니지만 자주 💡
예 : Facebook OGP, Twitter 카드, Google 이외의 SEO

@mbleigh @megamindbrian 귀하의 메시지에 감사드립니다. 내 기능에 대한 모든 요청을 전달하고 functions/build/index.html 에서 호스팅되는 index.html 대한 응답을 클라이언트에 호스팅했습니다. 하지만 FaceBot에서 오는 요청인지 확인하는 방법을 모르겠습니다. 내 웹 사이트의 URL에 액세스하기 위해 페이스 북 디버깅 도구를 사용해 보았지만 클라우드 기능이 트리거 될 것이라고 생각했지만 그렇지 않았습니다. 백엔드 개발에 익숙하지 않습니다. 힌트를 주실 수 있습니까? 감사.

Facebooks 도구를 사용할 때 무언가를 읽는 버튼을 사용해야합니다.
미리보기 근처에 "새 사본 가져 오기"와 같이 표시됩니다.

2017 년 10 월 17 일 화요일 오전 8:29에 Jude [email protected] 은 다음과 같이 썼습니다.

@mbleigh https://github.com/mbleigh @megamindbrian
https://github.com/megamindbrian 메시지를 보내 주셔서 감사합니다. 나는 가지고있다
내 호스팅이 모든 요청을 내 기능과 응답으로 전달하도록했습니다
functions / build / index.html에서 클라이언트에 호스팅되는 index.html. 그러나
FaceBot에서 오는 요청인지 확인하는 방법을 모르겠습니다. 나는 시도했다
내 웹 사이트의 URL에 액세스하기 위해 페이스 북 디버깅 도구를 사용하여
클라우드 기능이 트리거되지만 그렇지 않았습니다. 나는 익숙하지 않다
백엔드 개발, 힌트를 줄 수 있습니까? 감사.

—
당신이 언급 되었기 때문에 이것을 받고 있습니다.
이 이메일에 직접 답장하고 GitHub에서 확인하세요.
https://github.com/firebase/firebase-tools/issues/33#issuecomment-337266581 ,
또는 스레드 음소거
https://github.com/notifications/unsubscribe-auth/AX5XbrCQ3mowcUnJjWYWsaiScoN1y4l0ks5stMfcgaJpZM4CtPYG
.

-
기밀 유지 알림 :이 이메일 메시지의 내용과
첨부 파일은 수취인만을위한 것이며
기밀 및 / 또는 특권 정보이며 법적으로 보호 될 수 있습니다.
공개에서. 그런 다음 기술 회사, 봇, 해커,
정부 기관 및 마케팅 담당자. 이 메시지의 보안은 없습니다.
언제든지 Instagram에서 공유 할 수 있습니다. 괜찮으 시다면
응답하십시오. 실제로 보안이나 개인 정보는 어디에도 없습니다. 만약
당신은 캠핑에 가서 사람들과 얼굴을 맞대고 이야기하고 싶을 수도 있습니다.
옛날처럼.

Firebase 로그에 '함수 실행 시작됨'과 같은 내용이 있습니까?

2017 년 10 월 17 일 화요일 오전 8:37, Brian Cullinan [email protected]
썼다 :

Facebooks 도구를 사용할 때 다음과 같은 버튼을 사용해야합니다.
미리보기 근처에 "새 사본 가져 오기"와 같은 메시지가 표시됩니다.

2017 년 10 월 17 일 화요일 오전 8:29에 Jude [email protected] 은 다음과 같이 썼습니다.

@mbleigh https://github.com/mbleigh @megamindbrian
https://github.com/megamindbrian 메시지를 보내 주셔서 감사합니다. 나는 가지고있다
내 호스팅이 모든 요청을 내 기능과 응답으로 전달하도록했습니다
functions / build / index.html에서 클라이언트에 호스팅되는 index.html. 그러나
FaceBot에서 오는 요청인지 확인하는 방법을 모르겠습니다. 나는 시도했다
내 웹 사이트의 URL에 액세스하기 위해 페이스 북 디버깅 도구를 사용하여
클라우드 기능이 트리거되지만 그렇지 않았습니다. 나는 익숙하지 않다
백엔드 개발, 힌트를 줄 수 있습니까? 감사.

—
당신이 언급 되었기 때문에 이것을 받고 있습니다.
이 이메일에 직접 답장하고 GitHub에서 확인하세요.
https://github.com/firebase/firebase-tools/issues/33#issuecomment-337266581 ,
또는 스레드 음소거
https://github.com/notifications/unsubscribe-auth/AX5XbrCQ3mowcUnJjWYWsaiScoN1y4l0ks5stMfcgaJpZM4CtPYG
.

-
기밀 유지 알림 :이 이메일 메시지의 내용과
첨부 파일은 수취인만을위한 것이며
기밀 및 / 또는 특권 정보이며 법적으로 보호 될 수 있습니다.
공개에서. 그런 다음 기술 회사, 봇, 해커,
정부 기관 및 마케팅 담당자. 이 메시지의 보안은 없습니다.
언제든지 Instagram에서 공유 할 수 있습니다. 괜찮으 시다면
응답하십시오. 실제로 보안이나 개인 정보는 어디에도 없습니다. 만약
당신은 캠핑에 가서 사람들과 얼굴을 맞대고 이야기하고 싶을 수도 있습니다.
옛날처럼.

-
기밀 유지 알림 :이 이메일 메시지의 내용과
첨부 파일은 수취인만을위한 것이며
기밀 및 / 또는 특권 정보이며 법적으로 보호 될 수 있습니다.
공개에서. 그런 다음 기술 회사, 봇, 해커,
정부 기관 및 마케팅 담당자. 이 메시지의 보안은 없습니다.
언제든지 Instagram에서 공유 할 수 있습니다. 괜찮으 시다면
응답하십시오. 실제로 보안이나 개인 정보는 어디에도 없습니다. 만약
당신은 캠핑에 가서 사람들과 얼굴을 맞대고 이야기하고 싶을 수도 있습니다.
옛날처럼.

브라우저로 내 웹 사이트에 접속하면 @megamindbrian 기능이 실행되었습니다. 그러나 페이지의 데이터를 가져 오기 위해 facebook 도구를 사용한 후에는 트리거되지 않았습니다.

@judewang https://firebase.google.com/docs/hosting/functions#when_is_cached_content_served 살펴보기

빠르고 더러운 테스트를 위해 테스트 된 URL에 임의의 쿼리 매개 변수를 추가 할 수 있습니다.

그래서 초기 질문은 사전 렌더링을 사용하는 방법이었습니다. 이 솔루션은 사전 렌더링 통합 문제를 해결하지 않지만 단일 페이지 앱에 대한 열린 그래프를 해결합니다.

1. 내 빌드 스크립트에서 public/index.html 을 functions/hosting/index.html 복사합니다.
2. firebase.json "host"라는 클라우드 함수를 가리키는 재 작성 규칙을 추가합니다.

"hosting": {
    "public": "dist",
    "ignore": [
      "firebase.json",
      "**/.*",
      "**/node_modules/**"
    ],
    "rewrites": [
      {
        "source": "**",
        "function": "host"
      }
    ]
  }

1. host 라는 클라우드 함수를 정의합니다. 대부분의 경우 이것은 내가 functions/hosting/index.html 복사 한 index.html 파일을 반환하지만 에이전트가 알려진 개방형 그래프 파서 중 하나 인 경우 데이터베이스 데이터를 노선.

exports.host = functions.https.onRequest((req, res) => {
  var userAgent = req.headers['user-agent'];
  if (userAgent.startsWith('facebookexternalhit/1.1') ||
    userAgent === 'Facebot' ||
    userAgent.startsWith('Twitterbot')){

    //getOpenGraph() parses the path, and gets some data from the firebase database to construct open graph data.
    // eg: <meta property="og:description" content="My super cool webpage." /> <meta property="og:title"...

    res.status(200).send(getOpenGraph(req.path));
  }
  else{
    //optional - turn on caching: res.set('Cache-Control', 'public, max-age=300, s-maxage=600');
    res.status(200).send(fs.readFileSync('./hosting/index.html').toString());
  }
});

그게 다라고 생각합니다. 이것이 일부 사람들에게 도움이되기를 바랍니다!

나는 이것이 실망 스럽다고 말해야하는데, https://www.netlify.com/features/ 와 같은 새로운 경쟁자들이 이것을 내려서 SEO / 소셜 통합이 필요한 웹 앱에 확실히 더 매력적입니다.

Firebase는 모바일 / 반응 네이티브를 위해 그것을 죽이고 있으며 전반적으로 플랫폼으로서 정말 즐기고 있지만 이것은 웹 앱 IMO에 대한 꽤 큰 결함입니다.

일반적으로 사전 렌더링이 필요한 콘텐츠는 서버 측 렌더링에서 가장 잘 제공되는 콘텐츠이기도합니다 (성능 및 첫로드 이유로 인해). 이러한 이유로 일반 사전 렌더링은 즉각적인 로드맵에 포함되지 않습니다.

즉, "때때로"함수를 실행할 수 있도록 함수 통합이 더 유연 해지기를 바라는 피드백을 듣고 있습니다. Firebase 호스팅은 CDN 캐싱에 크게 의존하기 때문에 이러한 종류의 유연성은 기술적으로 달성하기 어렵습니다. 우리는 계속해서 피드백을 경청하고 귀하의 사용 사례에 맞게 플랫폼을 개선하는 방법을 찾으려고 노력할 것입니다. :미소:

기능을 도메인 전면에 직접 연결하기위한 Firebase의 UI
이름은 내 사용 사례를 수정할 것입니다.

https : //us-central1-...dsaflk; sdafkljsdafkl; jsdf;
lkjsadfkljasdfkljsdaflk.cloudfunctions.net

2018 년 1 월 5 일 금요일 오후 3:33, Michael Bleigh [email protected]
썼다 :

일반적으로 사전 렌더링이 필요한 콘텐츠도
서버 측 렌더링에서 가장 잘 제공되는 콘텐츠 (성능 및
첫 번째로드 이유). 일반적인 사전 렌더링은 즉각적인 로드맵에 없습니다.
이런 이유로.

즉, 우리는 원하는 것에 대한 피드백을 듣고 있습니다.
"때때로"기능을 허용하도록보다 유연하게 기능 통합
실행. Firebase 호스팅은 이런 종류의 CDN 캐싱에 크게 의존하기 때문에
유연성을 기술적으로 달성하기는 어렵습니다. 우리는 계속할 것이다
피드백을 듣고 더 나은 플랫폼을 만드는 방법을 모색합니다.
사용 사례. 😄

—
당신이 언급 되었기 때문에 이것을 받고 있습니다.
이 이메일에 직접 답장하고 GitHub에서 확인하세요.
https://github.com/firebase/firebase-tools/issues/33#issuecomment-355683821 ,
또는 스레드 음소거
https://github.com/notifications/unsubscribe-auth/AX5XbtVDQSPOIAZFyozujQQUektf2WM1ks5tHqM8gaJpZM4CtPYG
.

-
"나는 공학을 공부했다"

기밀 유지 알림 :이 이메일 메시지의 내용과
첨부 파일은 수취인만을위한 것이며
기밀 및 / 또는 특권 정보이며 법적으로 보호 될 수 있습니다.
공개에서. 그런 다음 기술 회사, 봇, 해커,
정부 기관 및 마케팅 담당자. 이 메시지의 보안은 없습니다.
언제든지 Instagram에서 공유 할 수 있습니다. 괜찮으 시다면
응답하십시오. 실제로 보안이나 개인 정보는 어디에도 없습니다. 만약
당신은 캠핑에 가서 사람들과 얼굴을 맞대고 이야기하고 싶을 수도 있습니다.
옛날처럼.

@mbleigh 는이 관점이 서버리스의 정신과 다소 반대되지 않으며 파이어베이스와 같은 BaaS / FaaS 공급자를 사용합니까? 지난 몇 년 동안 SPA로 향하는 추세에 따라 이것은 매우 일반적인 사용 사례이므로 예를 들어 netlify 및 roast와 같은 경쟁자가 다루었습니다. 크기는 작지만이를 호스팅하기 위해서는 중요한 검색 가능성 및 공유 가능성과 함께 더 빠른로드 시간을 제공하는 것이 합리적입니다.

고객을위한 추가 개발 및 유지 관리 오버 헤드를 추가하는 대신 선택적 사전 렌더링 서비스 또는 최소한 prerender.io와 같은 타사 서비스와 통합하는 기능이 크게 향상 될 것입니다.

Firebase는 정말 훌륭한 플랫폼이지만 호스팅이 저에게 유일하게 부족한 부분이므로 모바일 지향적입니다.

신속한 답변에 감사드립니다.

@mbleigh

일반적으로 사전 렌더링이 필요한 콘텐츠는 서버 측 렌더링에서 가장 잘 제공되는 콘텐츠이기도합니다 (성능 및 첫로드 이유로 인해).

@Pushplaybang 의 현장 주장을 제외하고는 귀하의 주장에 동의하지 않습니다. 우선,이 영역에서 결정을 내리는 것은 응용 프로그램 개발자 (즉, 여러분이 아님)에게 달려 있습니다. 단순한 페이지 성능 고려 사항은 다른 똑같이 중요한 아키텍처 결정과 균형을 이루어야합니다.

단일 페이지 앱 또는 앱 섹션은 어느 정도 클라이언트 측 렌더링에 의존해야하며, 안타깝게도 Google 자체를 포함한 크롤러는 아직 이러한 페이지의 색인을 생성하는 데 그다지 좋지 않습니다. 나는 구글이 내 웹 사이트를 제대로 인덱싱 할 수 있도록 몇 달간 실패한 후 PrerenderIO에 의지해야했다. 이것은 인덱싱 문제를 위해 __ 단지 __ 단지 _______________________________________ 서버 기반 접근 방식을 유지하도록 강요했다.

클라이언트 측에서 감지 된 딥 URL에 따라 모든 제품을 렌더링하는 /product/**.html 페이지가있는 웹 사이트를 생각해보십시오. 이 디자인의 근거는 브라우저 및 cdn 캐싱을 고려하더라도 제품에 대한 실제 별도 페이지를로드하는 것이 다른 제품의 데이터를로드하고 URL을 변경하면서 렌더링하는 것만 큼 UX 관점에서 부드럽 지 않다는 것입니다. 고객은 전자 상거래 웹 사이트에서 browsign-to-buy를 할 때 대부분의 시간을 제품 페이지에서 보내고 "관련 제품"링크 또는 페이지 내 ajax 검색 링크를 통해 다른 제품으로 이동하는 경우가 많습니다.

우리는 은폐에 대한 처벌을받지 않도록 어리석은 (IMHO) _escaped_fragment_ 메커니즘을 고수하고 있습니다. Google은이 유비쿼터스 문제에 대한 깔끔한 솔루션을 가진 엔지니어를 고용하기가 어렵습니까 ??

__unjustifiable__ 문서에서 웹 사이트 / 웹앱 색인 생성 섹션이 전혀 없다는 사실을 발견했습니다.
모바일 앱이 소비자 시장을 지배 할 수 있지만 B2B는 어떻습니까? 대부분의 사무실 부서는 데스크톱 컴퓨터에서 운영됩니다. R & D 또는 구매 부서에 도달하기 위해 데스크톱 웹 사이트를 인덱싱하는 것은 "갖기 좋은"것이 아니라 B2B 공급 업체 비즈니스에 매우 중요합니다.

반짝이는 가젯에서 실행되는 화려한 앱이 더 많은 수익을 창출하기 때문에 Firebase / Google이 이에 관심이 없다면 알아두면 좋을 것입니다. 충성스러운 기술 채택 자들에게 4 년 동안 회피적인 답변을 제공하는 것은 모든 사람의 정보에 상당히 모욕적입니다.

Ranty? 예,하지만 추가 인프라 비용이 추가 개발 시간에 소요되고 크롤러가 고객에게 예상치 못한 동작을하는 것을 정당화해야합니다.

이 문제가 4 년 동안 공개 된 것은 약간 어리석은 것 같습니다. @cleverplatypus- 귀하의 감정에 더 동의 할 수 없습니다.

이 문제 영역은 전반적으로 우리가 생각하는 것을 중단 한 것이 아니지만, 탈출 된 조각 사전 렌더링에 대한 즉각적인 계획은 아직 없습니다.

정적 단일 페이지 앱이 사전 렌더링의 이점을 얻을 수있는 경우가 분명히 있음을 알고 있습니다. 그러나 나는 여전히 이러한 유형의 사이트의 대부분 (전부는 아님)에서 어떤 URL에서든 SPA를 부트 스트랩 할 수있는 서버 측 렌더링에 의해 더 나은 서비스를 제공한다고 믿습니다.

우리의 목표는 Firebase 호스팅을 모든 종류의 웹 경험을 제공하는 환상적인 플랫폼으로 만드는 것입니다. 이 스레드에서 제공 한 솔직하고 열정적 인 피드백에 감사하지만, 우리는 제한된 리소스를 가지고 있으며 전체 고객 기반에 가장 큰 영향을 미칠 것으로 생각되는 작업의 우선 순위를 지정해야합니다. 강하게 느끼는 기능의 우선 순위 지정에 대한 마음을 바꾸고 싶다면 가장 좋은 방법은 기능 요청 을

대화를 진행할 공간이 실제로 남아 있지 않다고 생각하므로이 스레드를 닫으려고합니다.하지만 Cloud Functions 통합으로 서비스를 제대로받지 못하는 사람은 사전 렌더링을위한 기능 요청을 제출하도록 권장합니다. 수요가 얼마나 큰지 직접 확인할 수 있습니다!

Firebase 호스팅을 사용해 주셔서 감사합니다. 모두 😸