7

我有一个 flexdashboard，它没有托管在服务器上，我将它用作本地 html 文件。

但是，我需要对 HTML 的内容进行密码保护。我知道我可以使用 win-zip，但我想知道是否可以将简单的登录表单与全局用户名和密码集成在一起。

我的尝试：

    ---
title: "Dashboard"
output: 
  flexdashboard::flex_dashboard:
    vertical_layout: scroll
    logo: logo.jpg
shiny: include
---

```{r}
branch <- "test"
num_entries <- 3
```

<style>                     
.navbar {
  background-color:red;
  border-color:black;
}

.navbar-inverse .navbar-nav>.active>a, .navbar-inverse .navbar-nav>.active>a:hover, .navbar-inverse .navbar-nav>.active>a:focus {
color: black;
background-color: #feb0b0;
}

.navbar-inverse .navbar-nav > li > a:hover, .navbar-inverse .navbar-nav > li > a:focus {
background-color: #feb0b0
}

</style>           


<script type = "text/javascript">

// Note: Like all Javascript password scripts, this is hopelessly insecure as the user can see 
//the valid usernames/passwords and the redirect url simply with View Source.  
// And the user can obtain another three tries simply by refreshing the page.  
//So do not use for anything serious!

var count = 2;
function validate() {
var un = document.myform.username.value;
var pw = document.myform.pword.value;
var valid = false;

var unArray = ["Philip", "George", "Sarah", "Michael"];  // as many as you like - no comma after final entry
var pwArray = ["Password1", "Password2", "Password3", "Password4"];  // the corresponding passwords;

for (var i=0; i <unArray.length; i++) {
if ((un == unArray[i]) && (pw == pwArray[i])) {
valid = true;
break;
}
}

if (valid) {
alert ("Login was successful");
window.location = "http://www.google.com";
return false;
}

var t = " tries";
if (count == 1) {t = " try"}

if (count >= 1) {
alert ("Invalid username and/or password.  You have " + count + t + " left.");
document.myform.username.value = "";
document.myform.pword.value = "";
setTimeout("document.myform.username.focus()", 25);
setTimeout("document.myform.username.select()", 25);
count --;
}

else {
alert ("Still incorrect! You have no more tries left!");
document.myform.username.value = "No more tries allowed!";
document.myform.pword.value = "";
document.myform.username.disabled = true;
document.myform.pword.disabled = true;
return false;
}

}

</script>

<form name = "myform">
<p>ENTER USER NAME <input type="text" name="username"> ENTER PASSWORD <input type="password" name="pword">
<input type="button" value="Check In" name="Submit" onclick= "validate()">
</p>

</form>





```{r setup, include=FALSE}
library(flexdashboard)
```

Overview {data-orientation=columns}
=====================================

但是，这不起作用，因为用户名和密码与仪表板内容一起出现，而不是通过充当登录页面来隐藏它。

有什么想法可以解决这个问题吗？

4

0 回答 0