我目前正在阅读有关React和Universal应用程序的a book，作者声称其中以下是将初始状态从服务器传递到客户端的最佳实践:
server.js
import React from 'react';
import {renderToStaticMarkup} from 'react-dom/server';
import Myapp from '../MyApp';
import api from '../services';
function renderPage(html, initialData) {
return `
<html>
<body>
${html}
</body>
<script>
window.__INITIAL_STATE__ = ${JSON.stringify(initialData)};
</script>
<script src="bundle.js"></script>
</html>
`;
}
export default function(request, reply) {
const initialData = api.getData();
const html = renderToStaticMarkup(<MyApp />);
reply(renderPage(html, initialData);
}
然后，在客户端中，您将读取如下数据:
bundle.js
const initialData = window.__INITIAL_STATE__ || {};
const mountNode = document.getElementById('root');
ReactDOM.render(<MyApp />, mountNode);
据我了解，初始状态首先转换为字符串，然后作为全局对象文字附加到窗口对象。
这个解决方案对我来说看起来很粗糙。该书于2016年年中发行。
window.__INITIAL_STATE__的使用仍然是这样做的方式吗？还是有更好的解决方案？例如，我可以想象有可能在一个单独的微服务调用中提供初始状态，与将数据直接嵌入到文档中相比，这样也可以更好地缓存初始状态，因为这样初始状态数据必须在每个页面刷新的时间，即使数据没有更改。
最佳答案
简单的答案:是的。
但是我不确定为什么没有人指出您使用JSON.stringify(initialData)有一个非常常见的XSS漏洞，而要做的是:
import serialize from 'serialize-javascript';
window.__INITIAL_STATE__ = ${serialize(initialData)};
关于javascript - window .__ INITIAL_STATE__仍然是在React Universal应用程序中将初始状态传递给客户端的首选方法吗？，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/43739067/