CODEWITHSUNDEEP
angularimagegetinsomnia
Arkadiusz
Arkadiusz

Reputation: 86

Angular Getting a picture on and on from REST API and displaying it

I am about creating a site, which will be displaying image took from driving car on a screen of computer in real-time. I am sending a picture by Insomnia like this (I have not a server, yet):

Insomnia

and there is a code from Angular:

video-streaming.service.ts

import { Injectable } from '@angular/core';
import { HttpClient } from '@angular/common/http';
import { Observable } from 'rxjs';

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

  constructor(private http: HttpClient) { }

  getFiles(url: string): Observable<any> {
    return this.http.get(url); // 'http://localhost:8080/api/file/all' anykind
  }
}

video-streaming.component.ts

import { Component, OnInit } from '@angular/core';
import { VideoStreamingService } from './video-streaming.service';


@Component({
  selector: 'app-video-streaming',
  templateUrl: './video-streaming.component.html',
  styleUrls: ['./video-streaming.component.css']
})
export class VideoStreamingComponent implements OnInit {

  image: any;
  constructor(private videoStreamingService: VideoStreamingService) { }

  ngOnInit() {
    this.getImage('https://192.168.0.102:8080/image');
  }

  getImage(url: string): void {
    this.videoStreamingService.getFiles(url)
      .subscribe(image => {
        this.image = image;
      });
  }
}

and the HTML template:

<img src={{image}}>

Only ERROR what I get from console is:

GET https://192.168.0.102:8080/image net::ERR_CONNECTION_TIMED_OUT

What am I doing wrong?

@UPDATE

I did change the line

this.getImage('https://192.168.0.102:8080/image');

to this:

this.getImage('http://localhost:8080/image');

and also the address in Insomnia to: http://localhost:8080/image

There are more errors, details below.

Angular errors in console:

enter image description here

Insomnia errors:

enter image description here

Upvotes: 2

Views: 1387

Answers (1)

Hitech Hitesh
Hitech Hitesh

Reputation: 1635

You are getting an error of TIMEOUT because the api url provided is not found in the network and it has timed out for the search of it.

This IP address is of the dynamic IP address that is provided by the wifi router.

If you are accessing the image from the local machine use this address

http://localhost:8080

Don't use https use on http

https is when a domain is secure.

Upvotes: 1

Related Questions