로그인

Language :
제목Angular Universal 환경에서 document.referrer 개체를 사용하는 방법(팁)
글쓴이이지섭작성일2019-02-27조회수157

Angular Universal 환경에서 document.referrer 개체를 사용하는 방법이다.

 

import { Inject, PLATFORM_ID } from '@angular/core';
import { isPlatformServer } from '@angular/common';

@Component({
  selector: 'app-board-view',
  templateUrl: './board-view.component.html',
  styleUrls: ['./board-view.component.css']
})
export class BoardViewComponent implements OnInit {
  
  constructor(
    //....
    @Inject(PLATFORM_ID) private platformId
  ) { }

  ngOnInit() {
    let referrer = "";
    if (!isPlatformServer(this.platformId)) {
      referrer = document.referrer;
    }
  }

}

 

런타임에 isPlatformServer(this.platformId) 실행 값에 따라서

서버에서 실행되는 Angular Universal 에서는 document 개체를 참조하지 않고

클라이언트 브라우저에서만 document 개체를 참조하도록 구분을 둔 것이다.

 

이렇게 함으로써 서버단에서 소소를 보는 부분이 정상적으로 실행되며,

브라우저 클라이언트단에서는 document.referrer 개체를 활용하여 프로그래밍 할 수 있다.

 

Angular Universal 에서 자바스크립트 document 개체를 사용하면

SSR (Server Side Rendering) 이 되지 않는다.

 

다소 불완전한 방법이기는 하다.

댓글

이름               비밀번호 
내용
비밀번호를 확인합니다.

댓글 등록시 입력한 비밀번호를 입력해주시기 바랍니다.