如何将 vuejs 集成到带有 RESTful 后端的 minikube 中?

How to integrate vuejs into minikube with a RESTful backend?

我想将我的 vuejs 应用程序集成到 minikube 集群中。

我使用 VueJs 教程中的 Dockerfile 和 Nginx 网络服务器进行生产,并使用第一个选项 localhost:8080 here。我将 yml 文件中的端口相应地更改为 localhost 到 8080 和 nginx 版本,如下所示为 80

然后在我的 config/index.js

  dev: {

 [...]
    host: 'localhost', // can be overwritten by process.env.HOST
    port: 8080, // can be overwritten by process.env.PORT, if port is in use, a free one will be determined
    autoOpenBrowser: false,
    errorOverlay: true,
    notifyOnErrors: true,
    poll: false, // https://webpack.js.org/configuration/dev-server/#devserver-watchoptions-
[...]
}, 

我设置了默认的8080端口。对于我的 minikube 部署和服务,我添加了

apiVersion: apps/v1 # for versions before 1.9.0 use apps/v1beta2
kind: Deployment
metadata:
  name: vuejs
spec:
  selector:
    matchLabels:
      app: vuejs
      tier: frontend
  replicas: 1
  template:
    metadata:
      labels:
        app: vuejs
        tier: frontend
    spec:
      imagePullSecrets:
      - name: regcred
      containers:
        - name: vuejs
          image: <secret registry> 
          ports:
            - containerPort: 80
  strategy:
    type: RollingUpdate
    rollingUpdate:
      maxSurge: 1
      maxUnavailable: 1
---
apiVersion: v1
kind: Service
metadata:
  name: vuejs
  labels:
    app: vuejs
    tier: frontend
spec:
  type: LoadBalancer
  ports:
    - port: 80
      targetPort: 80
  # Replace with the IP of your minikube java / master java
  # externalIPs:
  #  - 192.168.99.105 
  selector:
    app: vuejs
    tier: frontend

如何连接到 vuejs/nginx 网络服务器。此外,由于我将后端的 DNS 名称设置为 java 如何在 vuejs 中设置 java REST API 地址? 我将地址设置为 'http://java:8080/' 没有任何反应。 Java REST 后端通过 this yml 集成到 minikube 中。

奇怪的问题是,在开始 vuejs 部署后,我可以在 127.0.0.1:8080 访问 vuejs 应用程序。当我理解正确时,我认为 kubernetes 集群打开了自己的网络,只能通过外部 IP 访问

看看我的 kubectl get all 我会说 vuejs 应该可以访问 192.168.99.105:8080 - 当使用没有 nginx 的 dockerimage 时。

NAME                         READY   STATUS    RESTARTS   AGE
pod/java-fbf949cbc-rqstq     0/1     Error     4          2d
pod/maria-7b67c8ddf-xp8xx    1/1     Running   2          2d
pod/private-reg              1/1     Running   5          5d
pod/vuejs-5f4c657d74-885j9   1/1     Running   1          18h
NAME                 TYPE           CLUSTER-IP      EXTERNAL-IP      PORT(S)          AGE
service/java         LoadBalancer   10.101.207.98   192.168.99.100   8080:31011/TCP   2d
service/kubernetes   ClusterIP      10.96.0.1       <none>           443/TCP          5d
service/maria        ClusterIP      10.99.177.228   <none>           3306/TCP         2d
service/vuejs        NodePort       10.104.108.44   192.168.99.105   8080:30001/TCP   17h
NAME                    DESIRED   CURRENT   UP-TO-DATE   AVAILABLE   AGE
deployment.apps/java    1         1         1            0           2d
deployment.apps/maria   1         1         1            1           2d
deployment.apps/vuejs   1         1         1            1           18h
NAME                               DESIRED   CURRENT   READY   AGE
replicaset.apps/java-fbf949cbc     1         1         0       2d
replicaset.apps/maria-7b67c8ddf    1         1         1       2d
replicaset.apps/vuejs-5f4c657d74   1         1         1       18h

有两种方法可以从 Kubernetes 集群公开资源:

  1. 使用 Ingress。欲了解更多信息,您可以访问此link.

  2. 暴露一个Service。您可以通过两种方式进行:

    • 类型:LoadBalancer。但是,它仅适用于云提供商。

    • 类型:NodePort。在您的情况下,这是最简单的方法,您需要在服务的 YAML 描述中将 spec.typeLoadBalancer 更改为 NodePort。之后,要访问 Kubernetes 集群内部的服务,您需要使用节点的 IP 地址和字段 nodePort 中的端口。例如,192.168.12.34:30001

您可以使用 minikube service 命令将 url 暴露给您自己的主机。对于您的部署,请尝试:

minikube service vuejs --url

它会显示一个添加了 NodePort 的 IP。将该命令的结果复制并粘贴到您的浏览器。

更新:工作原理

Minikube 使用单节点 Kubernetes 集群在您的主机(您的笔记本电脑)内启动一个虚拟机,分配您可以使用 minikube ip 命令获得的本地 IP。那是Kubernetes节点的IP。

当您在 Kubernetes 中公开一个 "NodePort" 服务时,它会分配一个范围为 30000-32767(默认)的静态端口,因此您可以使用 <NodeIP>:<NodePort>

访问该服务