HTTP リクエストの URL 指定がうまくいかない

Angular 歴2ヶ月ほどの初心者です。HTTP リクエストを送るサービスを書いて試したところ、うまくいかなかったため質問させてください。

【質問】

HttpClient を使ってリクエストを送ろうとしているが、適切な URL へ送ることができない。

【詳細】

Angular で HTTP リクエストを送るサービスを書いており、以下リンクのコードを参考に、「HTTP リクエストの共通化をしている api.service.ts 」と「 ApiService を注入して具体的なリクエストを送る user.service 」の2つのサービスを作成しました。

[api.service.ts]

import { Injectable } from '@angular/core';
import { environment } from '../../../environments/environment';
import { HttpHeaders, HttpClient, HttpParams } from '@angular/common/http';
import { Observable, throwError } from 'rxjs';
import { catchError } from 'rxjs/operators';

@Injectable({
  providedIn: 'root'
})
export class ApiService {
  constructor(
    private http: HttpClient
  ) { }

  private formatErrors(error: any) {
    return throwError(error.error);
  }

  // environment.api_url = '127.0.0.2' 
  get(path: string, params: HttpParams = new HttpParams()): Observable<any> {
    return this.http.get(`${environment.api_url}${path}`, { params })
      .pipe(catchError(this.formatErrors));
  }
  ...
}

[user.service.ts]

import { ApiService } from './api.service';
import { User } from '../models/user.model';

@Injectable({
  providedIn: 'root'
})
export class UserService {
  constructor(private apiService: ApiService) { }

  getUser(): Observable<any> {
    return this.apiService.get('/user')
      .pipe(map((data: {user: User}) => data.user));
  }
}

http://127.0.0.2/user にリクエストを送る想定なのですが、実際に UserService の getUser() を使用して HTTP リクエストを送ろうとすると http://127.0.0.1:4200/127.0.0.2/user にリクエストを送ってしまいます。想定した URL の前に開発サーバの URL がついてしまっている状態です。

適切な URL へ送るにはどうすればよいのでしょうか?初歩的な質問かもしれませんが、ご回答いただけるとありがたいです。

「いいね!」 1

environment.api_url = 'http://127.0.0.2' としてみるとどうでしょうか。http から始まっていないのでパスだと認識されているんじゃないかと思います。あるいは //127.0.0.2 でも同じ結果になりそうです

「いいね!」 1

lacolaco さん

ご回答ありがとうございます!おっしゃるとおり、http:// をはじめにつけたところ解決しました!

「いいね!」 1