Estoy escribiendo una aplicación Express que crea y exporta un documento basado en las selecciones que hace un usuario en dos menús desplegables. Los valores desplegables se pasan como parámetros de ruta después de presionar un botón, luego se llaman las funciones necesarias dentro del método de ruta para crear el documento y enviarlo de vuelta al usuario.
¿Cómo puedo evitar que un usuario (si es posible) llame/acceda a esta ruta ingresando manualmente los parámetros de la ruta en la barra de URL? Solo deberían poder acceder a la ruta presionando el botón.
A continuación se muestra un código general para la funcionalidad de mi aplicación...
Código para capturar/enviar valores después de hacer clic en el botón:
export.onclick = function() { let index1 = dropdown1.value; let index2 = dropdown2.value; fetch('/' + index1 + '/' + index2) // Convert response to blob object for download }Código de ruta:
app.get('/:index1/:index2', function (req, res) { // Call functions to create document // Return document back to user });Los menús desplegables se completan dinámicamente con datos obtenidos de la respuesta de una API. El valor de cada opción desplegable representa el índice de esa opción. El usuario que puede ingresar índices aleatorios permite una entrada no válida; sin embargo, no necesariamente hay límites para las entradas, ya que los menús desplegables se completan dinámicamente en función de varias restricciones de usuario. Por esta razón, sería ideal evitar que el usuario pueda acceder a la ruta ingresando parámetros en mi mente.
No puede eliminar la capacidad de ingresar una URL en la barra de direcciones de los navegadores, pero puede decidir simplemente no manejar la solicitud GET resultante en su backend. En su lugar, puede escuchar una solicitud POST .
app.post('/:index1/:index2', function (req, res) { // Call functions to create document // Return document back to user }); export.onclick = async function() { let index1 = dropdown1.value; let index2 = dropdown2.value; const response = await fetch(`/${index1}/${index2}`, { method : 'POST' }); } Esto no es de ninguna manera una función de seguridad, el usuario aún podría crear una solicitud POST manualmente si sabe lo que está haciendo y/o si usa un cliente de solicitud como POSTMAN o similar.
Me parece que esto podría ser un problema XY. ¿Por qué quiere evitar que el usuario escriba manualmente una URL en su barra de direcciones? ¿Podría dañar su servidor/negocio de alguna manera? En caso afirmativo, entonces tiene un problema diferente y más grande a la mano.
agregue un token para proteger su solicitud de obtención en el lado del servidor
como esto
app.get('/:index1/:index2', function (req, res) { if (req.query.token !== 'foo') { // invalid the request } // Call functions to create document // Return document back to user });para enviar la solicitud a la url necesitarás el token
/:index1/:index2?token=fooo simplemente agregue el token en el encabezado de la solicitud
Entonces la siguiente pregunta podría ser
¿Necesito un token dinámico para asegurar la API /:index1/:index2 ?
si no, entonces el usuario aún puede escribir la URL con este token fijo
en caso afirmativo, necesitará otra API para generar el token en la "página del botón"
fetch('/get_new_token') // get the token via this API const token = ... export.onclick = function() { let index1 = dropdown1.value; let index2 = dropdown2.value; fetch('/' + index1 + '/' + index2 + '?token=' + token) // Convert response to blob object for download }puede usar una clave para encriptar su token
o agregue una firma en su token para verificar que el token no se modificó
y si lo desea, su token caducará después de una marca de tiempo
agregue una información de marca de tiempo en el token
luego verifique la marca de tiempo en el lado del servicio