Estoy construyendo un sitio web con escaneo de código qr. Esto funciona bien en el escritorio pero no funciona en el móvil. En Reactjs, esto funciona con una conexión segura. Pero en Nextjs, esto no funciona con una conexión segura. Ejecuto un servidor personalizado en Nextjs.

https://dev.to/nakib/using-https-on-next-js-local-development-server-bcd

Este es mi código.

 import React, { useState } from 'react'; import { QrReader } from 'react-qr-reader'; const Home = (props) => { const [data, setData] = useState('No result'); return ( <> <QrReader onResult={(result, error) => { if (!!result) { setData(result?.text); } if (!!error) { console.info(error); } }} style={{ width: '100%' }} /> <p>{data}</p> </> ); }; export default Home;

Este es un error del inspector de cromo móvil. consola de errores