如何在DigitalOcean Kubernetes上设置代码服务器Cloud IDE平台

随着开发人员工具迁移到云,云IDE(集成开发环境)平台的创建和采用正在增长。代码服务器是在远程服务器上运行的Microsoft Visual Studio代码,可直接从您的浏览器访问。在本教程中,您将在DigitalOcean Kubernetes集群上设置代码服务器云IDE平台,并在您的域中公开它,并使用Let的加密证书进行保护。

作者选择了自由和开源基金作为Write for DOnations计划的一部分进行捐赠。

介绍

随着开发人员工具迁移到云,云IDE(集成开发环境)平台的创建和采用正在增长。 云IDE允许开发人员团队之间的实时协作,以在统一的开发环境中工作,从而最大限度地减少不兼容性并提高工作效率。 可通过Web浏览器访问,可从各种类型的现代设备中获得云IDE。 云IDE的另一个优点是可以利用群集的功能,这可以大大超过单个开发计算机的处理能力。

代码服务器是在远程服务器上运行的Microsoft Visual Studio代码 ,可直接从您的浏览器访问。 Visual Studio Code是一个现代代码编辑器,具有集成的Git支持,代码调试器,智能自动完成以及可自定义和可扩展的功能。 这意味着您可以使用各种设备,运行不同的操作系统,并始终拥有一致的开发环境。

在本教程中,您将在DigitalOcean Kubernetes集群上设置代码服务器云IDE平台,并在您的域中公开它,并使用Let的加密证书进行保护。 最后,您将在Kubernetes集群上运行Microsoft Visual Studio代码,可通过HTTPS获得并受密码保护。

先决条件

  • DigitalOcean Kubernetes集群,您的连接配置为kubectl默认值。 创建群集时,“ 连接到群集”步骤下会显示有关如何配置kubectl说明。 要在DigitalOcean上创建Kubernetes集群,请参阅Kubernetes快速入门

  • Helm软件包管理器安装在本地计算机上,并且Tiller安装在您的集群上。 为此,请使用Helm Package Manager教程完成如何在Kubernetes群集上安装软件的第1步和2。

  • 使用Helm在群集上安装Nginx Ingress Controller和Cert-Manager,以便使用Ingress Resources公开代码服务器。 为此,请按照如何使用Helm在DigitalOcean Kubernetes上设置Nginx Ingress

  • 一个完全注册的域名来托管代码服务器,指向Nginx Ingress使用的Load Balancer。 本教程将始终使用code-server.your_domain 您可以在Namecheap上购买域名,在Freenom上免费获取一个域名,或使用您选择的域名注册商。 此域名必须与DigitalOcean Kubernetes前提条件教程中如何设置Nginx Ingress中使用的域名不同。

第1步 - 安装和公开代码服务器

在本节中,您将使用Nginx Ingress控制器将代码服务器安装到您的DigitalOcean Kubernetes集群并在您的域中公开它。 您还将设置准入密码。

您将在本地计算机上将部署配置存储在名为code-server.yaml的文件中。 使用以下命令创建它:

nano code-server.yaml

将以下行添加到文件中:

代码server.yaml
apiVersion: v1
kind: Namespace
metadata:
  name: code-server
---
apiVersion: extensions/v1beta1
kind: Ingress
metadata:
  name: code-server
  namespace: code-server
  annotations:
    kubernetes.io/ingress.class: nginx
spec:
  rules:
  - host: code-server.your_domain
    http:
      paths:
      - backend:
          serviceName: code-server
          servicePort: 80
---
apiVersion: v1
kind: Service
metadata:
 name: code-server
 namespace: code-server
spec:
 ports:
 - port: 80
   targetPort: 8443
 selector:
   app: code-server
---
apiVersion: extensions/v1beta1
kind: Deployment
metadata:
  labels:
    app: code-server
  name: code-server
  namespace: code-server
spec:
  selector:
    matchLabels:
      app: code-server
  replicas: 1
  template:
    metadata:
      labels:
        app: code-server
    spec:
      containers:
      - image: codercom/code-server
        imagePullPolicy: Always
        name: code-server
        args: ["--allow-http"]
        ports:
        - containerPort: 8443
        env:
        - name: PASSWORD
          value: "your_password"

此配置定义命名空间,部署,服务和Ingress。 名称空间称为code-server ,它将代码服务器安装与群集的其余部分分开。 部署包括codercom/code-server Docker映像的一个副本,以及一个名为PASSWORD的环境变量,用于指定访问密码。

code-server服务在内部公开端口80处的pod(作为部署的一部分创建)。 文件中定义的Ingress指定Ingress Controller是nginx ,并且将从服务提供code-server.your_domain域。

请记住将your_password替换为所需的密码,并将code-server.your_domain替换为所需的域,并指向Nginx Ingress Controller的Load Balancer。

然后,通过运行以下命令在Kubernetes中创建配置:

kubectl create -f code-server.yaml

您将看到以下输出:

namespace/code-server created
ingress.extensions/code-server created
service/code-server created
deployment.extensions/code-server created

您可以通过运行以下方式观察代码服务器pod是否可用:

kubectl get pods -w -n code-server

输出结果如下:

NAME                          READY   STATUS              RESTARTS   AGE
code-server-f85d9bfc9-j7hq6   0/1     ContainerCreating   0          1m

状态变为“正在Running ,代码服务器已完成对群集的安装。

在浏览器中导航到您的域。 您将看到代码服务器的登录提示。

代码服务器登录提示

输入您在code-server.yaml设置的密码,然后按Enter IDE 您将进入代码服务器并立即查看其编辑器GUI。

代码服务器GUI

您已经为Kubernetes集群安装了代码服务器,并将其提供给您的域。 您还验证了它要求您使用密码登录。 现在,您将继续使用Cert-Manager免费使用Let's Encrypt证书来保护它。

第2步 - 保护代码服务器部署

在本节中,您将通过将Let的加密证书应用于Ingress来保护您的代码服务器安装,Cert-Manager将自动创建。 完成此步骤后,可以通过HTTPS访问代码服务器安装。

打开code-server.yaml进行编辑:

nano code-server.yaml

将突出显示的行添加到您的文件中,确保将示例域替换为您自己的:

代码server.yaml
apiVersion: v1
kind: Namespace
metadata:
  name: code-server
---
apiVersion: extensions/v1beta1
kind: Ingress
metadata:
  name: code-server
  namespace: code-server
  annotations:
    kubernetes.io/ingress.class: nginx
    certmanager.k8s.io/cluster-issuer: letsencrypt-prod
spec:
  tls:
  - hosts:
    - code-server.your_domain
    secretName: codeserver-prod
  rules:
  - host: code-server.your_domain
    http:
      paths:
      - backend:
          serviceName: code-server
          servicePort: 80
...

首先,您指定此Ingress将用于配置证书的群集颁发者将是letsencrypt-prod ,作为先决条件的一部分创建。 然后,您指定将在tls部分下保护的域,以及保存它们的Secret的名称。

通过运行以下命令将更改应用于Kubernetes集群:

kubectl apply -f code-server.yaml

您需要等待几分钟才能让Let's Encrypt配置您的证书。 在此期间,您可以通过查看以下命令的输出来跟踪其进度:

kubectl describe certificate codeserver-prod -n code-server

完成后,输出的结尾将类似于:

Events:
  Type    Reason              Age    From          Message
  ----    ------              ----   ----          -------
  Normal  Generated           2m49s  cert-manager  Generated new private key
  Normal  GenerateSelfSigned  2m49s  cert-manager  Generated temporary self signed certificate
  Normal  OrderCreated        2m49s  cert-manager  Created Order resource "codeserver-prod-4279678953"
  Normal  OrderComplete       2m14s  cert-manager  Order "codeserver-prod-4279678953" completed successfully
  Normal  CertIssued          2m14s  cert-manager  Certificate issued successfully

您现在可以在浏览器中刷新域名。 您将在浏览器的地址栏左侧看到挂锁,表示连接是安全的。

在此步骤中,您已配置Ingress以保护代码服务器部署。 现在,您可以查看代码服务器用户界面。

第3步 - 探索代码服务器接口

在本节中,您将探索代码服务器接口的一些功能。 由于代码服务器是在云中运行的Visual Studio代码,因此它具有与独立桌面版相同的界面。

在IDE的左侧,有一个垂直的六行按钮,用于打开侧面板中最常用的功能,称为活动栏。

代码服务器GUI  -  Sidepanel

此栏是可自定义的,因此您可以将这些视图移动到不同的顺序或从栏中删除它们。 默认情况下,第一个视图打开Explorer面板,该面板提供项目结构的树状导航。 您可以在此管理文件夹和文件 - 根据需要创建,删除,移动和重命名。 下一个视图提供对搜索和替换功能的访问。

在此之后,按默认顺序,是您对源控制系统的视图,如Git Visual Studio代码还支持其他源控件提供程序,您可以使用本文档中的编辑器找到有关源代码控制工作流的更多说明。

带有版本控制操作的Git下拉菜单

活动栏上的调试器选项提供面板中调试的所有常用操作。 Visual Studio Code附带内置支持Node.js运行时调试器和任何转换为Javascript的语言。 对于其他语言,您可以为所需的调试器安装扩展 您可以在launch.json文件中保存调试配置。

启动launch.json的调试器视图

活动栏中的最终视图提供了一个菜单,用于访问Marketplace上的可用扩展程序。

代码服务器GUI  - 选项卡

GUI的核心部分是您的编辑器,您可以通过选项卡将其分开以进行代码编辑。 您可以将编辑视图更改为网格系统或并排文件。

编辑网格视图

通过“ 文件”菜单创建新文件后,将在新选项卡中打开一个空文件,保存后,可以在资源管理器侧面板中查看该文件的名称。 右键单击资源管理器侧栏并按“ 新建文件夹”即可创建文件 您可以通过单击文件夹的名称以及将文件和文件夹拖放到层次结构的上部来将其移动到新位置来展开文件夹。

代码服务器GUI  - 新文件夹

您可以通过按CTRL+SHIFT+\ ,或按上部菜单中的终端 ,然后选择新终端来访问终端 终端将在下面板中打开,其工作目录将设置为项目的工作区,其中包含Explorer侧面板中显示的文件和文件夹。

您已经探索了代码服务器接口的高级概述,并回顾了一些最常用的功能。

结论

您现在可以在DigitalOcean Kubernetes集群上安装代码服务器,这是一个多功能的云IDE。 您可以单独处理源代码和文档,也可以与团队协作。 在群集上运行云IDE可为测试,下载以及更彻底或严格的计算提供更多功能。 有关详细信息,请参阅Visual Studio Code文档 ,其中包含有关代码服务器其他组件的其他功能和详细说明。