1. <!DOCTYPE html>

  2. <html style="width: 100%; height: 100%; overflow: hidden">

  3.   <head>

  4.     <meta charset="utf-8">

  5.     <title>Fizz Example</title>

  6.   </head>

  7.   <body>

  8.     <h1>Fizz Example</h1>

  9.     <div id="container">

  10.       <p>

  11.         To install React, follow the instructions on

  12.         <a href="https://github.com/facebook/react/">GitHub</a>.

  13.       </p>

  14.       <p>

  15.         If you can see this, React is <strong>not</strong> working right.

  16.         If you checked out the source from GitHub make sure to run <code>npm run build</code>.

  17.       </p>

  18.     </div>

  19.     <script src="../../build/oss-experimental/react/umd/react.development.js"></script>

  20.     <script src="../../build/oss-experimental/react-dom/umd/react-dom.development.js"></script>

  21.     <script src="../../build/oss-experimental/react-dom/umd/react-dom-server.browser.development.js"></script>

  22.     <script src="https://unpkg.com/babel-standalone@6/babel.js"></script>

  23.     <script type="text/babel">

  24.       async function render() {

  25.         let controller = new AbortController();

  26.         let response;

  27.         try {

  28.           let stream = await ReactDOMServer.renderToReadableStream(

  29.             <html>

  30.               <body>Success</body>

  31.             </html>,

  32.             {

  33.               signal: controller.signal,

  34.             }

  35.           );

  36.           response = new Response(stream, {

  37.             headers: {'Content-Type': 'text/html'},

  38.           });

  39.         } catch (x) {

  40.           response = new Response('<!doctype><p>Error</p>', {

  41.             status: 500,

  42.             headers: {'Content-Type': 'text/html'},

  43.           });

  44.         }

  45. 

  46.         let blob = await response.blob();

  47.         let url = URL.createObjectURL(blob);

  48.         let iframe = document.createElement('iframe');

  49.         iframe.src = url;

  50.         let container = document.getElementById('container');

  51.         container.innerHTML = '';

  52.         container.appendChild(iframe);

  53.       }

  54.       render();

  55.     </script>

  56.   </body>

  57. </html>
About Sign Up Leave Feedback Contact