199 lines
3.6 KiB
Markdown
199 lines
3.6 KiB
Markdown
# 🚀 Como Iniciar o Servidor Local
|
|
|
|
## ❌ PROBLEMA: Erro CORS
|
|
|
|
Quando você abre `index.html` diretamente no navegador (`file:///`), o navegador **bloqueia** o carregamento de arquivos CSV por segurança (política CORS).
|
|
|
|
**Erro típico:**
|
|
```
|
|
Access to fetch at 'file:///...' has been blocked by CORS policy
|
|
```
|
|
|
|
## ✅ SOLUÇÃO: Usar Servidor Web Local
|
|
|
|
Você **PRECISA** usar um servidor web local para o aplicativo funcionar corretamente.
|
|
|
|
---
|
|
|
|
## 🎯 Opção 1: Python (Recomendado)
|
|
|
|
### Windows:
|
|
|
|
**Método 1: Duplo clique**
|
|
1. Duplo clique em `server.bat`
|
|
2. Aguarde o servidor iniciar
|
|
3. Acesse: http://localhost:8000
|
|
|
|
**Método 2: PowerShell/CMD**
|
|
```bash
|
|
python server.py
|
|
```
|
|
|
|
### Linux/Mac:
|
|
|
|
```bash
|
|
python3 server.py
|
|
```
|
|
|
|
---
|
|
|
|
## 🎯 Opção 2: Python Simples (Sem arquivo)
|
|
|
|
### Python 3:
|
|
```bash
|
|
python -m http.server 8000
|
|
```
|
|
|
|
### Python 2:
|
|
```bash
|
|
python -m SimpleHTTPServer 8000
|
|
```
|
|
|
|
Acesse: http://localhost:8000
|
|
|
|
---
|
|
|
|
## 🎯 Opção 3: Node.js (http-server)
|
|
|
|
### Instalar (uma vez):
|
|
```bash
|
|
npm install -g http-server
|
|
```
|
|
|
|
### Executar:
|
|
```bash
|
|
http-server -p 8000
|
|
```
|
|
|
|
Acesse: http://localhost:8000
|
|
|
|
---
|
|
|
|
## 🎯 Opção 4: PHP
|
|
|
|
```bash
|
|
php -S localhost:8000
|
|
```
|
|
|
|
Acesse: http://localhost:8000
|
|
|
|
---
|
|
|
|
## 🎯 Opção 5: Live Server (VS Code)
|
|
|
|
1. Instalar extensão "Live Server" no VS Code
|
|
2. Clicar com botão direito em `index.html`
|
|
3. Selecionar "Open with Live Server"
|
|
4. Abre automaticamente no navegador
|
|
|
|
---
|
|
|
|
## 🎯 Opção 6: Vercel Dev (Para testar deploy)
|
|
|
|
```bash
|
|
npm install -g vercel
|
|
vercel dev
|
|
```
|
|
|
|
Acessa automaticamente no navegador
|
|
|
|
---
|
|
|
|
## ✅ Verificar se Funcionou
|
|
|
|
Após iniciar o servidor:
|
|
|
|
1. **Abra**: http://localhost:8000
|
|
2. **Vá para**: MATERIAIS → Catálogo de Perfis → Cantoneiras
|
|
3. **Clique**: "🔄 Carregar Dados"
|
|
4. **Veja**: 39 cantoneiras devem aparecer
|
|
5. **Console**: Sem erros CORS
|
|
|
|
---
|
|
|
|
## 🐛 Troubleshooting
|
|
|
|
### Erro: "Porta 8000 já está em uso"
|
|
|
|
**Solução 1**: Usar outra porta
|
|
```bash
|
|
python -m http.server 8001
|
|
```
|
|
|
|
**Solução 2**: Matar processo na porta 8000
|
|
```bash
|
|
# Windows
|
|
netstat -ano | findstr :8000
|
|
taskkill /PID <PID> /F
|
|
|
|
# Linux/Mac
|
|
lsof -ti:8000 | xargs kill -9
|
|
```
|
|
|
|
### Erro: "Python não encontrado"
|
|
|
|
**Solução**: Instalar Python
|
|
- Windows: https://www.python.org/downloads/
|
|
- Linux: `sudo apt install python3`
|
|
- Mac: `brew install python3`
|
|
|
|
### Erro: "Comando não encontrado"
|
|
|
|
**Solução**: Verificar se Python está no PATH
|
|
```bash
|
|
# Verificar instalação
|
|
python --version
|
|
# ou
|
|
python3 --version
|
|
```
|
|
|
|
---
|
|
|
|
## 📊 Comparação de Servidores
|
|
|
|
| Servidor | Velocidade | Facilidade | Recomendado |
|
|
|----------|------------|------------|-------------|
|
|
| Python | ⭐⭐⭐⭐ | ⭐⭐⭐⭐⭐ | ✅ SIM |
|
|
| Node.js | ⭐⭐⭐⭐⭐ | ⭐⭐⭐⭐ | ✅ SIM |
|
|
| PHP | ⭐⭐⭐ | ⭐⭐⭐ | ⚠️ OK |
|
|
| Live Server | ⭐⭐⭐⭐⭐ | ⭐⭐⭐⭐⭐ | ✅ SIM |
|
|
| Vercel Dev | ⭐⭐⭐⭐⭐ | ⭐⭐⭐ | ✅ SIM |
|
|
|
|
---
|
|
|
|
## 🎯 Recomendação Final
|
|
|
|
### Para Desenvolvimento:
|
|
**Use `server.py` ou Live Server (VS Code)**
|
|
|
|
### Para Testes de Deploy:
|
|
**Use `vercel dev` ou `netlify dev`**
|
|
|
|
### Para Produção:
|
|
**Faça deploy no Vercel ou Netlify**
|
|
|
|
---
|
|
|
|
## 🚀 Após Iniciar o Servidor
|
|
|
|
1. ✅ Acesse http://localhost:8000
|
|
2. ✅ Vá para Cantoneiras
|
|
3. ✅ Clique em "🔄 Carregar Dados"
|
|
4. ✅ Veja os 39 itens aparecerem
|
|
5. ✅ Sem erros CORS no console!
|
|
|
|
---
|
|
|
|
## 📝 Nota Importante
|
|
|
|
**NUNCA** abra `index.html` diretamente no navegador!
|
|
|
|
❌ **ERRADO**: `file:///I:/NOCODE/STEELCHK/index.html`
|
|
✅ **CORRETO**: `http://localhost:8000/index.html`
|
|
|
|
O erro CORS **SEMPRE** vai acontecer se você abrir diretamente.
|
|
|
|
---
|
|
|
|
**Inicie o servidor e teste novamente! 🚀**
|