banco_comunal
Gamma
Verificación en dos pasos activada
Google Sheets es una excelente alternativa como base de datos para proyectos pequeños y medianos, especialmente cuando quieres evitar un backend o un servidor SQL.
Muchos proyectos modernos —incluyendo plataformas de consulta ciudadana similares a RNI Perú (Registro nacional de infieles en Peru)— trabajan exactamente así: leen datos de un Google Sheets público y lo convierten en una API JSON.
En este artículo aprenderás a usar tu Google Sheets como BD usando la Google Visualization API, que NO necesita:
❌ Google API Key
❌ Backend
✔️ Solo JavaScript y un documento público
Ejemplo de uso Google Sheets como base de datos: https://rastrearnumero.com/rni-el-registro-nacional-de-infieles-que-esta-sacudiendo-al-peru/
Tomamos tu URL real:
Google siempre asigna “Hoja1” en español a la primera pestaña.
La URL oficial (y sin dependencias) para obtener los datos es:
Esta URL devuelve JSON “envolvido” en una función, por lo que hay que limpiarlo desde JavaScript.
Tus columnas reales:
Archivo: index.html
Archivo: app.js
Usando este método puedes desarrollar:
Sin backend, sin hosting, sin APIs externas.
Muchos proyectos modernos —incluyendo plataformas de consulta ciudadana similares a RNI Perú (Registro nacional de infieles en Peru)— trabajan exactamente así: leen datos de un Google Sheets público y lo convierten en una API JSON.
En este artículo aprenderás a usar tu Google Sheets como BD usando la Google Visualization API, que NO necesita:
❌ Google API Key
❌ Backend
✔️ Solo JavaScript y un documento público
Ejemplo de uso Google Sheets como base de datos: https://rastrearnumero.com/rni-el-registro-nacional-de-infieles-que-esta-sacudiendo-al-peru/
1️⃣ Tu Google Sheets como Base de Datos
Tomamos tu URL real:
Insertar CODE, HTML o PHP:
https://docs.google.com/spreadsheets/d/116mlXNpllLviyGcliHayv9tAZtbh71r3/edit?gid=1578621432Google siempre asigna “Hoja1” en español a la primera pestaña.
2️⃣ Convertir Google Sheets → JSON (sin OpenSheet)
La URL oficial (y sin dependencias) para obtener los datos es:
Insertar CODE, HTML o PHP:
https://docs.google.com/spreadsheets/d/116mlXNpllLviyGcliHayv9tAZtbh71r3/gviz/tq?tqx=out:json&sheet=Hoja1Esta URL devuelve JSON “envolvido” en una función, por lo que hay que limpiarlo desde JavaScript.
Tus columnas reales:
- PLIEGO_NOMBRE
- ID_PERS
- EXPEDIENTE_PJ
- TIPO_DEMANDANTE
- Suma de SALDO
3️⃣ Interfaz HTML conectada a tu Google Sheets
Archivo: index.html
Insertar CODE, HTML o PHP:
<!DOCTYPE html>
<html lang="es">
<head>
<meta charset="UTF-8">
<title>Consulta desde Google Sheets</title>
<style>
body { font-family: Arial; padding: 20px; }
input { padding: 10px; width: 350px; }
.card {
margin-top: 12px;
padding: 15px;
border: 1px solid #ccc;
border-radius: 6px;
}
</style>
</head>
<body>
<h2>Buscador conectado a Google Sheets (sin OpenSheet ni API Keys)</h2>
<input id="busqueda" placeholder="Buscar por pliego, ID o expediente">
<div id="resultados"></div>
<script src="app.js"></script>
</body>
</html>4️⃣ Código JavaScript consumiendo directamente Visualization API
Archivo: app.js
Insertar CODE, HTML o PHP:
const URL = "https://docs.google.com/spreadsheets/d/116mlXNpllLviyGcliHayv9tAZtbh71r3/gviz/tq?tqx=out:json&sheet=Hoja1";
let datos = [];
const input = document.getElementById("busqueda");
const resultados = document.getElementById("resultados");
// Convertir el formato GViz de Google → JSON normal
function convertirGViz(texto) {
const jsonString = texto
.replace("/*O_o*/", "")
.replace("google.visualization.Query.setResponse(", "")
.replace(");", "");
const json = JSON.parse(jsonString);
const columnas = json.table.cols.map(c => c.label);
const filas = json.table.rows;
const objetos = filas.map(fila => {
const obj = {};
fila.c.forEach((celda, i) => {
obj[columnas[i]] = celda ? celda.v : "";
});
return obj;
});
return objetos;
}
// 1. Cargar los datos desde Google Sheets
fetch(URL)
.then(r => r.text())
.then(t => {
datos = convertirGViz(t);
console.log("Datos cargados:", datos);
});
// 2. Buscador en vivo
input.addEventListener("input", () => {
const texto = input.value.toLowerCase();
resultados.innerHTML = "";
if (!texto.trim()) return;
const filtrados = datos.filter(item =>
(item["PLIEGO_NOMBRE"] || "").toLowerCase().includes(texto) ||
(item["ID_PERS"] || "").toLowerCase().includes(texto) ||
(item["EXPEDIENTE_PJ"] || "").toLowerCase().includes(texto) ||
(item["TIPO_DEMANDANTE"] || "").toLowerCase().includes(texto)
);
filtrados.forEach(item => {
resultados.innerHTML += `
<div class="card">
<b>Pliego:</b> ${item["PLIEGO_NOMBRE"]}<br>
<b>ID Persona:</b> ${item["ID_PERS"]}<br>
<b>Expediente:</b> ${item["EXPEDIENTE_PJ"]}<br>
<b>Tipo Demandante:</b> ${item["TIPO_DEMANDANTE"]}<br>
<b>Saldo:</b> ${item["Suma de SALDO"]}<br>
</div>
`;
});
if (filtrados.length === 0) resultados.innerHTML = "Sin coincidencias.";
});5️⃣ ¿Qué puedes construir con esto?
Usando este método puedes desarrollar:
- Buscadores ciudadanos
- Directorios abiertos
- Bases de datos consultables desde navegador
- Dashboards en vivo
- Consultas tipo RNI Perú con filtro por nombre / ID
- Sistemas que se actualizan automáticamente al modificar Google Sheets
Sin backend, sin hosting, sin APIs externas.
