如何以角度（打字稿）从浏览器获取客户端IP地址

Question

Hey there i would really appreciate if you can provide me with an example where a type script class can get the client ip address and the browser that the client is using and to set those values in variables

i want to do this in type script not in java script is that possible and if not how to do it with type script

- So For Example i can 1) set those variables while submitting the form to the data base in the back end 2)i can for example display for the user the browser he is using any help would be appreciated thanks

Answer 1

Thank you very much, very good solution I took it as a basis for my problem but I did not solve it because it gave me the public IP of the internet server. For an internal network with DHCP, change the URL by the following:

  getIpCliente(): Observable<string> {
      return this.http.get('http://api.ipify.org/?format=jsonp&callback=JSONP_CALLBACK') // ...using post request '
      .map((res:Response) => {console.log('res ', res);
                              console.log('res.json() ', res.text());
                              //console.log('parseado ', JSON.parse(res.text()));
                              console.log('parseado  stringify ', JSON.stringify(res.text()));
                              let ipVar = res.text();
                              let num = ipVar.indexOf(":");
                              let num2 = ipVar.indexOf("\"});");
                              ipVar = ipVar.slice(num+2,num2);
                              console.log('ipVar -- ',ipVar);
                              return ipVar}); // ...and calling .json() on the response to return data
      //.catch((error:any) => Observable.throw(error.json().error || 'Server error')); //...errors if any
  }

I hope to serve you friends

Answer 2

You should try like this

var json = 'http://ipv4.myexternalip.com/json';
   $http.get(json).then(function(result) {
    console.log(result.data.ip)
},  function(e) {
   alert("error");
});

Answer 3

Try the services of https://geolocation-db.com to get the public ip address of the user.

import { HttpClient } from "@angular/common/http";
import { catchError, tap } from "rxjs/operators";

this.http.get<any>('https://geolocation-db.com/json/')
  .pipe(
    catchError(err => {
      return throwError(err);
    }),
    tap(response => {
      console.log(response.IPv4);
    })
  )

Answer 4

Try This :

Create Provider and add function with required dependencies :

import { Injectable }     from '@angular/core';
import { Http, Response, Headers, RequestOptions } from '@angular/http';
import {Observable} from 'rxjs/Rx';
import 'rxjs/add/operator/toPromise';
import 'rxjs/add/operator/map';
import 'rxjs/add/operator/catch';
import 'rxjs/Rx';


 //  Function :

getIP(): Observable<Data[]> {
    return this.http.get('http://ipinfo.io') // ...using post request
    .map((res:Response) => res.json()) // ...and calling .json() on the response to return data
    .catch((error:any) => Observable.throw(error.json().error || 'Server error')); //...errors if any
}

Controller Code :

getIP() {
    this.loading = true;
    this._myIPService.getIP()
    .subscribe(
        IPDetails => this.IppDetails,
        error =>  this.errorMessage = <any>error
        );
}

You will have all the details of IP in this.IppDetails