Ejecutar rápidamente el proyecto de ejemplo del complemento Mega para miniprogramas de WeChat

Este artículo explica cómo ejecutar rápidamente el proyecto de ejemplo del complemento Mega para miniprogramas de WeChat. Aprenderá a:

Preparar y configurar el entorno de desarrollo del proyecto de ejemplo.
Probar algunas funciones del ejemplo, incluida la localización en la nube de Mega.
Mostrar el archivo de máscara de los resultados de mapeo y comprobar la alineación del modelo con el entorno real.

Antes de empezar

Consulte ¿Puedo usar la función de localización? para confirmar que la base de datos de localización se ha creado correctamente y que se han añadido mapas.

Confirmar que el miniprograma pertenece a una entidad empresarial

Importante

El complemento Mega solo admite miniprogramas de WeChat pertenecientes a entidades empresariales. Los miniprogramas registrados por particulares no pueden usar este complemento.

En el panel de administración del miniprograma, compruebe que Configuración > Información básica > Información del titular indica persona jurídica empresarial o trabajador autónomo.

Como las funciones de Mega se ofrecen mediante un complemento, necesita un miniprograma de WeChat registrado por una entidad empresarial como aplicación anfitriona.

Incluso para ejecutar el proyecto de ejemplo, debe configurar el AppID de su propio miniprograma de WeChat para depurarlo y obtener una vista previa en las herramientas de desarrollo.

Descargar el proyecto de ejemplo

Vaya a la página de descarga de herramientas de desarrollo.
Después de aceptar la Política de privacidad de EasyAR, haga clic en Descargar.
Una vez completada la descarga, descomprima localmente el paquete .zip.

Configurar el proyecto de ejemplo

Inicie sesión en las herramientas de desarrollo de miniprogramas de WeChat.
Importe el proyecto de ejemplo con las herramientas de desarrollo de miniprogramas de WeChat.
- Abra las herramientas de desarrollo, pulse Importar y seleccione el directorio descomprimido en su equipo.
- Asegúrese de que el AppID coincida con el indicado al solicitar la licencia Mega, seleccione el modo Miniprograma y pulse Crear.
Nota

Un AppID inconsistente hará que falle la verificación de licencia
Configurar la licencia Mega y el servicio en la nube

Abra miniprogram/components/sample-data/easyar-settings.ts y rellene los campos correspondientes según la información de licencia y servicio de los preparativos:
- Licencia Mega
```
/** Su licencia Mega para el Mini Program */
export const EasyARLicenseKey: string = "";
```
Cómo obtener una licencia Mega WeChat Mini Program

En EasyAR Developer Center, seleccione Mega WeChat Mini Program.

La licencia Mega WeChat Mini Program que desea usar debe existir en la lista. Si no hay licencia disponible, compruebe si su cuenta es la misma que se usó para crear la base de localización Mega.

Haga clic en el nombre de Mini Program para obtener su licencia Mega. Haga clic en Copy a la derecha, péguela en easyar-settings.ts como valor de EasyARLicenseKey, y confirme que su AppID asociado coincide exactamente con el AppID de su WeChat Mini Program.
- API Key y Seceret del servicio en la nube
```
/** Su API Key y Seceret del servicio en la nube */
export const EasyARAPIKey: string = "";
export const EasyARAPISecret: string = "";
```
Cómo obtener API Key y Seceret del servicio en la nube

En EasyAR Developer Center, seleccione Cloud Service API KEY.

Si ya creó API Key y Seceret del servicio en la nube, haga clic en Copy a la derecha en secuencia y péguelos en easyar-settings.ts como valores de EasyARAPIKey y EasyARAPISecret.

Si no ha creado API Key y Seceret del servicio en la nube antes, créelos de la siguiente manera:

En EasyAR Developer Center, seleccione Cloud Service API KEY > Create API KEY.

Introduzca el nombre de la aplicación, seleccione los servicios en la nube que necesita usar: Mega Block y/o Mega Landmark, y haga clic en Confirm.
- ServerAddress y AppID del servicio en la nube：
```
/** ServerAddress y AppID de su base de datos de localización Mega en la nube */
export const MegaTrackerServerAddress: string = "";
export const MegaTrackerAppID: string = "";
```
Cómo obtener ServerAddress y AppID de la base de localización en la nube Mega

En EasyAR Developer Center, seleccione Block Cloud Localization y luego su grupo de servicio de localización en la nube Mega.

Seleccione su base de localización en la nube Mega:

Haga clic en Key y obtenga abajo, en secuencia, el AppID y Server Address de la base de localización en la nube. Haga clic en Copy a la derecha y péguelos en easyar-settings.ts como valores de MegaTrackerAppID y MegaTrackerServerAddress.
Verificar rápidamente con el archivo de máscara de los resultados de mapeo

Descargue el archivo de máscara glb desde la base de datos de localización en la nube mediante Descargar archivo de máscara. El modelo blanco 3D del entorno real permite comprobar la alineación sin crear anotaciones.

Nota

Este método solo se aplica a resultados de mapeo de la versión 9.6 o posterior.

Busque el Block que desea probar en la base de datos de localización en la nube y pulse Descargar archivo de máscara en la columna Acciones. Realice la prueba en el lugar correspondiente a ese Block.

En la ventana emergente, seleccione Baja precisión y pulse Descargar para reducir la carga y el renderizado en el teléfono.

Coloque los archivos glb descargados en el directorio assets del proyecto Mini Program (miniprogram/assets/ en el proyecto de ejemplo) y conserve la posición, rotación y escala originales de cada modelo.

En miniprogram/components/sample-easyar-mega/index.ts, cambie el src de la configuración occlusionMeshAssets por una ruta relativa a la raíz del proyecto Mini Program. La configuración predeterminada es:
```
const occlusionMeshAssets = [
    {
        assetId: "occlusionMesh00",
        type: "gltf",
        src: "assets/Low_Poly_occlusion.glb",
        options: {}
    },
];
```
Si la máscara descargada contiene varios archivos GLB, añada una entrada por archivo en occlusionMeshAssets, con un assetId único y su src correspondiente. El ejemplo carga los archivos, adjunta sus mallas de máscara al Block localizado y aplica los materiales integrados de visualización y oclusión. Use el interruptor Archivo de máscara de la página para mostrar u ocultar las mallas. Los recursos se liberan junto con el componente de ejemplo; no hace falta escribir lógica adicional de carga o liberación.

Ejecutar el sample en un dispositivo real

Pulse el botón de vista previa en dispositivo real de la barra superior de las herramientas de desarrollo del miniprograma y escanee el código QR para cargar el proyecto en el teléfono de pruebas.

Precaución

Los componentes xr-frame con funciones AR no pueden ejecutarse directamente en el simulador de las herramientas de desarrollo.

Nota

Al ejecutar por primera vez el proyecto de ejemplo en las herramientas de desarrollo de WeChat, puede aparecer un aviso de que el complemento no está autorizado. Autorícelo desde las herramientas de desarrollo o consulte el procedimiento de integración del complemento
Pulse EasyAR Mega Samples para abrir la escena AR del proyecto de ejemplo.

Nota

Si la escena AR del proyecto de ejemplo no se abre, es posible que el dispositivo no admita el componente de visión WeChat VisionKit. Consulte las limitaciones de dispositivos.
El mensaje EasyAR Session is initializing indica que se está inicializando la detección de planos de WeChat.

Consejo

Asegúrese de probar en un entorno bien iluminado y evite paredes o suelos de color liso de gran superficie.

Apunte al suelo u otra superficie plana y mueva el teléfono de izquierda a derecha a velocidad constante para acelerar el proceso.
Tras la inicialización, sostenga el teléfono en vertical para captar el entorno real. Cuando la localización sea correcta, Found aparecerá en la información Debug y el indicador inferior derecho cambiará de blanco a verde.
Comprobar la alineación del archivo de máscara con el entorno real

Tras configurar la visualización del archivo de máscara, espere a que se cargue el modelo y se localice correctamente en el Block correspondiente. Active el interruptor Archivo de máscara en la página para ver el modelo blanco 3D superpuesto a la imagen de la cámara y comprobar su alineación con el entorno real.