title: Next JS Custom Server app.render do not pass query to a component
body: <p>I'm trying to pass <code>userData</code> with <code>app.render</code>, but while <strong>Server side rendering</strong> <code>router.query</code> is empty, although i have passed <code>userData</code>! Is it NextJS's bug, or am i doing something wrong?</p>
  
  <p>app.js:</p>
  
  <pre><code>const { createServer } = require('http')
  const { parse } = require('url')
  const next = require('next')
  
  const dev = process.env.NODE_ENV !== 'production'
  const app = next({ dev })
  const handle = app.getRequestHandler()
  
  app.prepare().then(() =&gt; {
    createServer((req, res) =&gt; {
  
      const parsedUrl = parse(req.url, true)
      const { pathname, query } = parsedUrl
  
      if (pathname === '/index') {
        app.render(req, res, '/index', {
          userData: {
            id: 1,
            name: 'admin'
          }
        })
      } else {
        handle(req, res, parsedUrl)
      }
    }).listen(3333, err =&gt; {
      if (err) throw err
      console.log('&gt; Ready on http://localhost:3000')
    })
  })
  </code></pre>
  
  <p>pages/index.js:</p>
  
  <pre><code>import { useRouter } from 'next/router'
  
  export default () =&gt; {
      const router = useRouter();
      const { query } = router;
  
      return (
          &lt;div&gt;
              Query: {JSON.stringify(query)}
          &lt;/div&gt;
      );
  };
  </code></pre>