Angular9 http.get () не работает должным образом

Question

Я разрабатываю простое приложение, чтобы консультироваться с серверной частью на NodeJS. Все работает отлично на localhost, но когда я запускаю сервер angular на моем IP-адресе (192.168.1.x), он больше не работает. nodeJS REST api, который он работает на 'http://localhost: 3000 / api / article', и сервер Angular в https://192.168.1.x: 4200 . Код http.get это:

article.component.ts:

import {ArticlesService} from '../../services/articles.service';
import {Article} from '../../models/article';
import { ViewChild } from '@angular/core'

@Component({
  selector: 'app-articles',
  templateUrl: './articles.component.html',
  styleUrls: ['./articles.component.scss'],
  providers: [ArticlesService],
  
})

export class ArticlesComponent implements OnInit {

  constructor(public articlesService: ArticlesService) { }

  article: Article;

  //Some other code that dosen't afect this

  getArticle(id: String) {
    this.articlesService.getArticle(id)
    .subscribe( res => {
      this.article = res as Article;
    })
  }

article.service.ts:

import { HttpClient } from '@angular/common/http';

@Injectable({
  providedIn: 'root'
})
export class ArticlesService {

  readonly API_URI = 'http://localhost:3000/api/article';

  constructor(private http: HttpClient) { 
  }
  getArticle(id: String) {
      return this.http.get(this.API_URI+`/${id}`);
  }
}

Я пробовал flags test, и я понимаю, что он никогда не входит в subscribe (), я новичок, и это первый раз, когда я запускаю сервер на моем текущем ip, а не на localhost. Итак, я не знаю, если, может быть, я не могу запросить на бэкэнде, как это в этом случае или в чем-то еще.

Используя morgan и postman в nodeJS REST api, я вижу, что запрос на получение работает правильно с той стороны.

Если бы кто-нибудь мог мне помочь, это было бы ужасно.

Answer 1

Я точно не понимаю вас с сервером Angular, но все указывает на то, что ваш сервер Angular не имеет видимости вашего localhost: 3000. Это как когда вы размещаете свой спа на другом сервере. Этот сервер не знает о вашем локальном хосте, и вы должны заменить свой API_URI (с помощью environment.ts) IP-адресом или именем домена, где ваш бэкэнд:

Например, у меня это есть в моем environment.prod. тс:

export const environment = {
    production: true,
    apiUrl: 'https://urltothenodejsbackend/api',
    apiVersion: '/v1'
};