Backstage系列教程 - 04 集成GitLab

一、开发前准备

1. 网络连通性

确认 GitLab 与 Backstage 服务能够互相 ping 通，这是集成的前提条件。

2. 参考文档

二、集成步骤示例

1. 安装支持插件

从项目的根目录开始，执行以下命令安装 GitLab 相关插件：

1
2

yarn add @backstage/plugin-scaffolder-backend-module-gitlab \
         @backstage/plugin-catalog-backend-module-gitlab

插件说明：

• 🔌 @backstage/plugin-scaffolder-backend-module-gitlab：脚手架后端 GitLab 模块，支持通过模板创建 GitLab 项目
• 🔌 @backstage/plugin-catalog-backend-module-gitlab：目录后端 GitLab 模块，支持从 GitLab 同步目录信息

2. 添加配置

在 app-config.yaml 中添加 GitLab 集成配置：

1
2
3
4
5
6

integrations:
  # ...others
  gitlab:
    - host: gitlabcode.xxxx.com.cn
      token: 'xxxx'               # 公司公用admin账号的personal accessToken
      apiBaseUrl: 'https://gitlabcode.xxxx.com.cn/api/v4'

但是，根据本系统的需求，我们还需要再做一些其他的修改。

三、修改软件模板

在 Backstage 中，项目、服务等东西的创建都将基于软件模板进行，这也是 Backstage 的核心特点之一。

接下来的开发文章中，我们将基于在创建的 Backstage 项目中官方给出的示例模板，逐步修改和完善，最终形成一套符合本系统需求的软件模板。

本篇文章将进行首次的修改与调整。

软件模板中各项配置文件的含义，可以参考这篇文章：在 Backstage 中编写软件模板

1. 新建与复制模板

在创建好的 Backstage 项目中，找到 examples/template 文件夹下的 template.yaml 文件。

操作步骤：

1. 在同级新建一个文件 gitlabTemplate.yaml
2. 将 template.yaml 文件中的内容复制到新建的文件中
3. 保存文件

2. 修改模板中的部分内容

编辑 examples/template/gitlabTemplate.yaml 文件：

metadata 部分

1
2
3
4
5
6

# other....
metadata:
  name: GitLab-template          # 这个模板的名称
  title: GitLab Template         # 展示在前端界面上的这个模板的名称
  description: To create a template on GitLab  # 一些描述性内容
# others....

parameters 部分

1
2
3
4
5
6
7
8
9
10
11
12
13

parameters:
  # others...
  - title: Choose a location
    required:
      - repoUrl
    properties:
      repoUrl:
        title: Repository Location
        type: string
        ui:field: RepoUrlPicker
        ui:options:
          allowedHosts:
            - gitlab.xxxx.com.cn   # 修改此处的host

steps 部分

1
2
3
4
5
6
7
8
9

steps:
  # others....
  - id: publish
    name: Publish
    action: publish:gitlab    # 对应之前安装的依赖 @backstage/plugin-scaffolder-backend-module-gitlab
    input:
      allowedHosts: ['gitlabcode.xxxx.com.cn']  # 将host修改为本公司的地址
      description: This is ${{ parameters.name }}
      repoUrl: ${{ parameters.repoUrl }}

四、测试：创建一个项目

操作步骤

1. 填写 Backstage 项目信息
2. 填写 GitLab 项目信息
3. 点击创建，创建成功后将出现类似成功页面
4. 查看 Backstage 和 GitLab，能够看到刚才填写并创建的项目

总结：Backstage 与 GitLab 的集成非常便捷，官方提供的插件已经封装了大部分复杂逻辑，只需简单配置即可完成集成。通过定制软件模板，我们可以将企业的项目创建流程标准化，提升开发效率。接下来我们将接着利用上述步骤创建的软件模板，继续补充完善，集成更多的内容。