Dockerizing Mean Stack App на облачном экземпляре и доступ к нему в браузере - PullRequest
Новая
       27

Dockerizing Mean Stack App на облачном экземпляре и доступ к нему в браузере

0 голосов
/ 27 июня 2019

Я установил приложение MEAN на экземпляр EC2 и пытаюсь получить доступ к приложению (FrontEnd) в браузере. Я связал три службы, то есть FrontEnd, BackEnd и Database с помощью этого docker-compose.yml 

version: "2"
services:
  angular:
    build: ./FrontEndYb
    ports:
      - "8085:4200"
    links:
      - app
  app:
    container_name: app
    restart: always
    build: ./BackEndYb
    ports:
      - "3011:3011"
    links:
      - mongo
  mongo:
    container_name: mongo
    image: mongo
    volumes:
      - ./data:/data/db
    ports:
      - "27017:27017"

Я могу назвать свой узел api viz "VM-IP": 3011 / api / users с помощью Postman для хранения данных в контейнере mongo. Я вызываю API BackEnd в своем коде FrontEnd следующим образом FrontEndYb / SRC / приложение / form.service.ts 

import { Injectable } from '@angular/core';
import { HttpClient, HttpHeaders } from '@angular/common/http';

@Injectable({ providedIn: 'root' })
export class FormService {
    constructor(private httpClient: HttpClient) {
    }
saveInfo(firstname: string, lastname: string) {
        const headers = new HttpHeaders()
            .set('Authorization', 'my-auth-token')
            .set('Content-Type', 'application/json');
           this.httpClient.post('http://app:3011/api/users', {
          //here 'app' is  the name of node service written in docker-compose
            firstname: firstname,
            lastname: lastname
        }, { headers: headers }
).subscribe((response) => {
            console.log(response)
        });
    }
}

Также мой BackEnd / startup / rout.js 

const express = require('express');
const users = require('../routes/users')

module.exports = function (app) {
    app.use(express.json())
    app.all("/*", function(req, res, next){
       res.header('Access-Control-Allow-Origin', '*');
       res.header('Access-Control-Allow-Methods', 'GET,PUT,POST,DELETE,OPTIONS');
       res.header('Access-Control-Allow-Headers', 'Content-Type, Authorization, Content-Length, X-Requested-With');
    next();        
});
    app.use('/api/users', users);
}

Проблема в том, что когда я захожу в приложение в браузере и отсылаю оттуда некоторые данные, выдает эту ошибку

"" "Доступ к XMLHttpRequest по адресу http://app:3011/api/users' от источника 'http://54.169.178.148:8085' заблокирован политикой CORS: Ответ предполётный запрос не проходит проверку контроля доступа: Redirect is не допускается для предварительного запроса.

core.js: 7187 ОШИБКА HttpErrorResponse {заголовки: HttpHeaders, статус: 0, statusText: «Неизвестная ошибка», URL: «http://app:3011/api/users", ok: false,…} ошибка: ProgressEvent {isTrusted: true, lengthComputable: false, загружено: 0, всего: 0, тип: «error»,…} заголовки: HttpHeaders {normalizedNames: Map (0), lazyUpdate: null, заголовки: Map (0)} сообщение: «Http-сообщение об ошибке для http://app:3011/api/users: 0 Неизвестная ошибка» name: "HttpErrorResponse" ok: false status: 0 statusText: "Unknown Ошибка "url:" http://app:3011/api/users" proto : HttpResponseBase "" "

В приведенной выше ошибке 54.169.178.148 мой публичный IP-адрес виртуальной машины

Если я зайду в контейнер FrontEnd и вызову контейнер узла api viz http://app:3011/api/users,, где 'app' - это имя службы узла, как написано в docker-compose.yml, она работает нормально. Я знаю, что вместо использования this.http.post ('http://app:3011/api/users',..),, если я использую публичный IP-адрес моей виртуальной машины, то есть this.http.post (' http://VM -Public-IP / api / users ', ...) в моем коде FrontEnd работает нормально, нет проблемы с CORS, статус 200.

Когда я получаю доступ к своему приложению в браузере, URL 'app: 3011 / api / users' не существует, потому что теперь он находится во внешнем мире (вне виртуальной машины), тогда как лучше всего вызывать узел api в таком случае случаи.

Это URL github для ссылки на полный код, если это необходимо. Github.com/tarunchawla28/mean-docker

Заранее спасибо.

1 Ответ

0 голосов
/ 27 июня 2019

Лучший способ - использовать шлюз API или доменное имя, указывающие на ваш публичный ip виртуальной машины.

...