각도로 동적으로 생성 된 HTML 리디렉션

각도 5의 SPA를 구축 중이며 인증 및 인증 서비스를 요청하고 있습니다. 이 서비스는 세션이 활성 상태인지 확인하고 세션이 없거나 만료 된 경우 401 및 회사 전체 로그인 페이지가있는 HTML을 반환합니다. I는 다음과 같이,이 호출을 만들기위한 서비스를 구축 : 당신이 볼 수 있듯이, 내가 서비스를 호출하고있어각도로 동적으로 생성 된 HTML 리디렉션

@Injectable() 
export class AuthService { 

    private authServicePath = '/<path-to-the-service>'; 
    private authToken: string; 
    private serviceURL: string; 
    private requestOptions: any; 

    constructor(private http: HttpClient, private cookieService: CookieService) { } 

    validateAuth() { 
     this.serviceURL = environment.endpoint + this.authServicePath; 
     this.authToken = this.cookieService.get('SESSION-TOKEN-COOKIE'); 
     this.requestOptions = { 
      headers: new HttpHeaders(
       { 
        'SESSION-TOKEN-COOKIE': this.authToken 
       } 
      ) 
     }; 

     return this 
       .http 
       .get(this.serviceURL, this.requestOptions) 
       .subscribe(
        data => { 
         // Do nothing 
        }, 
        (err: HttpErrorResponse) => { 
         /*window.document.write = err.error; 
         window.document.close();*/ 
        } 
       ); 
    } 
}

. 토큰이 유효하면 아무 것도 할 수 없지만 활성/유효한 세션이없는 경우 서비스는 401 Unauthorized를 반환하고 페이로드 (.error 필드)에서 다음과 같이 표시합니다.

<html> 
     <head> 
     <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/> 
     </head> 
     <body> 
     <form action="..." ...

내 생성 된 페이지로 리디렉션하도록 앱에 알리는 방법은 무엇입니까?

보시다시피, window.document.write으로 새 HTML을 작성했지만 작동하지 않았습니다. 각도 라우터는 앱에 속한 구성 요소로만 리디렉션 할 수 있음을 알고 있습니다.

미리 감사드립니다.

출처

2017-12-04 Alejandro Echeverri

좋아, 그래서, 나는 이것을하는 방법을 발견했다. 그것은 내게 매우 hackish 보이지만 그것은 첫 번째 단계입니다. 누군가이 문제에 대해 조언을 해 주시면 알려 주시기 바랍니다.

자바 ()를 사용하여 생성 된 HTML의 내용을 내 앱의 <body> 태그에 추가하려면 이전 방법 인을 사용합니다. HTML은 익명의 형태로을 포함하기 때문에, 나는이 일을했습니다

(err: HttpErrorResponse) => { if (err.status === 401){ document.body.innerHTML = err.error; let form = <HTMLFormElement>document.getElementsByTagName('form')[0]; form.submit(); } }

그것은 나에게 추한 모습,하지만 내가이 시간에 얻을 수있는 최선이다. 누군가 다른 접근법이 있다면 알려주세요. 나는이 질문에 답을 표시 할 것이고, 더 좋은 대답이 있으면 나는 그것을 답으로 표시하게되어 기쁠 것이다.

감사

출처

2017-12-04 19:54:53

전체 HTML 파일을 처리해야하기 때문에 더 나은 방법을 생각할 수 없습니다. 나는 당신의 예약에 동의합니다 - 그러나 그것은 작동합니다 ... – Steveland83

오류/로그인 페이지로 리디렉션 또는 서비스에서 채워 부분 페이지 내용 (안 전체 HTML 페이지)에 오류 메시지가 표시됩니다 무슨 일을해야처럼 소리.

타이프 라이터

public myHtmlCode: string = '<b>header</b><p>paragraph</p>';

을 : 당신이 경로를 이동하려면 다음과 같이

, 당신의 HTML을 포함하고 div 요소의 innerHTML에 바인딩 할 속성을 설정 템플릿

<div [innerHTML]="myHtmlCode"></div>

출처

2017-12-04 18:45:24 Steveland83

아니오, 불행히도, 서비스에 의해 반환 된 페이지 나 표시 할 수있는 전체 페이지, 그래서 즉 (내 응용 프로그램에 그것을 _embed_ 수는 없지만, 대신 내가 그 HTML을 사용할 필요가 로그인 페이지).이 HTML에는 로그인 요청에 대한 정보가있는 미리 채워진 필드가 있기 때문에 정적이 아닙니다. –

@AlejandroEcheverri 알겠습니다.이 경우 iframe을 사용해야합니다. – Steveland83

hackish_처럼 보이기 때문에 내가 싫어하는 길을 발견했습니다. 의견이 있으시면 알려주십시오. –

각도로 동적으로 생성 된 HTML 리디렉션

답변

관련 문제