datastorm-open / shinymanager

Simple and secure authentification mechanism for single shiny applications.
https://datastorm-open.github.io/shinymanager/
386 stars 79 forks source link

Incorrect password when quickly pressing enter #195

Open kamilzyla opened 1 month ago

kamilzyla commented 1 month ago

If I type the username and password quickly and immediately press ENTER I get the "Username or password are incorrect" error. I am logged in correctly if I press ENTER again or if I make a short pause after typing the password.

I have used this trivial app for testing:

library(shiny)
library(shinymanager)

credentials <- data.frame(
  user = c("admin"),
  password = c("admin")
)

shinyApp(
  ui = secure_app("Hello!"),
  server = function(input, output) {
    secure_server(check_credentials = check_credentials(credentials))
  }
)
r-a-qureshi commented 4 weeks ago

I was struggling with this same issue and I came up with a workaround to solve this problem. Basically, I'm using javascript to capture the "enter" keypress, block the default event (the action that is normally supposed to happen on keypress) and then use javascript to add a time delay and then activate the log in button. Here's an example script:

library(shiny)
library(shinymanager)
library(shinyjs)

js <- "
pressbtn = function(){

    // click the log in button
    document.getElementById('auth-go_auth').click();
};
window.onload = function() {

// password input field
const field = document.getElementById('auth-user_pwd');

// add a function that preempts the enter key press
field.addEventListener('keydown',  
function(e) {

    if (e.keyCode == 13) {
    // prevent sending the key event
    e.preventDefault();

    // delay activating the login button for 400 ms. adjust time as needed
    setTimeout(pressbtn,400);
    };

});
}
"
credentials <- data.frame('user'=c('test'),password=c('pass'))

# pass script tag to head_auth variable which will insert our script into the header
ui <- secure_app(fluidPage('Hello World!'),head_auth = tags$script(js))

server <- function(input,output,session) {
    res_auth <- secure_server(
        check_credentials = check_credentials(credentials)
    )
}

shinyApp(ui=ui,server=server)

Here's the javascript code with syntax highlighting:

pressbtn = function(){

    // click the log in button
    document.getElementById('auth-go_auth').click();
};
window.onload = function() {

// password input field
const field = document.getElementById('auth-user_pwd');

// add a function that preempts the enter key press
field.addEventListener('keydown',  
function(e) {

    if (e.keyCode == 13) {

    // prevent sending the key event
    e.preventDefault();

    // delay activating the login button for 400 ms. adjust time as needed
    setTimeout(pressbtn,400);
    };

});
}
munoztd0 commented 2 days ago

thank you !!