@qn-pandora/app-sdk
Advanced tools
[toc]
@qn-pandora/app-sdk提供了引用 Pandora 平台的基础能力的 Manager、工具包等。
对 Pandora 平台搜索相关 API 进行封装
使用方式
import { SearchManager } from '@qn-pandora/app-sdk'
const searchCondition = {
queryString: 'repo="testjwzfr"',
time: {
start: 0,
end: 1589770122581
}
}
const option = {
task: {
event: true,
summary: true,
timeline: true,
result: true
}
}
const searchManager = new SearchManager({
searchCondition,
option
})
searchManager.on('done', data => {
console.log('data', data)
})
searchManager.search()
import { SearchManager } from '@qn-pandora/app-sdk'
const searchCondition = {
queryString: 'repo="testjwzfr"',
time: {
start: 0,
end: 1589770122581
}
}
const option = {
task: {
event: true,
summary: true,
timeline: true,
result: true
}
}
const searchManager = new SearchManager({
option
})
searchManager.on('done', data => {
console.log('data', data)
})
searchManager.search(searchCondition)
import { SearchManager } from '@qn-pandora/app-sdk'
const searchCondition = {
queryString: 'repo="testjwzfr"',
time: {
start: 0,
end: 1589770122581
}
}
const option = {
task: {
event: true,
summary: true,
timeline: true,
result: true
}
}
const searchManager = new SearchManager({
option
})
const jobId = await searchManager.search(searchCondition)
searchManager.on('done', data => {
const event = searchMangeer.getEvent(jobId)
console.log('event', event)
})
参数介绍
searchCondition
option
方法
事件
可通过 on 函数注册监听事件回调函数
对 Pandora 平台登录相关 API 进行封装
使用方式
import { LoginManager, ELoginType } from '@qn-pandora/app-sdk'
const loginManager = new LoginManager(ELoginType.PANDORA)
loginManager.login({
username: 'admin',
password: 'admin'
})
import { LoginManager, ELoginType } from '@qn-pandora/app-sdk'
const loginManager = new LoginManager(ELoginType.SSO)
loginManager.login({
token:
'MjNGNDEweHdnQ2pOWVpuNFpINkkzUVJQZ0I0MnBab2RNTGt6UGcya0h0aUFpVVNGOjcxNzdmNjRhN2RmZDdjN2UxMGQ1MmRiNmQxYmZkNGU0NjJlNzU3NDdhNjU1NGMyNzJlMzMwODgyNzFiY2IzODMyZGJiZTA1YTM4OWI3NDIyOTgxODkwZGYzYjMxYWI2NTk2OTY0MmI1NDZjMjMxZDRiZjNlZGE3YWMyYjc4MzFj'
})
支持方法
方法返回都为 Promise
对 Pandora 平台报表管理相关 API 进行封装
使用方式
import { ReportManager } from '@qn-pandora/app-sdk'
const fetchAll = true // false by default
const pageSize = 20 // 10 by default
const reportManager = new ReportManager(fetchAll, pageSize)
const lists = await reportManager.listReports()
const reportId = '0'
const info = await reportManager.getReport(reportId)
const report = {
name: 'testReport',
time: {
global: false,
preset: 'AllTime'
},
spl: 'repo="tracing" | stats count() by host | where count > 10',
description: 'description'
}
const res = await reportManager.createReport(report)
const report = {
name: 'testReport',
time: {
global: false,
preset: 'AllTime'
},
spl: 'repo="tracing" | stats count() by host | where count > 10',
description: 'updated description'
}
const res = await reportManager.updateReport(report)
const reportId = '0'
const res = await reportManager.deleteReport(reportId)
参数介绍
创建 reportManager 时的参数
创建及更新 report 的参数
对 Pandora 平台数据集管理相关 API 进行封装
使用方式
import { DatasetManager } from '@qn-pandora/app-sdk'
const fetchAll = true // false by default
const pageSize = 20 // 10 by default
const datasetManager = new DatasetManager(fetchAll, pageSize)
const list = await datasetManager.listDatasets()
const datasetId = '0'
const info = await getDataset(datasetId)
const baseDataset = {
name: 'ds1',
description: 'description',
category: 'c1',
transforms: [{ type: 'fields', fields: ['field1'] }],
schemas: [{ name: 'name', type: 'long' }],
dataSource: {
query: 'query_string',
time: {
relative: 'relative',
preset: 'preset',
timeShift: 'timeShift',
global: true
}
}
}
const res = await datasetManager.createDataset(baseDataset)
const baseDataset = {
name: 'ds1',
description: 'description',
category: 'c1',
transforms: [{ type: 'fields', fields: ['field1'] }],
schemas: [{ name: 'name', type: 'long' }],
dataSource: {
query: 'query_string',
time: {
relative: 'relative',
preset: 'preset',
timeShift: 'timeShift',
global: true
}
}
}
const res = await datasetManager.updateDataset(baseDataset)
const datasetId = '0'
const res = await deleteDataset(datasetId)
const categories = ['c1', 'c2']
const res = await datasetManager.setCategories(categories)
const list = await datasetManager.listCategory()
const datasetId = '0'
const datasetSpl = await datasetManager.getDatasetSpl(datasetId)
const transforms = {
type: 'fields',
fields: ['f1', 'f2']
}
const transformSpl = await datasetManager.getTransformSpl(transforms)
参数介绍
创建 datasetManager 时的参数
baseDataset
对 Pandora 平台仓库管理相关 API 进行封装
使用方式
import { RepoManager } from '@qn-pandora/app-sdk'
const fetchAll = true // false by default
const pageSize = 20 // 10 by default
const repoManager = new RepoManager(fetchAll, pageSize)
const list = await repoManager.listRepos()
const repoName = 'repo'
const info = await repoManager.getRepo(repoName)
const repo = {
name: 'repo',
description: 'desciption',
retention: -1
}
const res = await repoManager.createRepo(repo)
const repo = {
name: 'repo',
description: 'updated desciption',
retention: -1
}
const res = await reportManager.updateReport(report)
const repoName = 'repo'
const res = await reportManager.deleteRepo(repoName)
参数介绍
创建 repoManager 时的参数
repo
对 Pandora 平台来源管理相关 API 进行封装
使用方式
import { SourceTypeManager } from '@qn-pandora/app-sdk'
const fetchAll = true // false by default
const pageSize = 20 // 10 by default
const sourceTypeManager = new SourceTypeManager(fetchAll, pageSize)
const list = await sourceTypeManager.listSourceType()
const sourceTypeName = 'sourceType'
const info = await sourceTypeManager.getSourceTypeByName(sourceTypeName)
const sourceType = {
name: 'sourceType',
description: 'desciption',
category: 'c1',
line: {
type: 'auto'
},
datetime: {
type: 'now'
}
advance: {
charset: 'utf-8',
fieldDiscovery: false
}
}
const res = await sourceTypeManager.createSourceType(sourceType)
const sourceTypeName = 'sourceType'
const res = await sourceTypeManager.deleteSourceType(sourceTypeName)
创建 sourceTypeManager 时的参数
sourceType
对 Pandora 平台应用权限管理相关 API 进行封装
使用方式
import { PermissionManager } from '@qn-pandora/app-sdk'
const appName = 'appName'
const permissionManager = new PermissionManager(appName)
const operations = await permissionManager.getFuncOperations('func1')
const rolePerms = await permissionManager.getKnowledgePerm('func1', '1')
const rolePerms = [
{
role: 'role0',
operation: 'list'
},
{
role: 'role1',
operation: 'edit'
}
]
const res = await permissionManager.updateKnowledgePerm('func1', '1', rolePerms)
const rolePerms = [
{
role: 'role0',
operation: 'list'
},
{
role: 'role1',
operation: 'edit'
}
]
const res = await permissionManager.bulkUpdateKnowledgePerm(
'func1',
['0', '1'],
rolePerms
)
bind 装饰器用于为装饰的函数绑定 this 指针
使用方式
在类中装饰类的方法：
import { utils } from '@qn-pandora/app-sdk'
const { bind } = utils
export class SomeClass extends UpperClass {
@bind
someFunction() {
this.setData(someData)
// setData挂载在UpperClass上，this绑定在当前class上
}
}
注意事项
bind 装饰过的函数在被重载时，不可在重载函数中调用父集的当前函数，会导致父集的当前函数 this 指针异常。
自定义 Pandora 应用平台视图页面的组件。开发自定义组件不受前端开发框架限制，可以是 react, vue, Angular, jquery 等任意框架开发。唯一的限制在于：最终开发的自定义组件的 js bundle 需要被打包成 umd 模块。
Pandora 平台的视图页面引用自定义组件示例如下：
<custom-component src="<js_bundle_name>.js" />
自定义 Pandora 应用平台的展示组件的基类，自定义的展示组件必须继承子该组件。
展示组件与输入组件的区别： 展示组件: 一般为接受属性，只做相应的展示，组件内部不做数据录入，即使做数据录入，也不会向组件外部传递。例如：Table, List, Tooltip, Avatar 等... 输入组件: 一般接受数据录入，且会把响应的信息传递到组件外部。例如：Input, Checkbox, DatePicker 等...
属性与方法说明
interface IComponentContext {
appName: string // app的名称
}
abstract class BaseComponent {
element: Element // 组件的挂载dom容器
get staticPath(): string // app的静态资源的相对路径
context: IComponentContext // app的上下文
initialize(): void // 初始化操作
resize(): void // 挂载dom容器大小变更时调用
/**
* 渲染组件的核心方法，自定义组件必须实现本方法，刻画了自定义组件的渲染逻辑
* @param params 自定义组件接受的额外参数，
* 例如：<custom-component src="<js_bundle_name>.js" width="100" height="50" />，
* 此时params的值为：{ width: "100", height: "50" }
*/
abstract render(params: any): void
dispose(): void // 销毁组件时调用，常用来释放资源
/**
* 构造函数
* @param element 组件的挂载dom容器
* @param context app的上下文
*/
constructor(element: Element, context: IComponentContext)
}
示例(React)
import React from 'react'
import ReactDOM from 'react-dom'
import { BaseComponent } from '@qn-pandora/app-sdk'
// 自定义React组件逻辑
import List from './List'
export default class extends BaseComponent {
// 实现render方法，将List组件挂载到this.element上去
render() {
ReactDOM.render(<List />, this.element)
}
}
自定义 Pandora 应用平台的输入组件的基类，自定义的输入组件必须继承子该组件。
BaseInput 是一种特殊的 BaseComponent，BaseInput 继承自 BaseComponent。
属性与方法说明
interface IBaseInputParams<T> {
value: T
onChange: (value: T) => void
[key: string]: any
}
export default abstract class BaseInput<T> extends BaseComponent {
/**
* 渲染组件的核心方法，自定义输入组件必须实现本方法，刻画了自定义组件的渲染逻辑
* @param params 在BaseComponent render方法params的基础增加value和onChange字段。
* value: 外部传递状态到自定义输入组件的属性。
* onChange: 输入组件将内部状态变化通知到外部的桥梁。调用该函数，即可将状态通知到外部。
*/
abstract render(params: IBaseInputParams<T>): void
}
示例(React)
import React from 'react'
import ReactDOM from 'react-dom'
import { BaseInput } from '@qn-pandora/app-sdk'
import Search from './Search'
interface IParams {
value: string
onChange: (value: string) => void
}
export default class extends BaseInput<string> {
render(params: IParams) {
ReactDOM.render(
<Search value={params.value} onChange={params.onChange} />,
this.element
)
}
}
渲染潘多拉平台的模块（/页面）
将潘多拉平台的数据集页面渲染进 id 为 moduleContainer 的 div 内
import { renderPandoraModule, EModuleType } from '@qn-pandora/app-sdk'
export default class extends BasicComponent {
datasetContainerRef = React.createRef()
componentDidMount() {
renderPandoraModule(
EModuleType.DatasetModule,
this.datasetContainerRef.current,
{
basePath: 'http://pandora-express-rc.qiniu.io/apps/application/demoapp'
}
)
}
render() {
return <div ref={this.datasetContainerRef} id="moduleContainer" />
}
}
renderPandoraModule(<module name>, <dom> [, options])
import { EModuleType } from '@qn-pandora/app-sdk'中的EModuleType包含了所有模块（/页面）的名称
| 模块名 | 说明 |
|---|---|
| EModuleType.DatasetModule | 渲染 Pandora 平台上面的数据集页面 |
| EModuleType.SearchModule | 渲染 Pandora 平台上面的搜索分析页面 |
| EModuleType.DashboardModule | 渲染 Pandora 平台上面的仪表盘管理页面 |
| EModuleType.TaskExportModule | 渲染 Pandora 平台上面的仪表盘定时任务页面 |
| EModuleType.MonitorManageModule | 渲染 Pandora 平台上面的监控收集器页面 |
| EModuleType.RepoModule | 渲染 Pandora 平台上面的仓库管理页面 |
| EModuleType.SourceTypeModule | 渲染 Pandora 平台上面的来源管理页面 |
| EModuleType.FieldModule | 渲染 Pandora 平台上面的解析管理页面 |
| EModuleType.ReportModule | 渲染 Pandora 平台上面的报表管理页面 |
| EModuleType.AlertRulesModule | 渲染 Pandora 平台上面的告警规则页面 |
| EModuleType.AlertEventsModule | 渲染 Pandora 平台上面的告警事件页面 |
| 参数 | 类型 | 说明 |
|---|---|---|
| options.basePath | string | 在 Pandora 平台上基于该 url 切换路由 |
FAQs
Pandora APP 核心渲染逻辑 SDK
We found that @qn-pandora/app-sdk demonstrated a healthy version release cadence and project activity because the last version was released less than a year ago. It has 0 open source maintainers collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Research
Security News
Socket researchers uncover a malicious npm package posing as a tool for detecting vulnerabilities in Etherium smart contracts.
Security News
Research
A supply chain attack on Rspack's npm packages injected cryptomining malware, potentially impacting thousands of developers.
Research
Security News
Socket researchers discovered a malware campaign on npm delivering the Skuld infostealer via typosquatted packages, exposing sensitive data.