| <!DOCTYPE html> |
| <html lang="pt-BR"> |
| <head> |
| <meta charset="UTF-8"> |
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> |
| <title>Meu SearxNG</title> |
| <style> |
| body { font-family: Arial, sans-serif; max-width: 600px; margin: 40px auto; padding: 20px; text-align: center; background: #f9f9f9; color: #333; } |
| input { width: 80%; padding: 12px; font-size: 16px; border: 1px solid #ccc; border-radius: 6px; margin-bottom: 10px; } |
| button { padding: 12px 20px; font-size: 16px; background: #007bff; color: white; border: none; border-radius: 6px; cursor: pointer; } |
| button:hover { background: #0056b3; } |
| #results { margin-top: 20px; text-align: left; background: white; padding: 20px; border-radius: 6px; box-shadow: 0 2px 4px rgba(0,0,0,0.1); } |
| .result-item { margin-bottom: 15px; } |
| .result-item a { color: #007bff; text-decoration: none; font-weight: bold; } |
| .result-item a:hover { text-decoration: underline; } |
| .result-item p { margin: 5px 0 0 0; color: #555; font-size: 14px; } |
| </style> |
| </head> |
| <body> |
|
|
| <h1>🔍 Meu SearxNG</h1> |
| <p>Busca rápida hospedada na Hugging Face (Static)</p> |
| |
| <input type="text" id="query" placeholder="O que você quer buscar?" onkeypress="if(event.key === 'Enter') realizarBusca()"> |
| <br> |
| <button onclick="realizarBusca()">Pesquisar</button> |
|
|
| <div id="results">Digite um termo acima para começar...</div> |
|
|
| <script> |
| async function realizarBusca() { |
| const termo = document.getElementById('query').value.trim(); |
| const resultsDiv = document.getElementById('results'); |
| |
| if (!termo) { |
| resultsDiv.innerHTML = "Por favor, digite algo para buscar."; |
| return; |
| } |
| |
| resultsDiv.innerHTML = "Buscando..."; |
| |
| try { |
| |
| const response = await fetch(`https://corsproxy.io/?` + encodeURIComponent(`https://searx.be/search?q=${termo}&format=json`)); |
| const data = await response.json(); |
| |
| if (!data.results || data.results.length === 0) { |
| resultsDiv.innerHTML = "Nenhum resultado encontrado."; |
| return; |
| } |
| |
| let html = ""; |
| data.results.forEach(r => { |
| html += ` |
| <div class="result-item"> |
| <a href="${r.url}" target="_blank">${r.title || 'Sem título'}</a> |
| <p>${r.content || ''}</p> |
| </div> |
| `; |
| }); |
| |
| resultsDiv.innerHTML = html; |
| } catch (error) { |
| resultsDiv.innerHTML = "Erro ao realizar a busca. Tente novamente."; |
| console.error(error); |
| } |
| } |
| </script> |
|
|
| </body> |
| </html> |
|
|