飞布产品手册
官网B站Github
V1.0
V1.0
  • 序言
  • 更新日志
  • 产品简介
    • 什么是飞布?
    • 飞布的价值
    • 飞布的优势
    • 应用场景
    • 数据安全
    • 产品案例
  • 快速入门
    • 初识飞布
    • 快速上手
      • 图文版
    • 词汇概览
    • 工作原理
  • 基础-可视化开发
    • 概览
      • CLI
      • 控制台
        • 主功能区
    • 数据源
      • 数据库
        • 数据库连接
          • 高级设置
        • 数据建模
        • 数据预览
      • REST 数据源
      • GraphQL 数据源
      • 消息队列
    • API构建
      • 可视化构建
        • API规范
      • 批量新建
      • HTTP请求流程指令
      • 使用API
      • 实时查询
      • 实时推送
      • 关联查询
      • 数据缓存
      • 常见用例
    • 身份验证
      • 授权码模式
        • 身份验证(废弃)
      • 隐式模式
      • 数据权限控制
    • 身份授权
      • RBAC
        • 授权与访问控制(废弃)
      • 接口权限控制
      • 开放API
    • 文件存储
      • S3配置及使用
      • 文件管理面板
      • 高级配置:profile
  • 进阶-钩子机制
    • 钩子概览
    • 启动钩子
      • Node钩子
      • Golang钩子
      • Python钩子
      • Java钩子
    • OPERATION钩子
    • 身份验证钩子
    • graphql钩子
    • 函数钩子
      • functions(废弃)
      • proxys(废弃)
    • 文件上传钩子
    • 内部调用
  • 使用-部署上线
    • 部署运维
      • 手动部署
        • 流水线部署(废弃)
      • Docker部署
      • 飞布云
    • 接口安全
      • CSRF token 保护
      • 跨域访问
    • 客户端SDK
      • 微信小程序SDK
      • Flutter SDK
      • uniapp SDK
  • 环境准备
    • 文件存储 S3
    • 身份认证 OIDC
    • NodeJs环境
  • 实战案例
    • Fireboom Admin
      • 管理后台-refine(废弃)
    • 实时TODO LIST
    • 语音版ChatGPT
    • AI魔法师实战
    • 阿里低代码引擎
  • 路线图
  • 常见问题
  • 核心概念
    • GraphQL
    • 超图
    • 请求时序图
    • 服务端Operation
  • 二次开发
    • 钩子规范
      • 钩子规范bak
    • 模板规范
    • 自定义模板
    • 其它参考
由 GitBook 提供支持
在本页
  • 新建GraphQL钩子
  • graphql控制面板
  • 内省graphql
  • 构建API
  • 示例

这有帮助吗?

在GitHub上编辑
  1. 进阶-钩子机制

graphql钩子

上一页身份验证钩子下一页函数钩子

最后更新于1年前

这有帮助吗?

为了进一步提升开发体验,Fireboom在HOOKS框架中集成了graphql端点。它本质上是一个内置的grphql数据源。可以用来实现复杂的业务逻辑。

该方式有循环依赖,要遵循绕开依赖!你也可以自行在HOOKS SDK中实现GraphQL服务。

新建GraphQL钩子

1,在 Fireboom 控制台点击数据源面板的+号,进入数据源新建页。

2,在数据源新建页面,选择 自定义-> 脚本,设置起名称为:Custom。

3,系统自动初始化如下脚本。默认填充的是示例代码,你可以根据业务需求修改代码。

customize/Custom.go
package customize

import (
	"custom-go/pkg/plugins"
	"github.com/graphql-go/graphql" # 自行学习该库的用法
)

type Person struct {
	Id        int    `json:"id"`
	FirstName string `json:"firstName"`
	LastName  string `json:"lastName"`
}

var (
	personType = graphql.NewObject(graphql.ObjectConfig{
		Name:        "Person",
		Description: "A person in the system",
		Fields: graphql.Fields{
			"id": &graphql.Field{
				Type: graphql.Int,
			},
			"firstName": &graphql.Field{
				Type: graphql.String,
			},
			"lastName": &graphql.Field{
				Type: graphql.String,
			},
		},
	})

	fields = graphql.Fields{
		"person": &graphql.Field{
			Type:        personType,
			Description: "Get Person By ID",
			Args: graphql.FieldConfigArgument{
				"id": &graphql.ArgumentConfig{
					Type: graphql.Int,
				},
			},
			Resolve: func(params graphql.ResolveParams) (interface{}, error) {
				_ = plugins.GetGraphqlContext(params)
				id, ok := params.Args["id"].(int)
				if ok {
					testPeopleData := []Person{
						{Id: 1, FirstName: "John", LastName: "Doe"},
						{Id: 2, FirstName: "Jane", LastName: "Doe"},
					}
					for _, p := range testPeopleData {
						if p.Id == id {
							return p, nil
						}
					}
				}
				return nil, nil
			},
		},
	}
	rootQuery = graphql.ObjectConfig{Name: "RootQuery", Fields: fields}
	Custom_schema, _ = graphql.NewSchema(graphql.SchemaConfig{Query: graphql.NewObject(rootQuery)})
)

4,在数据源列表,右击 开启当前钩子,然后重新启动钩子服务

5,钩子服务启动后,将注册对应的graphql服务端点,其路由格式如下:

http://{serverAddress}/gqls/${gql-name}/graphql

# ${gql-name}=graphql 数据源名称
# Example:: http://localhost:9992/gqls/Custom/graphql

graphql控制面板

Get请求上述端点时,默认打开 graphql 控制面板。

其原理的是:读取helix.html文件,修改其中${graphqlEndpoint}为web界面请求路径。

<script >
    GraphQLHelixGraphiQL.init({
      defaultQuery: undefined,
      defaultVariableEditorOpen: undefined,
      endpoint: '${graphqlEndpoint}', // 修改为 http://localhost:9992/gqls/Custom/graphql
      headers: undefined,
      headerEditorEnabled: undefined,
      subscriptionsEndpoint: undefined,
      useWebSocketLegacyProtocol: undefined,
      hybridSubscriptionTransportConfig: undefined,
      shouldPersistHeaders: undefined,
    });
</script>

内省graphql

post 请求上述端点,按照如下格式,可以获得其graphql schema。

http://{serverAddress}/gqls/${gql-name}/graphql

# Example:: http://localhost:9992/gqls/Custom/graphql

Content-Type: application/json

# JSON request
{
    "query": "IntrospectionQuery content", // 内省QUERY OPERATION,见下文
    "variables": {}, 
    "operationName": "IntrospectionQuery" 
}

# JSON response
{
    // ... graphql schema struct
}
IntrospectionQuery content
query IntrospectionQuery {
  __schema {
    queryType {
      name
    }
    mutationType {
      name
    }
    subscriptionType {
      name
    }
    types {
      ...FullType
    }
    directives {
      name
      description
      locations
      args {
        ...InputValue
      }
    }
  }
}
fragment FullType on __Type {
  kind
  name
  description
  fields(includeDeprecated: true) {
    name
    description
    args {
      ...InputValue
    }
    type {
      ...TypeRef
    }
    isDeprecated
    deprecationReason
  }
  inputFields {
    ...InputValue
  }
  interfaces {
    ...TypeRef
  }
  enumValues(includeDeprecated: true) {
    name
    description
    isDeprecated
    deprecationReason
  }
  possibleTypes {
    ...TypeRef
  }
}
fragment InputValue on __InputValue {
  name
  description
  type {
    ...TypeRef
  }
  defaultValue
}
fragment TypeRef on __Type {
  kind
  name
  ofType {
    kind
    name
    ofType {
      kind
      name
      ofType {
        kind
        name
        ofType {
          kind
          name
          ofType {
            kind
            name
            ofType {
              kind
              name
              ofType {
                kind
                name
              }
            }
          }
        }
      }
    }
  }
}

构建API

由于Fireboom服务依赖钩子服务,因此,需要按照如下步骤操作。

  • 开启钩子:开启graphql钩子后,Fireboom将重新生成HOOKS 项目,将该钩子合成到对应文件

  • 重启钩子:手动重新启动钩子服务,保证钩子服务注册了graphql路由

  • 重新编译:在Fireboom控制台,点击右上角的“编译”按钮,内省该数据源

通过上述方式拿到的GraphQL SCHEMA被作为子图合并到Fireboom 超图 中,详情 查看 超图。

server/fireboom_server.go
GraphqlServers: []plugins.GraphQLServerConfig{
    {
        ApiNamespace:          "Custom",
        ServerName:            "Custom",
        EnableGraphQLEndpoint: true,
        Schema:                customize.Custom_schema,
    },
},

接着,我们就可以在Fireboom的超图面板中构建OPERATION,生成REST API供客户端使用。

通过该方式可以实现任意复杂的业务需求!且可以复用Fireboom的权限体系。

此外,通过该方式可以将消息队列接入到Fireboom中,将事件订阅转变成GraphQL SUBSCRIPTION,然后转变成SSE推送,供客户端消费!

示例

Nodejs示例:

golang示例:

case-element-admin
fb-admin
下述方法
1MB
helix.html
graphq钩子
内省
将GraphQL钩子转变成REST API