title: Webpack DevServer -> proxy HTTPS resource -> UNABLE_TO_VERIFY_LEAF_SIGNATURE
body: <p>I'm using Webpack DevServer with the following settings:</p>
  
  <pre><code>devServer: {
      proxy: {
          '*': {
              target: 'https://localhost:44369',
              secure: true
          }
      },
      port: 8080,
      host: '0.0.0.0',
      hot: true,
      https: false
  }
  </code></pre>
  
  <p><a href="https://webpack.js.org/configuration/dev-server/#devserver-https" rel="noreferrer">https://webpack.js.org/configuration/dev-server/#devserver-https</a></p>
  
  <p>It has worked fine with <code>HTTP</code> but when I'm now switching my proxy to <code>HTTPS</code> I start getting errors.</p>
  
  <p>Got the following message in command prompt:</p>
  
  <blockquote>
    <p>[HPM] Error occurred while trying to proxy request / from
    localhost:8080 to <a href="https://localhost:44369" rel="noreferrer">https://localhost:44369</a>
    (UNABLE_TO_VERIFY_LEAF_SIGNATURE)
    (<a href="https://nodejs.org/api/errors.html#errors_common_system_errors" rel="noreferrer">https://nodejs.org/api/errors.html#errors_common_system_errors</a>)</p>
  </blockquote>
  
  <p>I have tried to set Node <code>NODE_TLS_REJECT_UNAUTHORIZED</code> to <code>0</code> but this does not help.</p>
  
  <pre><code>new webpack.DefinePlugin({
      'process.env.NODE_TLS_REJECT_UNAUTHORIZED': 0
  })
  </code></pre>
  
  <p>Is there some way that I can access the generated certificates CA and add this to Trusted Root Certification Authorities? Will this help or do I need to change other things as well?</p>
  
  <p>If I switch <code>https</code> to <code>true</code> I get the same error. </p>
  
  <blockquote>
    <p>Generating SSL Certificate</p>
    
    <p>...</p>
    
    <p>[HPM] Error occurred while trying to proxy request / from
    localhost:8080 to <a href="https://localhost:44369" rel="noreferrer">https://localhost:44369</a>
    (UNABLE_TO_VERIFY_LEAF_SIGNATURE)
    (<a href="https://nodejs.org/api/errors.html#errors_common_system_errors" rel="noreferrer">https://nodejs.org/api/errors.html#errors_common_system_errors</a>)</p>
  </blockquote>
  
  <p>When I access the desired resource in Chrome I also get the following error:</p>
  
  <p><a href="https://i.stack.imgur.com/0U6xL.png" rel="noreferrer"><img src="https://i.stack.imgur.com/0U6xL.png" alt="enter image description here"></a></p>
  
  <p><strong>Update:</strong></p>
  
  <p>I have now set webpack-dev-server to use the same certificate as my original web server (<a href="https://localhost:44369" rel="noreferrer">https://localhost:44369</a>) does. I have verified that the <code>Thumbprint</code> and <code>Serial number</code> are identical between the two.</p>
  
  <p><a href="https://webpack.js.org/configuration/dev-server/#devserver-pfx" rel="noreferrer">https://webpack.js.org/configuration/dev-server/#devserver-pfx</a></p>
  
  <pre><code>https: true,
  pfx: fs.readFileSync(path.resolve(__dirname, "../Client.WebProxy/App_Data/Certificate/") + '\\localhost.pfx'),
  pfxPassphrase: 'securePassword'
  </code></pre>
  
  <p><a href="https://i.stack.imgur.com/tYE4S.png" rel="noreferrer"><img src="https://i.stack.imgur.com/tYE4S.png" alt="enter image description here"></a></p>
  
  <p>I also tried with injecting the certificate with <code>ssl-root-cas</code> but I still get the same error.</p>
  
  <pre><code>var sslRootCAs = require('ssl-root-cas/latest')
  sslRootCAs.inject();
  </code></pre>
  
  <p>Tried this as well:</p>
  
  <pre><code>target: 'https://[::1]:44369',
  </code></pre>
  
  <p><a href="https://github.com/saikat/react-apollo-starter-kit/issues/20#issuecomment-316651403" rel="noreferrer">https://github.com/saikat/react-apollo-starter-kit/issues/20#issuecomment-316651403</a></p>
  
  <pre><code>var rootCas = require('ssl-root-cas/latest').create();
  rootCas.addFile(path.resolve(__dirname, "../Client.WebProxy/App_Data/Certificate/") + '\\localhost.pem');
  require('https').globalAgent.options.ca = rootCas;
  </code></pre>
  
  <p><a href="https://www.npmjs.com/package/ssl-root-cas" rel="noreferrer">https://www.npmjs.com/package/ssl-root-cas</a></p>
  
  <pre><code>https: {
      key: fs.readFileSync(path.resolve(__dirname, "../Client.WebProxy/App_Data/Certificate/") + '\\localhost.key'),
      cert: fs.readFileSync(path.resolve(__dirname, "../Client.WebProxy/App_Data/Certificate/") + '\\localhost.crt'),
      ca: fs.readFileSync(path.resolve(__dirname, "../Client.WebProxy/App_Data/Certificate/") + '\\localhost.pem'),
  }
  </code></pre>
  
  <p><a href="https://webpack.js.org/configuration/dev-server/#devserver-https" rel="noreferrer">https://webpack.js.org/configuration/dev-server/#devserver-https</a></p>