Testing on local devices
Last updated
Last updated
Cuando se utilizan nuestras plantillas, Needle Engine ejecuta un servidor de desarrollo local. Simplemente pulse play y se abrirá un sitio web en su navegador predeterminado, listo para realizar pruebas en su dispositivo local. Para realizar pruebas en otros dispositivos de la misma red, es posible que deba instalar un certificado autofirmado (consulte a continuación).
Cuando utilice una configuración/framework personalizada, consulte la documentación de su framework sobre cómo ejecutar un servidor de desarrollo local seguro.
::: tip
Nuestro servidor local utiliza la dirección IP de su red local (por ejemplo, https://192.168.0.123:3000) en lugar de localhost:3000. Esto le permite ver y probar rápidamente su proyecto desde dispositivos móviles, gafas de RV y otras máquinas de la misma red.
Utilizamos HTTPS en lugar del antiguo HTTP, porque las potentes API web modernas como WebXR requieren una conexión segura; la S significa "secure" (seguro). :::
Los diferentes sistemas operativos tienen diferentes requisitos de seguridad para el desarrollo local. Normalmente, la visualización de un sitio web funcionará incluso con un certificado no fiable autogenerado, pero los navegadores pueden advertir sobre la falta de confianza y algunas funciones no están disponibles. Aquí tiene un resumen:
::: tip Se recomienda instalar certificados autofirmados de confianza en sus dispositivos de desarrollo para una experiencia de desarrollo fluida. Encuentre los pasos al final de esta página. :::
Predeterminado – con certificado no fiable autogeneradoMuestra una advertencia de certificado al abrir el proyecto en un navegador.Utiliza el paquete npm .
Utilizamos conexiones websocket para comunicarnos entre el navegador y el servidor de desarrollo local. Los websockets requieren una conexión segura (HTTPS) para funcionar. Dependiendo de la plataforma, es posible que necesite configurar un certificado personalizado para el desarrollo local. Android y Windows no necesitan un certificado personalizado, pero iOS y MacOS sí.
OS
Visualización en el navegador (con una advertencia de seguridad)
Recargas automáticas
Windows
(✓)
✓
Linux
(✓)
✓
Android
(✓)
✓
macOS
(✓)
❌
iOS
(✓ Safari y Chrome, después de recargar la página) ❌ Mozilla XR Viewer
❌
Xcode Simulators
(✓ después de recargar la página)
❌
Windows
✓
✓
Linux
✓
✓
Android
✓
✓
macOS
✓
✓
iOS
✓
✓
en Unity/Blender, haga clic en "Open Workspace" para abrir VS Code
compruebe que está utilizando vite-plugin-mkcert en lugar de vite-plugin-basic-ssl (este último no genera un certificado raíz de confianza, que necesitamos) en su archivo vite.config.ts:
abra package.json
elimine la línea con "@vitejs/plugin-basic-ssl" de devDependencies
abra un Terminal en VS Code y ejecute npm install vite-plugin-mkcert --save-dev, que añadirá la última versión
abra vite.config.ts y reemplace import basicSsl from '@vitejs/plugin-basic-ssl' con import mkcert from'vite-plugin-mkcert'
en plugins: [, reemplace basicSsl(), con mkcert(),
ejecute npm run start una vez desde el terminal de VS Code
en Windows, esto abrirá una nueva ventana y le guiará a través de la creación e instalación del certificado
en MacOS, el terminal le pedirá su contraseña y luego generará e instalará el certificado.
si recibe un error Error: Port 3000 is already in use, cierre el servidor que pueda estar aún ejecutándose desde Unity.
el certificado generado se instalará automáticamente en la máquina en la que lo generó.
puede detener el proceso del terminal de nuevo.
a partir de ahora, al pulsar Play en Unity/Blender se utilizará el certificado generado para el servidor local, y no se mostrará ninguna "advertencia de seguridad", ya que su navegador ahora confía en la conexión local.
En sus dispositivos de desarrollo, necesita instalar el certificado generado y permitir que el OS confíe en él. Esto es diferente para cada OS. Para cada uno de ellos, necesitará el archivo rootCA.pem que se generó, y enviarlo al dispositivo que desea autenticar.
En Windows: encuentre el certificado en Users/<your-user>/.vite-plugin-mkcert/rootCA.pemEn MacOS: encuentre el certificado en Users/<your-user>/.vite-plugin-mkcert/rootCA.pem
Envíe el archivo a usted mismo (por ejemplo, por correo electrónico, AirDrop, iCloud, USB, Slack, ...) para que pueda acceder a él en sus dispositivos de desarrollo.
Abra el archivo. Se le pedirá que instale el certificado.
Abra el archivo.
Se le pedirá que añada el perfil a su dispositivo. Confirme.
Vaya a Ajustes (Settings).
Habrá una nueva entrada "Perfil" (Profile). Selecciónela y permita que el perfil esté activo para este dispositivo.
En iOS / iPadOS, también necesita permitir la "Confianza del certificado raíz" (Root Certificate Trust). Para ello, busque Confianza (Trust) o vaya a Ajustes > General > Información > Ajustes de confianza de certificados (Settings > General > About > Info > Certificate Trust Settings) y habilite la confianza total para el certificado raíz.
::: tip El certificado se instala automáticamente en la máquina en la que lo generó. Para otras máquinas de la red local, siga los pasos a continuación para establecer también una conexión de confianza. :::
Abra el archivo. Se abrirá Acceso a Llaveros (Keychain Access) y le permitirá instalar el certificado.
Es posible que deba establecer "Confianza" (Trust) en "Permitir siempre" (Always allow).
Abra certmgr ("Administrar certificados de usuario") escribiendo tecla Windows + certmgr.
En la barra lateral izquierda, seleccione "Entidades de certificación raíz de confianza" (Trusted Root Certification Authorities).
Haga clic derecho en "Certificados" (Certificates) y seleccione "Todas las tareas > Importar" (All Tasks > Import).
Seleccione el archivo rootCA.pem (es posible que deba cambiar el tipo de archivo a "todos") y siga las instrucciones.
Página traducida automáticamente con IA
Con un certificado raíz de confianza autofirmadoNo se muestra ninguna advertencia de seguridad. Es necesario instalar el certificado generado en sus dispositivos.Utiliza el paquete npm .
package.json se ve así ahora:
