-
Notifications
You must be signed in to change notification settings - Fork 53
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
1 parent
7d20ba1
commit ad07ef2
Showing
6 changed files
with
96 additions
and
121 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,79 +1,101 @@ | ||
![](https://cdn.jsdelivr.net/gh/yoobool/[email protected].5/src/flask_state/static/flask_state.png) | ||
![Project Logo](https://cdn.jsdelivr.net/gh/yoobool/[email protected].6/src/flask_state/static/flask_state.png) | ||
|
||
|
||
[![](https://img.shields.io/badge/Contributions-Welcome-0059b3)](https://github.com/yoobool/flask-state/tree/master/.github/ISSUE_TEMPLATE) | ||
[![](https://img.shields.io/badge/Chat-Gitter-ff69b4.svg?label=Chat&logo=gitter)](https://gitter.im/flaskstate/community) | ||
[![](https://img.shields.io/npm/v/flask-state)](https://www.npmjs.com/package/flask-state) | ||
[![](https://img.shields.io/badge/license-BSD-green)](https://github.com/yoobool/flask-state/blob/master/LICENSE) | ||
[![](https://img.shields.io/badge/python-3.5%20%7C%203.6%20%7C%203.7%20%7C%203.8%20%7C%203.9-blue)](https://pypi.org/project/Flask-State/) | ||
[![Contributor Badge](https://img.shields.io/badge/Contributions-Welcome-0059b3)](https://github.com/yoobool/flask-state/tree/master/.github/ISSUE_TEMPLATE) | ||
[![Gitter Badge](https://img.shields.io/badge/Chat-Gitter-ff69b4.svg?label=Chat&logo=gitter)](https://gitter.im/flaskstate/community) | ||
[![NPM Badge](https://img.shields.io/npm/v/flask-state)](https://www.npmjs.com/package/flask-state) | ||
[![License Badge](https://img.shields.io/badge/license-BSD-green)](https://github.com/yoobool/flask-state/blob/master/LICENSE) | ||
[![Python Badge](https://img.shields.io/badge/python-3.5%20%7C%203.6%20%7C%203.7%20%7C%203.8%20%7C%203.9-blue)](https://pypi.org/project/Flask-State/) | ||
|
||
# Flask-State | ||
|
||
Flask-State is a lightweight chart plugin to show machine state. | ||
Flask-State is a lightweight chart plugin for displaying machine state data in your web application. | ||
|
||
* **Monitored Metric:** CPU, memory, disk usage, LoadAVG and boot time. | ||
* **Extensible:** Offers rich customization options, including redis monitoring, user authentication, | ||
custom logging, i18n and etc. | ||
* **Stable:** Solves multiprocessing concurrency problems (if you use [gunicorn](https://gunicorn.org/)) | ||
built on top of lightweight dependencies. | ||
|
||
* **Monitoring indicators:** CPU, Memory, Disk usage, LoadAVG, Boot time. | ||
* **Extensible:** It has rich options for extended functions, including redis monitoring, user authentication, custom logging, i18n and etc. | ||
* **Stable:** Lightweight dependencies, meanwhile solving multi-progress concurrency problems (if you use [gunicorn](https://gunicorn.org/)). | ||
This project is in active development and thoroughly tested to ensure that Flask-State | ||
stays up-to-date with its project roadmap. | ||
|
||
Flask-State is an active project, well-tested and complete update roadmap. | ||
![Screenshot](https://cdn.jsdelivr.net/gh/yoobool/[email protected]/examples/static/flask_state.png) | ||
|
||
### | ||
## Documentation | ||
|
||
![](https://cdn.jsdelivr.net/gh/yoobool/[email protected]/examples/static/flask_state.png) | ||
Check out the [live demo](https://flask-state.herokuapp.com/), or head over to the | ||
[tutorial](https://github.com/yoobool/flask-state/wiki/Tutorials) for more instructions. | ||
|
||
## Installation | ||
Install and update using [pip](https://pip.pypa.io/en/stable/quickstart/): | ||
``` | ||
$ pip install Flask-State | ||
|
||
Get this plugin from [PyPI](https://pip.pypa.io/en/stable/quickstart/): | ||
|
||
```bash | ||
pip install Flask-State | ||
``` | ||
|
||
Display components can use ```<script>``` tag from a CDN, or as a flask-state package on npm. | ||
Alternatively, install Flask-State via NPM or include this script tag to the head | ||
section of your HTML document: | ||
|
||
```html | ||
<script src="https://cdn.jsdelivr.net/gh/yoobool/[email protected]/packages/umd/flask-state.min.js"></script> | ||
``` | ||
<script src="https://cdn.jsdelivr.net/gh/yoobool/[email protected]/packages/umd/flask-state.min.js"></script> | ||
``` | ||
|
||
```bash | ||
npm install flask-state --save | ||
``` | ||
|
||
|
||
## Documentation | ||
To check out [live example](https://flask-state.herokuapp.com/), and visit [tutorials doc](https://github.com/yoobool/flask-state/wiki/Tutorials). | ||
|
||
|
||
## Usage | ||
|
||
### Firstly:Bind database address. | ||
### 1. Bind Database Address | ||
|
||
```python | ||
from flask_state import DEFAULT_BIND_SQLITE | ||
app.config['SQLALCHEMY_BINDS'] = {DEFAULT_BIND_SQLITE: 'sqlite:///path'} | ||
``` | ||
|
||
### Secondly:Call the init_app method of the flask-state to initialize the configuration. | ||
### 2. Configure Flask-State | ||
|
||
```python | ||
import flask_state | ||
flask_state.init_app(app) | ||
``` | ||
|
||
### Thirdly:Import the view file. | ||
### 3. Include Imports to Views | ||
|
||
```javascript | ||
// npm | ||
// Need to introduce Echarts module | ||
// requires echarts module | ||
import 'echarts'; | ||
import 'flask-state/flask-state.min.css'; | ||
import {init} from 'flask-state'; | ||
// Create a DOM node with ID 'test'. After init() binds the node, click to open the listening window | ||
// Create a DOM node with ID 'test'. After init() binds the node, | ||
// click to open the listening window | ||
init({dom:document.getElementById('test')}); | ||
``` | ||
|
||
**Learn more about advanced configurations by reading** [documentation](https://github.com/yoobool/flask-state/wiki/Configuration). | ||
**Learn more about advanced configurations in the** | ||
[documentation](https://github.com/yoobool/flask-state/wiki/Configuration). | ||
|
||
## Contributing | ||
Welcome to [open an issue](https://github.com/yoobool/flask-state/issues/new)! | ||
[See the planning document](https://github.com/yoobool/flask-state/wiki/Tutorials#roadmap) for a roadmap and existing feature requests. | ||
|
||
Flask-State follows the [Contributor Covenant](https://www.contributor-covenant.org/version/1/3/0/code-of-conduct/) Code of Conduct. | ||
* Need **help** or have a **general question**? [Post on Reddit Flask State](https://www.reddit.com/r/FlaskState/) | ||
* Found a **bug** or have a **feature request**? [Open an issue](https://github.com/yoobool/flask-state/issues/new). | ||
* Want to **contribute**? [Submit a pull request](https://github.com/yoobool/flask-state/pulls). | ||
|
||
Flask-State follows the [Contributor Covenant](https://www.contributor-covenant.org/version/1/3/0/code-of-conduct/) | ||
Code of Conduct. | ||
|
||
## Alternatives | ||
Looking for something else? Try another monitor project: | ||
|
||
* [Flask-MonitoringDashboard](https://github.com/flask-dashboard/Flask-MonitoringDashboard) | ||
|
||
## Community Channel | ||
We're on [Gitter](https://gitter.im/flaskstate/community) ! Please join us. | ||
|
||
We're on [Gitter](https://gitter.im/flaskstate/community)! Join the conversation | ||
for more questions and inquiries about this project. | ||
|
||
## License | ||
Flask-State is available under the BSD-3-Clause License. | ||
|
||
Flask-State is available under the BSD-3-Clause License. |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1 +1 @@ | ||
__version__ = "1.0.5" | ||
__version__ = "1.0.6" |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,16 +1,16 @@ | ||
[English](https://github.com/yoobool/flask-state/blog/master/master/README.md) | 简体中文 | ||
|
||
![](https://cdn.jsdelivr.net/gh/yoobool/[email protected].5/src/flask_state/static/flask_state.png) | ||
![Project Logo](https://cdn.jsdelivr.net/gh/yoobool/[email protected].6/src/flask_state/static/flask_state.png) | ||
|
||
[![](https://img.shields.io/badge/Contributions-Welcome-0059b3)](https://github.com/yoobool/flask-state/tree/master/.github/ISSUE_TEMPLATE) | ||
[![](https://img.shields.io/badge/Chat-Gitter-ff69b4.svg?label=Chat&logo=gitter)](https://gitter.im/flaskstate/community) | ||
[![](https://img.shields.io/npm/v/flask-state)](https://www.npmjs.com/package/flask-state) | ||
[![](https://img.shields.io/badge/license-BSD-green)](https://github.com/yoobool/flask-state/blob/master/LICENSE) | ||
[![](https://img.shields.io/badge/python-3.5%20%7C%203.6%20%7C%203.7%20%7C%203.8%20%7C%203.9-blue)](https://pypi.org/project/Flask-State/) | ||
[![Contributor Badge](https://img.shields.io/badge/Contributions-Welcome-0059b3)](https://github.com/yoobool/flask-state/tree/master/.github/ISSUE_TEMPLATE) | ||
[![Gitter Badge](https://img.shields.io/badge/Chat-Gitter-ff69b4.svg?label=Chat&logo=gitter)](https://gitter.im/flaskstate/community) | ||
[![NPM Badge](https://img.shields.io/npm/v/flask-state)](https://www.npmjs.com/package/flask-state) | ||
[![License Badge](https://img.shields.io/badge/license-BSD-green)](https://github.com/yoobool/flask-state/blob/master/LICENSE) | ||
[![Python Badge](https://img.shields.io/badge/python-3.5%20%7C%203.6%20%7C%203.7%20%7C%203.8%20%7C%203.9-blue)](https://pypi.org/project/Flask-State/) | ||
|
||
# Flask-State | ||
|
||
Flask-State是一款轻便的、图表化插件。 | ||
Flask-State是一款在您浏览器上使用的轻便、图表化插件。 | ||
|
||
* **监控状态**:CPU,内存,磁盘,LoadAvg,启动时长。 | ||
* **可扩展**:除记录本机状态外,还包括丰富的扩展功能选择。其中有Redis监控、用户验证、自定义logging和i18n等。 | ||
|
@@ -20,114 +20,67 @@ Flask-State是一个活跃的项目,经过了充分的测试以及有一系列 | |
|
||
### | ||
|
||
![](https://cdn.jsdelivr.net/gh/yoobool/[email protected].5/examples/static/flask_state.png) | ||
![Screenshot](https://cdn.jsdelivr.net/gh/yoobool/[email protected].6/examples/static/flask_state.png) | ||
|
||
## Documentation | ||
|
||
## Installation | ||
安装和更新通过使用 [pip](https://pip.pypa.io/en/stable/quickstart/) | ||
``` | ||
$ pip install Flask-State | ||
``` | ||
在这里 [live demo](https://flask-state.herokuapp.com/) 可以了解到使用样例, 或者你可以移动到 | ||
[tutorial](https://github.com/yoobool/flask-state/wiki/Tutorials) 获取更多信息. | ||
|
||
载入显示组件方式可通过标签引入或npm安装 | ||
```html | ||
<script src="https://cdn.jsdelivr.net/gh/yoobool/[email protected]/packages/umd/flask-state.min.js"></script> | ||
``` | ||
``` | ||
npm install flask-state --save | ||
``` | ||
## Installation | ||
|
||
从这里 [PyPI](https://pip.pypa.io/en/stable/quickstart/) 下载: | ||
|
||
## Usage | ||
|
||
Flask-State插件安装后,还需要引入JavaScript文件和CSS文件,然后初始化组件运行方式。在某些配置上,你也可以选择修改。 | ||
|
||
#### 第一步:定义一个Flask app | ||
```python | ||
from flask import Flask | ||
app = Flask(__name__) | ||
``` | ||
#### 1. 绑定数据库地址 | ||
|
||
#### 第二步:绑定数据库地址 | ||
```python | ||
from flask_state import DEFAULT_BIND_SQLITE | ||
app.config['SQLALCHEMY_BINDS'] = {DEFAULT_BIND_SQLITE: 'sqlite:///path'} | ||
``` | ||
|
||
#### 第三步:调用Flask-State插件的init_app方法初始化相关配置,它将为你添加路由用于访问数据库获取本机状态 | ||
#### 2. 配置 Flask-State | ||
|
||
```python | ||
import flask_state | ||
flask_state.init_app(app) | ||
``` | ||
|
||
#### 第四步:选择合适的导入方式导入视图文件 | ||
```html | ||
<!--cdn方式导入--> | ||
<link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/yoobool/[email protected]/packages/umd/flask-state.min.css"> | ||
<script src="https://cdn.jsdelivr.net/gh/yoobool/[email protected]/packages/umd/flask-state.min.js"></script> | ||
<script type="text/javascript"> | ||
// 创建一个id为'test'的dom节点,init()绑定节点后点击即可打开监听窗口 | ||
flaskState.init({dom:document.getElementById('test')}); | ||
</script> | ||
``` | ||
#### 3. 引入相关模块用于展示 | ||
|
||
```javascript | ||
// npm方式导入 | ||
import 'flask-state/flask-state.css'; | ||
// requires echarts module | ||
import 'echarts'; | ||
import 'flask-state/flask-state.min.css'; | ||
import {init} from 'flask-state'; | ||
// 创建一个id为'test'的dom节点,init()绑定节点后点击即可打开监听窗口 | ||
// Create a DOM node with ID 'test'. After init() binds the node, | ||
// click to open the listening window | ||
init({dom:document.getElementById('test')}); | ||
``` | ||
|
||
#### 额外:你也可以自定义某些配置文件(可选择) | ||
如果你还需要监控REDIS状态,你可以在Flask app上配置你的redis地址参数 | ||
```python | ||
app.config['REDIS_CONF'] = {'REDIS_STATE': True, 'REDIS_HOST': '192.168.1.3', 'REDIS_PORT':16380, 'REDIS_PASSWORD': 'psw'} | ||
``` | ||
**了解更多可配置选项** | ||
[教程](https://github.com/yoobool/flask-state/wiki/Configuration). | ||
|
||
修改保存监控记录的时间间隔 | ||
```python | ||
# 最少间隔为60秒, 当不设置时间时默认间隔为60秒 | ||
import flask_state | ||
SECS = 60 | ||
flask_state.init_app(app, SECS) | ||
``` | ||
## Contributing | ||
[RoadMap](https://github.com/yoobool/flask-state/wiki/Tutorials#roadmap) 中有我们下一步的开发计划. | ||
|
||
自定义logger对象 | ||
```python | ||
import flask_state | ||
import logging | ||
custom_logger = logging.getLogger(__name__) | ||
flask_state.init_app(app, interval=60, log_instance=custom_logger) | ||
``` | ||
* [需要其它帮助?](https://www.reddit.com/r/FlaskState/) | ||
* [提出新的问题.](https://github.com/yoobool/flask-state/issues/new) | ||
* [查看其他PR](https://github.com/yoobool/flask-state/pulls). | ||
|
||
自定义绑定触发窗口的对象 | ||
```javascript | ||
/* 初始化插件不传入对象时,插件会自动创建一个右侧悬浮球 */ | ||
/* 注意:所有页面共享一个插件实例,多次调用init()方法只会为新的对象绑定触发插件事件 */ | ||
flaskState.init(); | ||
``` | ||
Flask-State遵循[《贡献者公约》](https://www.contributor-covenant.org/version/1/3/0/code-of-conduct/) 行为准则。 | ||
|
||
选择插件显示的语言 | ||
```html | ||
<!--注意:通过标签导入语言文件必须在导入插件之后--> | ||
<script src="https://cdn.jsdelivr.net/gh/yoobool/[email protected]/packages/umd/flask-state.min.js"></script> | ||
<script src="https://cdn.jsdelivr.net/gh/yoobool/[email protected]/packages/umd/zh.js"></script> | ||
<script type="text/javascript"> | ||
flaskState.init({lang:flaskState.zh}); | ||
</script> | ||
``` | ||
```javascript | ||
import {init} from 'flask-state'; | ||
import {zh} from 'flask-state/i18n.js'; | ||
init({lang:zh}); | ||
``` | ||
## Alternatives | ||
其他类似的监控开源项目: | ||
|
||
* [Flask-MonitoringDashboard](https://github.com/flask-dashboard/Flask-MonitoringDashboard) | ||
|
||
## Contributing | ||
我们非常欢迎[提出问题](https://github.com/yoobool/flask-state/issues/new)! | ||
|
||
Flask-State遵循[《贡献者公约》](https://www.contributor-covenant.org/version/1/3/0/code-of-conduct/) 行为准则。 | ||
|
||
## Community Channel | ||
我们在 [Gitter](https://gitter.im/flaskstate/community) 等你! 请加入我们。 | ||
|
||
|