Подключение к API с помощью Angular Webapp с использованием Minikube и Kubernetes - PullRequest
0 голосов
/ 13 февраля 2020

Я пытаюсь изучить Kubernetes и хотел бы создать простой пример Angular интерфейса в контейнере Docker, подключающегося к. NET Core API, также в контейнере Docker. Я могу успешно создать как API, так и внешний интерфейс и могу видеть результат в обзоре, но изо всех сил пытаюсь получить информацию из API на внешнем интерфейсе. Поскольку IP-адрес API меняется, я не могу жестко закодировать эти значения в приложении Angular перед созданием образа, но использование имени DNS, похоже, тоже не работает.

В настоящее время в моем приложении Angular есть следующее:

SERVER_URI: 'http://budgetlist-api:50605/'

backend-api.service.yaml

apiVersion: v1
kind: Service
metadata:
  name: bucketlist-api
spec:
  selector:
    app: bucketlist-api
  ports:
    - protocol: TCP
      port: 50605
  type: ClusterIP

frontend-app.service.yaml

apiVersion: v1
kind: Service
metadata:
  name: bucketlist-app
spec:
  selector:
    app: bucketlist-app
  ports:
    - protocol: TCP
      port: 4200
      targetPort: 4200
  type: NodePort

Dockerfile для моего приложения Angular:

FROM node:12.2.0
WORKDIR /app

COPY package.json ./

RUN npm install
RUN npm install -g @angular/cli

COPY . .

CMD ng serve --host 0.0.0.0

Я не уверен, что еще нужно, но я рад добавить дополнительную информацию, если потребуется. Любая помощь приветствуется, когда я выдергиваю свои волосы, пытаясь понять это.

1 Ответ

0 голосов
/ 24 февраля 2020

Ваш бэкэнд-сервис - ClusterIP, поэтому к нему можно получить доступ только из кластера Minikube Angular работает из-за пределов кластера (из вашего браузера)

Вам следует изменить тип бэкэнд-сервиса на NodePort или LoadBalancer. Или используйте Ingress Controller.

apiVersion: v1
kind: Service
metadata:
  name: bucketlist-api
spec:
  selector:
    app: bucketlist-api
  ports:
    - protocol: TCP
      port: 50605
      nodePort: 30100
  type: NodePort

И используйте SERVER_URI как

SERVER_URI: 'http://budgetlist-api:30100/'
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...