하위 도메인을 서브 디렉토리로 제공하는 방법

Design에서 탁월한 플랫폼을 구축하고 example.com에서 사용할 수 있다고 가정 해 봅시다. 그러나 그 플랫폼은 블로깅에서 부족합니다. 그래서 당신은 "다른 블로그 플랫폼을 사용하여 example.com/blog에서 사용할 수 있다면 어떻게 될까요?"

대부분의 사람들은 DNS와 웹 사이트가 어떻게 작동하고 대신 하위 도메인을 사용하는지에 반하는 것을 말해 줄 것입니다. 그러나 컨텐츠를 서브 도메인으로 얻지 못하는 루트 도메인에 보관하면 이점이 있습니다.

동일한 URL에서 두 개의 다른 플랫폼을 제공하는 방법이 있습니다. 그리고이 기사가 끝날 무렵 Blog.example.com이 example.com/blog로 제공되도록 비밀 소스를 보여 드리겠습니다.

왜 그렇게하고 싶은가

당신이 여기 있기 때문에 아마도 이것이 왜 추구하는 길인지 알고있을 것입니다. 그러나 나는 당신이 이것을하는 주된 이유가 여기에 있는지 확인하고 싶습니다 : SEO. 사람들이 하위 도메인을 하위 디렉토리로 옮길 때 긍정적 인 결과를 보여주는이 14 건의 사례 연구를 확인하십시오. 블로그와 도메인이 SEO 값을 공유하기를 원합니다. 하위 도메인에 올리면 둘을 다소 분리 할 수 ​​있습니다.

이것이 나의 이유였으며, 주 영역이 WordPress에 있고 하위 도메인은 Drupal에있는 두 개의 플랫폼을 합병했습니다. 그러나이 튜토리얼은 플랫폼의 불가지론 적이며 거의 모든 플랫폼과 함께 작동합니다.

즉,이 튜토리얼에서 우리가 다루고있는 CloudFlare 접근 방식은 CloudFlare의 엔터프라이즈 계획을 지불하지 않는 한 Shopify와 호환되지 않습니다. Shopify는 또한 CloudFlare를 사용하고 무료 가격 책정 계층의 트래픽을 프록시 할 수 없기 때문입니다.

0 단계 (미리보기)

내가 뛰어 들기 전에, 나는 일어날 일의 높은 수준을 설명하고 싶습니다. 요컨대, 우리는 우리의 주요 웹 사이트 (example.com)와 하위 도메인 (blog.example.com)의 두 웹 사이트가 있습니다. 나는“블로그”를 예로 사용하지만 제 경우에는 다른 유형의 내용으로 Drupal을 떨어 뜨려야했습니다. 그러나 블로그는 일반적인 사용 사례입니다.

이 접근법은 DNS에 CloudFlare를 사용하고 마법을 제공 할 약간의 추가 기능에 의존합니다. 우리는 누군가가 example.com/blog를 방문 할 때 다음을 방문해야한다고 Cloudflare에게 말할 것입니다.

1. 해당 요청을 가로 채기 (example.com/blog가 실제로 존재하지 않기 때문에),
2. 무대 뒤에서 다른 도메인 (blog.example.com/blog)을 요청하십시오
3. 마지막 단계에서 example.com/blog를 통해 마스킹 된 방문자에게 결과를 전달하십시오.

좋아, 더 자세하게 다이빙합시다!

1 단계 : CloudFlare 사용

다시, 우리는 DNS에 CloudFlare를 사용하고 있습니다. 도메인의 DNS를 가리키면 시작하는 첫 단계가 있습니다.

CloudFlare의 이유는 누군가가 특정 URL을 방문 할 때마다 약간의 코드를 실행할 수있는 작업자를 생성 할 수 있기 때문입니다 (3 단계에서 생성 할 경로라고 함). 이 코드는 무대 뒤에서 웹 사이트를 전환 할 책임이 있습니다.

CloudFlare는 시작하기위한 훌륭한 가이드가 있습니다. 목표는 도메인 (등록되는 곳)을 CloudFlare의 Nameservers에 지적하고 CloudFlare가 CloudFlare 계정에 연결되어 있음을 확인하는 것입니다.

2 단계 : 작업자를 만듭니다

이 코드는 무대 뒤에서 웹 사이트를 전환 할 책임이 있습니다. 작업자 에게 가서 서비스 생성을 클릭하십시오.

서비스의 이름을 밝히고 "HTTP 처리기"를 선택하십시오.

서비스 작성을 클릭 한 다음 빠른 편집을 클릭하십시오.

다음 코드에 붙여 넣고 16 행에서 도메인 이름을 자신의 것으로 바꾸십시오 .

 // 모든 요청을 듣고 우리의 기능으로 응답하십시오.
// CloudFlare에서 구성된 경로에서만 실행됩니다.
addeventListener ( 'fetch', function (event) {
  event.respondwith (handlerequest (event.request))
})

// 응답을 처리 할 수있는 기능.
비동기 함수 handlerequest (요청) {
  //이 프록시에서만 요청을받습니다.
  if (request.method! == 'get')
  return methodNotallowed (요청);
  // 요청중인 URL.
  const url = new URL (request.url);
  // "Origin URL"을 요청한 대신 실제 블로그입니다.
  // 이것은 상대 경로를 변경하지 않은 절대 URL을 전환합니다. 
  const or
  // 원점 페이지의 내용.
  const originpage = fetch (originurl);
  // 응답에 원점 페이지를 제공합니다.
  const newresponse = 새로운 응답 (Originpage.body, Originpage); NewResponse를 반환합니다.
}

// 여기요! 요청 만받습니다 
함수 MethodNotallowed (요청) {
  새 응답을 반환합니다 (`method $ {request.method} 허용되지 않음 .`, {
    상태 : 405,
    헤더 : { 'allud': 'get'}
  })
}

마지막으로 저장 및 배포를 클릭하십시오.

3 단계 : 경로를 추가하십시오

이제 CloudFlare 에이 코드를 실행할 URL (일명 경로)에 알리 봅시다. CloudFlare의 웹 사이트로 이동 한 다음 작업자를 클릭하십시오.

CloudFlare의 기본 화면에는 코드를 편집 한 직원 섹션이 있으며, 각 웹 사이트에는 경로를 추가하는 작업자 섹션이 있습니다. 그들은 서로 다른 두 곳이며 혼란 스럽습니다.

먼저, 경로 추가를 클릭하십시오.

어린이 페이지가 많은 블로그를 추가하기 때문에 https://example.com/blog*를 사용할 것입니다. 별표는 일치하는 와일드 카드 역할을합니다. 이 코드는 블로그 페이지와 블로그로 시작하는 모든 페이지에서 실행됩니다.

이것은 의도하지 않은 결과를 초래할 수 있습니다. 예를 들어, "블로그"로 시작하지만 https://example.com/blogging-services와 같은 실제 블로그의 일부가 아닌 페이지가 있습니다. 그것은이 규칙으로 받아 들일 것입니다.

그런 다음 서비스 드롭 다운에서 작업자를 선택하십시오.

우리는 많은 작업을 수행했지만 블로그에 의존하는 CSS, JavaScript 및 기타 파일 경로 (모든 파일이 CDN과 같은 다른 URL에서 호스팅되지 않는 한)를 추가해야 할 더 많은 경로가 있습니다. 이를 찾는 좋은 방법은 경로를 테스트하고 콘솔을 확인하는 것입니다.

https://example.com/blog로 가서 무언가를로드하고 있는지 확인하십시오. 테마 파일이 없어서 엉망이 될 것입니다. 404 오류가 발생하지 않는 한 지금은 괜찮습니다. 중요한 것은 브라우저의 DevTools를 열고 콘솔을 발사하며 도메인의 일부인 찾을 수 없거나로드 할 수없는 모든 빨간 URL (일반적으로 404 또는 403)을 기록하는 것입니다.

그것들을 경로로 추가하고 싶을 것입니다. 그러나 부모 경로 만 수행합니다. 따라서 Red URL이 https://example.com/wp-content/themes/file1.css 인 경우 https://example.com/wp-content*를 경로로 수행하십시오. 더 구체적으로 원한다면 자식 경로를 추가 할 수 있지만 아이디어는 하나의 경로를 사용하여 대부분의 파일을 잡는 것입니다.

해당 경로를 추가하면 URL을 확인하고 하위 도메인처럼 보이는지 확인하십시오. 그렇지 않은 경우 이전 단계를 확인하십시오. (더 많은 경로를 추가해야 할 가능성이 있습니다.)

여러 페이지로 탐색하고 누락 된 것이 있는지 확인하여 품질 점검을하는 것이 가장 좋습니다. 또한 DevTools를 열고 하위 도메인 (blog.example.com)을 검색하는 것이 좋습니다. 그것이 나타나면, 당신은 해당 리소스를 타겟팅하기 위해 경로를 추가 하거나 플랫폼으로 해당 URL 출력을 중지하기 위해 무언가를해야합니다. 예를 들어, 내 플랫폼은 내 하위 도메인으로 표준 태그를 출력하여 표준 URL을 루트 도메인으로 수정하는 플러그인을 찾았습니다.

4 단계 : 소스의 분비 자 (Noindex)

당신은 우리에게 문제가 있음을 알 수 있습니다. URL은 두 개의 다른 URL에서 사용할 수 있습니다. 예, 우리는 표준 속성을 사용하여 Google에 어떤 URL이 "메인"인지 알 수 있지만 올바른 것을 선택하기 위해 Google에 남겨 두지 마십시오.

먼저, 전체 하위 도메인을 NoIndex로 설정하십시오 (이를 수행하는 방법은 플랫폼마다 다릅니다). 그런 다음 CloudFlare Worker에서는 다음 코드 줄을 추가 할 예정입니다. 다음 코드 줄을 추가 할 예정입니다. 여기에는 현재 URL이 프록시를 통해 액세스 할 때 NoIndex를 제거하라는 기본적으로 표시됩니다.

 newResponse.headers.delete ( "Xobots-tag");

전체 코드 솔루션은이 기사의 끝에 제공됩니다.

5 단계 : 사이트 맵을 수정합니다

마지막으로해야 할 일은 서브 도메인의 사이트 맵을 수정하여 하위 도메인을 사용하지 않는 것입니다. 이를 수행하는 방법은 플랫폼마다 다르지만 목표는 Blog.exmaple.com/mypost 대신 Secies.com/mypost를 인쇄하도록 사이트 맵의 기본/절대/도메인을 수정하는 것입니다. 일부 플러그인과 모듈은 사용자 정의 코드없이이를 허용합니다.

그게 그게! 해결책이 작동해야합니다!

제한

이 CloudFlare 마법에는 단점이 없습니다. 예를 들어, 요청을받는 것만 허용하므로 서버에서만 얻을 수 있습니다. 우리는 어떤 형태가 사용되는지 게시 할 수 없습니다. 따라서 방문자가 로그인하거나 양식을 제출 해야하는 경우 이미 수행 한 작업 위에 더 많은 작업이있을 것입니다. 나는 이것에 대한 몇 가지 해결책에 대해 다른 기사에서 논의했습니다.

앞서 언급했듯이 또 다른 한계는 Shopify 에서이 접근 방식을 사용하려면 CloudFlare의 엔터프라이즈 가격 계층에 가입해야한다는 것입니다. 다시 말하지만, Shopify는 또한 CloudFlare를 사용하고 다른 계획에서 트래픽을 프록시하는 능력을 제한하기 때문입니다.

동일한 플랫폼의 두 인스턴스를 함께 병합하려는 경우 (예 : 최상위 도메인과 하위 도메인이 WordPress를 사용하는 경우) 몇 가지 문제가 발생할 수도 있습니다. 그러나 그런 경우에는 플랫폼의 하나의 인스턴스를 통합하고 사용할 수 있어야합니다.

전체 솔루션

다음은 모든 영광의 코드입니다.

 // 모든 요청을 듣고 우리의 기능으로 응답하십시오.
// CloudFlare에서 구성된 경로에서만 실행됩니다.
addeventListener ( 'fetch', function (event) {
  event.respondwith (handlerequest (event.request))
})
// 응답을 처리 할 수있는 기능.
비동기 함수 handlerequest (요청) {
  //이 프록시에서만 요청을받습니다.
  if (request.method! == 'get') return MethodNotallowed (요청);
  // 요청중인 URL.
  const url = new URL (request.url);
  // "Origin URL"을 요청한 대신 실제 블로그입니다.
  // 이것은 상대 경로를 변경하지 않은 절대 URL을 전환합니다. 
  const or
  // 원점 페이지의 내용.
  const originpage = fetch (originurl);
  // 응답에 원점 페이지를 제공합니다.
  const newresponse = 새로운 응답 (Originpage.body, Originpage);
  // Origin 도메인에서 "NoIndex"를 제거하십시오.
  newResponse.headers.delete ( "Xobots-tag");
  // WordPress의 의미이므로 CloudFlare 캐시를 제거합니다.
  // CloudFlare APO를 사용하고 있고 블로그가 WordPress가 아닌 경우
  // 메인 도메인은), APO가 Origin URL에서 실행되는 것을 중지하십시오.
  // newResponse.headers.set ( "cf-edge-cache", "no-cache"); NewResponse를 반환합니다. 
}
// 여기요! 요청 만받습니다 
함수 MethodNotallowed (요청) {
  새 응답을 반환합니다 (`method $ {request.method} 허용되지 않음 .`, {
    상태 : 405,
    헤더 :
    { 'allow': 'get'}
  })
}

도중에 도움이 필요하면 내 웹 사이트 CreateToday.io를 통해 저에게 연락하거나 비디오 데모를 위해 내 YouTube를 확인하십시오.

위 내용은 하위 도메인을 서브 디렉토리로 제공하는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!