Detección & Enrutamiento Móvil
Mañuti incorpora la capacidad de inspeccionar el agente de usuario a nivel de transporte mediante el fork corporativo de Mobile-Detect, habilitando la segregación de flujos entre la plataforma web administrativa y la futura aplicación híbrida Framework7 + Capacitor.
1. Detección Server-Side vs. Media Queries CSS
Mientras que las Media Queries de CSS solo alteran la distribución visual en la pantalla, la detección del lado del servidor permite:
- Redirigir a subdominios dedicados (
m.dominio.com). - Servir plantillas optimizadas libres de código de escritorio innecesario.
- Restringir el acceso a módulos exclusivos de terminales fijas.
2. El Middleware CheckMobileDevice
// app/Http/Middleware/CheckMobileDevice.php
namespace App\Http\Middleware;
use Closure;
use Illuminate\Http\Request;
use Detection\MobileDetect;
class CheckMobileDevice
{
public function handle(Request $request, Closure $next)
{
$detect = new MobileDetect();
if ($detect->isMobile() || $detect->isTablet()) {
// Ejemplo: Inyección de encabezado o desvío a vista móvil
$request->attributes->set('is_mobile', true);
}
return $next($request);
}
}
3. Estrategia Híbrida: Standalone con Dexie.js (Offline-First)
Para la variante de aplicación móvil compilada en APK:
- Interfaz: Componentes nativos de Framework7.
- Hardware: Plugins nativos de Capacitor JS (Cámara, GPS, Sensores).
- Almacenamiento Ilimitado: IndexedDB administrado a través de Dexie.js. La app opera desconectada y sincroniza cambios hacia los endpoints de Laravel al detectar conectividad.