forked from facebook/react
-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.php
51 lines (43 loc) · 1.58 KB
/
index.php
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
<?php
// URL to the box running `node server.js`
define('RENDER_SERVER', 'http://localhost:3000/');
function react_component($module, $props) {
$props_json = json_encode($props);
// Try to server-render the component if the service is available.
// If it isn't, no big deal: the client will transparently render
// the markup!
$server_markup = @file_get_contents(
RENDER_SERVER .
'?module=' .
urlencode($module) .
'&props=' .
urlencode($props_json)
);
$container_id = uniqid();
// Generate the code required to run the component on the client.
// We assume that the Browserify bundle is loaded in the page already
// and that you used -r to get a global require() function that provides
// every $module you may request as well as React.
// Note that this solution is simple but I don't think it scales to
// multiple large pages very well. For that you'd be better off using
// webpack.
$startup_code =
'<script>require(\'react\').render(require(' .
json_encode($module) .
')(' . $props_json . '), ' .
'document.getElementById(' . json_encode($container_id) . '))' .
'</script>';
$container_markup = '<div id="' . $container_id . '">' . $server_markup . '</div>';
return $container_markup . $startup_code;
}
?>
<html>
<head>
<title>React server rendering example</title>
<script src="static/bundle.js"></script>
</head>
<body>
Welcome to the React server rendering example. Here is a server-rendered React component:
<?php echo react_component('./src/App', array('name' => 'Pete')); ?>
</body>
</html>