Estoy tratando de implementar firebase en un sitio web de Kirby (un CMS que se ejecuta en PHP) para que los visitantes puedan marcar subpáginas para que aparezcan como enlaces en la página de destino.

Para hacer esto, construí un formulario donde un usuario agrega su nombre cuando está en la subpágina para resaltarlo. El formulario no se envía cuando se hace clic en el botón, sino que usa JS para agregar un documento a Firebase (donde se puede aprobar o eliminar).

Me gustaría evitar el abuso y estoy interesado en agregar Recaptcha como un paso cuando el visitante "envía" la página.

Una versión simplificada de mi código se ve así.

HTML:

 <form id="add-item" action="?" method="POST"> <label for="f-name">Submitted by:</label> <input type="text" id="f-name" name="f-name" placeholder="your name"> <button type="submit">Submit</button> </form>

JS:

 document.querySelector("#add").addEventListener("click", function(e){ const fName = document.querySelector('#f-name').value; tableRef.get().then(function(querySnapshot) { var uid = Date.now().toString(36) + Math.random().toString(36).substr(2); if(fName === true){ tableRef.doc('item-'+uid).set({ contributor: fName, }) } }); e.preventDefault(); return false; })

Encontré respuestas para habilitar Recaptcha con Firebase que usan alojamiento de Firebase, o como un método para iniciar sesión:

Usando recaptcha con Firebase

Cómo usarlo con Angular o React:

Google/Firebase reCaptcha no funciona con angular Firebase: Invisible reCaptcha no funciona en React JS

Me pregunto cómo se puede hacer esto usando solo HTML (sin marco de aplicación), o con PHP, y sin iniciar sesión.

Soy un desarrollador web muy aficionado, ¡así que realmente aprecio cualquier información sobre esto! Me disculpo de antemano si esta es una pregunta obvia. ¡Gracias!