jQuery pushState 및 공유 머리글/바닥 글이있는 동적 URL

Question

저는 약간의 웹 사이트 작업을하고 있으며 jQuery + ajax를 사용하여 정보를 동적으로로드하려고합니다. 현재로서는 홈 페이지 ~/home과 프로필 페이지 ~/profile이 있습니다. 이 두 페이지는 동일한 머리글과 바닥 글을 공유하며 머리글, 다음 페이지, 바닥 글을 먼저로드합니다. 페이지를 전환 할 때 페이지 div를 다른 HTML로 바꿉니다. 그러나 ~/profile로 이동하여 페이지 div 내용이있는 html 페이지를로드하는 경우 문제가 발생합니다.

기본적으로 누구나 시스템에 좋은 제안이 있으면 모든 링크를 탐색하고 브라우저가 각 파일에 모든 파일을 하드 코딩하지 않고 별도의 머리글과 바닥 글 파일을로드하는 것을 알고 있는지 궁금합니다. 나는 그것이 일종의 PHP/프레임 워크를 포함 할 것이라고 생각하지만, CodeIgniter와 함께 일한 유일한 사람은 매우 놀랐습니다.

여기에서이 조각은 약속을 보았다 : CodeIgniter + jQuery(ajax) + HTML5 pushstate: How can I make a clean navigation with real URLs? 내 유일한 질문은 어떻게 컨트롤러가 헤더 파일로, 머리글과 바닥 글에 내 도메인로드에있는 모든 링크를 차단하는 설정 한하는 것

if (!$this->input->is_ajax_request()) 
    $this->load->view('header'); 

$this->load->view('your_view', $data); 

if (!$this->input->is_ajax_request()) 
    $this->load->view('footer'); 

ajax를 통해 중간에로드 할 페이지를 알고있는 연결된 js 파일이 있습니다.

Answer 1

이 질문은 생각보다 간단하지 않습니다. 머리글과 바닥 글뿐만 아니라 MIME 형식도 변경되었습니다. text/html이있는 html 메시지와 text/plain 컨텐트 유형 헤더가있는 ajax 메시지를 보내야합니다. 2 개의 스킨/스켈레톤이 필요합니다 : 하나는 HTML 용이고 다른 하나는 아약스 호출 용입니다. 현재 스킨 공급자가 어떤 스킨을 사용할 지 결정할 수 있어야합니다. 스킨과 독립적으로 컨텐트를 렌더링해야하거나 스킨이 컨텐트의 render 메서드를 호출해야합니다.

그것은 다음과 같이 매우 - 매우 대략 같습니다

class Controller 
{ 
    public function __construct() 
    { 
     $provider = new SkinProvider(); 
     $this->skin = $provider->getSkin(); 
    } 

    public function action() 
    { 
     $this->skin->render(new Content()); 
    } 
} 

class SkinProvider 
{ 
    public function getSkin() 
    { 
     if ($this->input->is_ajax_request()) 
      return new AjaxSkin(); 
     else 
      return new HtmlSkin(); 
    } 
} 

class AjaxSkin extends AbstractSkin 
{ 
    public function render($content) 
    { 
     $this->contentType('text/plain'); 
     $content->render(); 
    } 
} 

class HtmlSkin extends AbstractSkin 
{ 
    public function render($content) 
    { 
     $this->contentType('text/html'); 
     $this->load->view('header'); 
     $content->render(); 
     $this->load->view('footer'); 
    } 
} 

class Content extends AbstractView 
{ 
    public function render() 
    { 
     $data = $this->model->ask(); 
     $this->load->view('your_view', $data); 
    } 
} 

당신은에 추상적 컨트롤러 컨트롤러의 생성자를 넣을 수 있습니다, 당신은 당신이 그에서 확장하는 모든 컨트롤러의 실제 피부가됩니다.