Skip to content
A thin wrapper around onvif-rx to communicate with ONVIF devices and cameras in Angular applications.
TypeScript JavaScript HTML CSS
Branch: master
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
e2e init Jul 24, 2019
projects/onvif-rx-angular update readme Jul 25, 2019
src wip Jul 25, 2019
.editorconfig initial commit Jul 24, 2019
.gitignore initial commit Jul 24, 2019
README.md update readme Jul 25, 2019
angular.json init Jul 24, 2019
browserslist initial commit Jul 24, 2019
karma.conf.js init Jul 24, 2019
package-lock.json update readme Jul 25, 2019
package.json update readme Jul 25, 2019
tsconfig.app.json initial commit Jul 24, 2019
tsconfig.json init Jul 24, 2019
tsconfig.spec.json initial commit Jul 24, 2019
tslint.json initial commit Jul 24, 2019

README.md

onvif-rx-angular

A thin wrapper around onvif-rx to communicate with ONVIF devices and cameras in Angular applications.

npm latest version

Installation

npm i onvif-rx-angular onvif-rx stream

import { NgModule } from '@angular/core';
import { ONVIFModule } from 'onvif-rx-angular';

@NgModule({
  ...
  imports: [
    ...,
    ONVIFModule,
    ...
  ],
  ...
})
export class AppModule { }

You will also need to somehow expose a global object for the Buffer polyfill. You can do this by adding (window as any).global = window; to your polyfills.ts file.

Example Usage

import { Component } from '@angular/core';
import { ONVIFService } from 'onvif-rx-angular';

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

  device = this.onvif.createManagedDevice({
    deviceUrl: 'http://192.168.1.142:80/onvif/device_service',
    password: 'admin',
    username: '123456'
  });

  getSomeInfo = () => 
    this.device.api.Media
    .GetServiceCapabilities()
    .toPromise()
    .then(response => {
      response.match({
        fail: console.log,
        ok: d => console.log(d.json)
      });
    })
}

Important

  • Your device must return CORS headers otherwise browsers will reject the responses. You can either run this in Electron or setup a proxy server that appends response headers.
You can’t perform that action at this time.