在Kubernetes上部署具有Frontend + Backend应用程序的Docker映像

Question

我有一个简单的应用程序，其中Express.js作为后端API，React.js作为前端客户端。

我创建一个带有前端和后端的单打图像容器 应用程序回购：https://github.com/vitorvr/list-users-kubernetes

Dockerfile：

FROM node:13

WORKDIR /usr/app/listusers

COPY . .

RUN yarn
RUN yarn client-install
RUN yarn client-build

EXPOSE 8080

CMD ["node", "server.js"]

server.js

const express = require('express');
const cors = require('cors');
const path = require('path');

const app = express();
const ip = process.env.IP || '0.0.0.0';
const port = process.env.PORT || 8080;

app.use(express.json());
app.use(cors());
app.use(express.static(path.join(__dirname, 'public')));

app.get('/users', (req, res) => {
  res.json([
    { name: 'Jhon', id: 1 },
    { name: 'Ashe', id: 2 }
  ]);
});

app.listen(port, ip, () =>
  console.log(`Server is running at http://${ip}:${port}`)
);

回拨电话：

const api = axios.create({
  baseURL: 'http://0.0.0.0:8080'
});

useEffect(() => {
  async function loadUsers() {
    const response = await api.get('/users');
    if (response.data) {
      setUsers(response.data);
    }
  }
  loadUsers();
}, []);

要在minikube中部署和运行该映像，请使用以下命令：

kubectl run list-users-kubernetes --image=list-users-kubernetes:1.0 --image-pull-policy=Never
kubectl expose pod list-users-kubernetes --type=LoadBalancer --port=8080
minikube service list-users-kubernetes

当前端尝试访问localhost时发生问题：

如果我必须在React中进行一些修复，或者在Kubernetes中进行一些设置，或者甚至是在Kubernetes上将小型应用程序部署为容器映像的最佳实践，我都不知道该在哪里修复。 / p>

谢谢。

Answer 1

您的Kubernetes节点（假设它在本地开发计算机上作为虚拟机运行）将被分配一个IP地址。同样，当将IP地址分配给运行“ list-user-kubernetes”服务的Pod时。您可以通过运行以下命令来查看IP地址：kubectl get pod list-users-kubernetes，要查看更多信息，请在命令末尾添加-o wide，例如。 kubectl get pod list-users-kubernetes -o wide。

或者，您可以使用kubectl port-forward pod/POD_NAME POD_PORT:LOCAL_PORT将端口转发到本地主机。下面的示例：

kubectl port-forward pod/list-users-kubernetes 8080:8080 注意：您应该将其作为后台服务运行，或者在终端的其他选项卡中运行，因为只要运行命令，端口转发就可以使用。

我建议使用第二种方法，因为Pod的外部IP在部署期间可能会更改，但是将其映射到localhost将允许您在不更改代码的情况下运行应用程序。

Link to port forwarding documentation