캐디와 함께하는 Webflow + Ghost 블로그

최신 SaaS 애플리케이션은 일반적으로 랜딩 페이지, 블로그 및 기본 앱을 별도로 실행합니다. 랜딩 페이지의 경우 Tilda, Webflow 또는 기타 웹 빌더를 사용할 수 있습니다. 블로그의 경우 WordPress, Ghost 등과 같은 자체 호스팅 CMS를 사용하는 것이 일반적입니다.

SEO 목적을 위해 하위 도메인인 blog.your_domain.com 대신 기본 도메인인 your_domain.com을 인덱싱하는 것이 매우 중요합니다. 기본 도메인에 가능한 한 많은 링크를 원합니다. your_domain.com/blog에 콘텐츠가 많을수록 Google에서 더 많은 콘텐츠를 색인에 추가합니다.

blog.your_domain.com과 같은 하위 도메인에서 Ghost 블로그를 실행하는 것은 쉽습니다. DNS 공급자에 새 A 레코드를 만들고 Ghost 인스턴스를 실행하는 시스템을 가리키기만 하면 됩니다. Webflow에서 your_domain.com을 실행하고 your_domain.com/blog가 자체 호스팅 Ghost가 되려면 reverse-proxy 서버가 필요합니다.

리버스 프록시 서버
DevOps 관점에서 우리의 목표는 다음과 같습니다.

your_domain.com -> 웹 흐름

your_domain.com/* -> Webflow

your_domain.com/blog -> 자체 호스팅 Ghost 블로그

blog.your_domain.com -> your_domain.com/blog

리버스 프록시에 Caddy을 사용할 것입니다. 그 이유는 Docker 친화적인 구성으로 데브옵스(헤이, Nginx)에 대한 깊은 지식 없이도 배포가 매우 빠릅니다. 공식 캐디 이미지here를 찾으십시오. 캐디가 제대로 작동하려면 볼륨을 마운트해야 합니다.

우리는 Ghost와 Caddy를 동일한 시스템과 단일 docker-compose.yml 파일에서 호스팅할 것입니다.

version: "3.7"

services:
 caddy:
   image: caddy:2
   restart: unless-stopped
   ports:
     - "80:80"
     - "443:443"
   volumes:
     - $PWD/Caddyfile:/etc/caddy/Caddyfile
     - $PWD/site:/srv
     - caddy_data:/data
     - caddy_config:/config
 ghost:
   image: ghost:3
   environment:
     NODE_ENV: production
     url: https://adapty.io/blog
   volumes:
     - ./blog:/var/lib/ghost/content
volumes:
 caddy_data:
 caddy_config:

이제 Caddyfile의 경우:

blog.adapty.io {
   redir https://adapty.io/blog{uri} #point to subdirectory
}

adapty.io {
   redir /blog /blog/ #trailing slash
   reverse_proxy /blog/* ghost:2368 { #proxy to Ghost container
       header_up Host {host}
   }
   reverse_proxy proxy.webflow.com { #proxy to Webflow
       header_up Host {host}
   }
}

*docker-compose up -d *를 실행하면 여기 있습니다!

기본적으로 Caddy는 두 가지 예외를 제외하고 수신 헤더를 수정하지 않고 호스트 헤더를 포함하여 백엔드로 전달합니다.

X-Forwarded-For 헤더 필드를 추가하거나 확장합니다.

X-Forwarded-Proto 헤더 필드를 설정합니다.

해당 문서https://caddyserver.com/docs/caddyfile/directives/reverse_proxy#headers에서 자세히 알아보기

마지막으로

기본 도메인의 A 레코드를 IP로 지정하십시오.
DNS A 레코드를 변경하고 VM을 가리킴
Webflow에서 SSL 프록시를 끄면 캐디가 자동으로 서비스를 제공합니다(매우 멋지죠? certbot 없이).
Caddy가 인증서를 생성하므로 Webflow에서 SSL을 끕니다.
그게 다야!