Come ottenere il nome di dominio per il servizio in Angular2

Question

Ho bisogno di fare richiesta allo stesso server, riposare API su un'altra porta.

Come posso fare questo senza il nome completo di hardcoding negli URL di servizio?

Answer 1

Non c'è bisogno di una soluzione specifica per angular2. È possibile utilizzare window.location.hostname per ottenere il nome host corrente.

Nota, tuttavia, se non si desidera utilizzare variabili globali come l'oggetto window direttamente, è possibile fornire il proprio oggetto Window, che può quindi essere iniettato. Pertanto è necessario impostare il provider per l'oggetto Window quando si avvia l'applicazione.

import {provide} from 'angular2/core'; 
bootstrap(..., [provide(Window, {useValue: window})]); 

Dopo di che è possibile utilizzare l'oggetto finestra e accedere il nome dell'host in questo modo:

constructor(private window: Window) { 
    var hostname = this.window.location.hostname; 
} 

Answer 2

Questo dovrebbe iniziare:

import {LocationStrategy} from '@angular/common'; 

constructor(private locationStrategy:LocationStrategy) { 
    console.log(locationStrategy.prepareExternalUrl('xxx')); 
} 

Answer 3

Un'altra opzione è quella di utilizzare documento da @ angolare/platform-browser.

import {DOCUMENT} from '@angular/platform-browser'; 

constructor(@Inject(DOCUMENT) private document) { 
    let url = document.location.protocol +'//'+ document.location.hostname + ':my_port'); 
} 

Answer 4

angolare soluzione di lavoro 2 ultima:

app.module.ts

providers: [ 
    {provide: Window, useValue: window}, 
    ... 
] 

youclass.ts

constructor(
    @Inject(Window) private _window: Window 
) { 
    this._baseUrl = `http://${this._window.location.hostname}:3333`; 
}; 

Answer 5

ho raggiunto con il seguente codice nel mio app.component.ts :

import { Component, OnInit, Inject, Injectable } from '@angular/core'; 
import { DOCUMENT } from '@angular/platform-browser'; 

@Component({ 
    selector: 'app-root', 
    templateUrl: './app.component.html', 
    styleUrls: ['./app.component.scss'] 
}) 
export class AppComponent implements OnInit { 

    constructor(@Inject(DOCUMENT) private document: any) { } 

    ngOnInit() { 
     this.domain = this.document.location.hostname; 
     console.log(this.domain); 
    } 
} 

Questo dovrebbe stampare il nome del dominio nella console.

Answer 6

Si consiglia di utilizzare window.location come altri hanno gentilmente dichiarato.

Tuttavia, si può anche fare questo importando comune libreria 'Località' di angolare e di utilizzarlo in un iniettabile in questo modo:

import { Injectable } from '@angular/core'; 
import { Location } from '@angular/common'; 
const otherPort = 8000; 

@Injectable() 
export class ServiceOrComponentName { 
    constructor(location: Location) { 
    this.baseUrl = location._platformStrategy._platformLocation._location.protocol + 
     '//' + location._platformStrategy._platformLocation._location.hostname + 
     ':' + otherPort; 
    } 
}