Bootstrap Session Timeout 项目教程
1. 项目的目录结构及介绍
bootstrap-session-timeout/
├── dist/
│ └── 包含编译后的文件
├── examples/
│ └── 示例代码
├── .gitignore
├── .jshintrc
├── Gruntfile.js
├── LICENSE.md
├── README.md
├── bower.json
├── index.html
├── package.json
- dist/: 包含编译后的文件,可以直接用于生产环境。
- examples/: 包含示例代码,展示了如何使用该插件。
- .gitignore: Git 忽略文件配置。
- .jshintrc: JSHint 配置文件。
- Gruntfile.js: Grunt 任务配置文件。
- LICENSE.md: 许可证文件。
- README.md: 项目说明文档。
- bower.json: Bower 包管理配置文件。
- index.html: 项目首页。
- package.json: npm 包管理配置文件。
2. 项目的启动文件介绍
项目的启动文件主要是 index.html
,它包含了插件的基本使用示例。以下是 index.html
的部分代码:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Bootstrap Session Timeout</title>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
</head>
<body>
<div class="container">
<h1>Bootstrap Session Timeout</h1>
<p>After a set amount of idle time, a Bootstrap warning dialog is shown to the user with the option to either log out or stay connected.</p>
</div>
<script src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<script src="dist/bootstrap-session-timeout.js"></script>
<script>
$.sessionTimeout({
warnAfter: 60000, // 1 minute
redirAfter: 120000, // 2 minutes
logoutUrl: 'login.html',
redirUrl: 'locked.html',
countdownMessage: 'Redirecting in {timer} seconds.'
});
</script>
</body>
</html>
3. 项目的配置文件介绍
项目的配置文件主要是 package.json
和 bower.json
。
package.json
{
"name": "bootstrap-session-timeout",
"version": "1.0.0",
"description": "Session timeout and keep-alive control with a nice Bootstrap warning dialog",
"main": "dist/bootstrap-session-timeout.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"repository": {
"type": "git",
"url": "git+https://github.com/orangehill/bootstrap-session-timeout.git"
},
"keywords": [
"bootstrap",
"session",
"timeout"
],
"author": "Max Fierke",
"license": "MIT",
"bugs": {
"url": "https://github.com/orangehill/bootstrap-session-timeout/issues"
},
"homepage": "https://github.com/orangehill/bootstrap-session-timeout#readme",
"devDependencies": {
"grunt": "^1.0.1",
"grunt-contrib-jshint": "^1.1.0",
"grunt-contrib-uglify": "^2.3.0"
}
}
bower.json
{
"name": "bootstrap-session-timeout",
"version": "1.0.0",
"description": "Session timeout and keep-alive control with a nice Bootstrap warning dialog",
"main": "dist/bootstrap-session-timeout.js",
"keywords": [
"bootstrap",