marco
54cccdd095
- Removido README.md padrão do Laravel (backend) - Removidos scripts de deploy (não mais necessários) - Atualizado copilot-instructions.md para novo fluxo - Adicionada documentação de auditoria do servidor - Sincronizado código de produção com repositório Novo workflow: - Trabalhamos diretamente em /root/webmoney (symlink para /var/www/webmoney) - Mudanças PHP são instantâneas - Mudanças React requerem 'npm run build' - Commit após validação funcional
133 lines
4.5 KiB
Markdown
Executable File
133 lines
4.5 KiB
Markdown
Executable File
# 📱 Como Instalar WebMoney no iPhone/iPad
|
|
|
|
## ✅ Requisitos
|
|
- iOS 11.3 ou superior
|
|
- Safari (navegador nativo do iOS)
|
|
|
|
## 📲 Passo a Passo da Instalação
|
|
|
|
### 1. Abrir no Safari
|
|
Abra o Safari e acesse: **https://webmoney.cnxifly.com**
|
|
|
|
> ⚠️ **IMPORTANTE**: Deve ser o Safari! Chrome e Firefox no iOS não suportam PWA.
|
|
|
|
### 2. Fazer Login
|
|
Entre com suas credenciais:
|
|
- Email: `marco@cnxifly.com`
|
|
- Senha: `M@ster9354`
|
|
|
|
### 3. Adicionar à Tela Inicial
|
|
1. Toque no ícone de **Compartilhar** (quadrado com seta para cima)
|
|
2. Role para baixo e toque em **"Adicionar à Tela de Início"**
|
|
3. Confirme o nome "WebMoney" (ou personalize)
|
|
4. Toque em **"Adicionar"**
|
|
|
|
### 4. Usar como App
|
|
- Um ícone do WebMoney aparecerá na sua tela inicial
|
|
- Toque no ícone para abrir como aplicativo
|
|
- O app abrirá em tela cheia (sem barras do Safari)
|
|
- Status bar translúcido integrado ao design
|
|
|
|
## 🎨 Recursos PWA
|
|
|
|
### ✅ O que Funciona
|
|
- **Instalação na tela inicial** - Ícone próprio como app nativo
|
|
- **Modo standalone** - Sem barras do navegador
|
|
- **Cache offline** - Assets ficam em cache para carregamento rápido
|
|
- **Service Worker** - Atualizações automáticas
|
|
- **Ícone Apple Touch** - 180x180px otimizado para iOS
|
|
- **Status bar integrado** - Estilo black-translucent
|
|
|
|
### 🚫 Limitações do PWA no iOS
|
|
- **Sem notificações push** (Safari não suporta)
|
|
- **Sem sincronização em background** (requer app nativo)
|
|
- **Cache limitado** - iOS pode limpar cache se memória baixa
|
|
- **Sem acesso a APIs nativas** (câmera, localização, etc.)
|
|
|
|
## 🔄 Atualizações
|
|
|
|
O app verifica atualizações automaticamente:
|
|
- **A cada 1 hora** enquanto app estiver aberto
|
|
- **Ao recarregar** a página
|
|
- Quando houver atualização, aparece um prompt perguntando se deseja atualizar
|
|
|
|
## 🆙 Upgrade Futuro: App Store
|
|
|
|
Se no futuro desejarmos publicar na App Store (US$ 99/ano):
|
|
|
|
### Opção 1: Capacitor (Recomendado)
|
|
- **Tempo**: 30 minutos
|
|
- **Código**: Zero mudanças necessárias
|
|
- **Recursos**: Notificações push, background sync, APIs nativas
|
|
- **Build**: Ionic Capacitor (`npx cap add ios`)
|
|
|
|
### Opção 2: React Native
|
|
- **Tempo**: 2-3 dias
|
|
- **Código**: Reescrever em React Native
|
|
- **Recursos**: Acesso total a APIs nativas
|
|
- **Custo**: Alto esforço de migração
|
|
|
|
## 📊 Comparação: PWA vs App Nativo
|
|
|
|
| Recurso | PWA (Atual) | Capacitor | App Nativo |
|
|
|---------|-------------|-----------|------------|
|
|
| **Custo** | Gratuito | $99/ano | $99/ano |
|
|
| **Instalação** | Via Safari | Via App Store | Via App Store |
|
|
| **Tempo desenvolvimento** | Pronto | 30 min | 2-3 dias |
|
|
| **Notificações** | ❌ | ✅ | ✅ |
|
|
| **Offline** | ✅ Parcial | ✅ Total | ✅ Total |
|
|
| **APIs Nativas** | ❌ | ✅ | ✅ |
|
|
| **Atualizações** | Automático | Automático | App Store Review |
|
|
| **Compatibilidade código** | - | 100% | 0% (reescrever) |
|
|
|
|
## 🐛 Troubleshooting
|
|
|
|
### App não aparece na tela inicial
|
|
- Certifique-se de usar **Safari** (não Chrome/Firefox)
|
|
- Verifique se está em https://webmoney.cnxifly.com (não IP)
|
|
- Tente recarregar a página (⌘+R no Safari)
|
|
|
|
### App não funciona offline
|
|
- Service Worker leva alguns segundos para cachear
|
|
- Navegue pelo app após instalação para cachear rotas
|
|
- Cache só funciona após primeira visita
|
|
|
|
### Ícone não aparece correto
|
|
- Force reload do Safari: **⌘+Shift+R**
|
|
- Remova o app e reinstale
|
|
- Limpe cache do Safari (Ajustes > Safari > Limpar Histórico)
|
|
|
|
## 📝 Notas Técnicas
|
|
|
|
### Service Worker
|
|
- **Versão**: 1.39.0
|
|
- **Estratégias**:
|
|
- **Cache-First**: Imagens, fontes (resposta imediata)
|
|
- **Network-First**: Chamadas API (dados frescos)
|
|
- **Stale-While-Revalidate**: HTML/CSS/JS (balance)
|
|
|
|
### Manifest
|
|
- **scope**: `/` (todo o site)
|
|
- **display**: `standalone` (tela cheia)
|
|
- **orientation**: `portrait-primary` (retrato)
|
|
- **categories**: finance, productivity, business
|
|
|
|
### Meta Tags iOS
|
|
```html
|
|
<meta name="apple-mobile-web-app-capable" content="yes">
|
|
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">
|
|
<meta name="apple-mobile-web-app-title" content="WebMoney">
|
|
<meta name="format-detection" content="telephone=no">
|
|
```
|
|
|
|
## 🎯 Conclusão
|
|
|
|
O PWA do WebMoney oferece:
|
|
- ✅ **Experiência de app nativo** sem custo da App Store
|
|
- ✅ **Instalação simples** via Safari
|
|
- ✅ **Performance otimizada** com cache offline
|
|
- ✅ **Atualizações automáticas** sem revisão da Apple
|
|
- ✅ **Caminho de upgrade** para Capacitor quando necessário
|
|
|
|
Para mais informações, consulte [CHANGELOG.md](../CHANGELOG.md) versão 1.39.0.
|