SPA 용 React-router 및 Google 캐시 페이지

google 결과에 반응 라우터 및 Google 캐시 페이지에 대한 질문이 있습니다. 이 경우 우리는 반응 라우터 (browserHistory를 통해)를 사용하는 SPA를 사용합니다. 문제는 다음과 같습니다. Google 캐시 페이지는 페이지 래퍼입니다. 여기서 URL-a는 SPA의 라우터에 정의 된 URL에 따라 다릅니다. 이 경우 응용 프로그램의 라우팅은 찾을 수없는 페이지의 정의로 넘어갑니다. (예)SPA 용 React-router 및 Google 캐시 페이지

및 Google의 SPA 페이지 캐시 결과 대신 페이지의 콘텐츠가 표시됩니다. PageNotFoundApp (페이지를 찾을 수 없음 *).

설명 된 문제를 해결하는 방법은 무엇입니까?

<Route path="*" component={PageNotFoundApp.container} onEnter={intercepPath}/>

출처

2017-02-26 zdrsoft

의 옵션은 당신이 뭔가를 사용할 수있는 포괄 경로 정의를 들면, onEnter 이벤트이 후

const projectCanonnicalAddr = "http://localhost"; 
function cacheQueryParser(query) { 
    let out = ''; 
    if (typeof query === 'string') { 
     out = query.split(':').pop().replace(/^[^/]*/, ''); 
    } 
    return out; 
} 
function intercepPath(next, replace) { 
    if (next.location.pathname === '/search' 
     && next.location.query.q 
     && next.location.query.q.indexOf('cache') === 0 
     && next.location.query.q.indexOf(projectCanonnicalAddr) > -1) { 
      replace(null, cacheQueryParser(next.location.query.q)); 
    } 
};

를 사용하여 라우팅 로직을 차단하는 것 주입 된 replace 함수를 사용하면 실제로 브라우저를 두 번째 매개 변수로 제공된 경로로 이동합니다. 나는 구글 캐시의 경우 이것을 테스트하지 않았고 잘못된 구현 일 수도있다. 옵션으로이 함수의 첫 번째 매개 변수로 유효한 상태를 전달할 수 있습니다.

출처

2017-02-26 09:23:14

SPA 용 React-router 및 Google 캐시 페이지

답변

관련 문제