Swig 템플릿은 내용을 렌더링하기 전에 출력 태그를 보여줍니다.

저는 isomorphoc 반응/플럭스 앱을 만들고 swig를 사용하여 내용을 렌더링하고 있습니다. 그러나 사이트를 열면 실제 콘텐츠를 내 index.html 파일로 렌더링하기 전에 출력 태그가 {{ html|safe }} 인 빈 페이지가 먼저 표시됩니다.Swig 템플릿은 내용을 렌더링하기 전에 출력 태그를 보여줍니다.

res.status(200).send(swig.renderFile(__dirname + '/public/index.html', {html: html}));

내가이를 방지 할 수있는 방법 어떤 생각 : 내 server.js에서

코드는 같다? 또한 서버 측 렌더링을 방해합니까? 페이지를 크롤링 할 때 Google 크롤러가 출력 태그 만 볼 수 있습니까?

감사합니다.

편집 :

require('babel-register'); 

var express = require('express'); 
var app = express(); 
var compression = require('compression'); 

var path = require('path'); 
var http = require('http'); 
var swig = require('swig'); 
var React = require('react'); 
var ReactDOM = require('react-dom/server'); 
var Router = require('react-router'); 
var routes = require('./app/routes'); 

app.use(compression()); 

app.use(express.static(path.join(__dirname, 'public'))); 

// create react router 
app.use(function(req, res){ 
    Router.match(
     { 
      routes: routes.default, 
      location: req.url 
     }, 
     function(err, redirectLocation, renderProps){ 
      if(err){ 
       res.status(500).send(err.message); 
      } else if(redirectLocation){ 
       res.status(302).redirect(redirectLocation.pathname +  redirectLocation.search); 
      } else if(renderProps){ 
       var html = ReactDOM.renderToString(React.createElement(Router.RouterContext, renderProps)); 
      var page = swig.renderFile(__dirname + '/public/index.html', {html: html}); 
      res.status(200).send(page); 
     } else { 
      res.status(404).send('Page not found'); 
     } 
    } 
); 
}); 
// and so on ...

그리고 여기 내 routes.js

import React from 'react'; 
import { Route } from 'react-router'; 
import App from './components/App'; 
import Home from './components/Home'; 

export default (
    <Route component={App}> 
     <Route path="/" component={Home} /> 
    </Route> 
);

출처

2016-10-03 eScoo

더 많은 관련 코드, 특히 res.status ...가 제공되는 app.get을 표시 할 수 있습니까?/public/디렉토리도 공개로 제공됩니까? – Molda

추가 코드가 추가되었습니다. 문제는 작동하지 않는다는 것이 아니라 콘텐츠가 렌더링되기 전에 사용자가 1 초 동안 출력 태그를 볼 수 있다는 것입니다. – eScoo

나는 서버를 떠나서는 안되는 swig 태그'{{html | safe}} '를 이해합니다. swig는 서버에서이를 대체해야하기 때문에 절대로 클라이언트에 도달해서는 안됩니다. 'res.status (200) .send (page);하기 전에 console.log ('HTML', page)를 추가하십시오. 여전히 거기에있는 swig 태그입니까? 그것은 안된다! – Molda

index.html을 문제였다입니다. "site.html"로 이름을 바꾸 었으며 서버 측 렌더링이 루트 경로에서 작동하고 swig 태그가 표시되지 않습니다.

출처

2016-10-08 17:36:40 eScoo

Swig 템플릿은 내용을 렌더링하기 전에 출력 태그를 보여줍니다.

답변

관련 문제