Tried calling Httpd.getUrl, but the Httpd plugin is not installed

Ionic Native
1

Hiall, i’m try to start a httpd server but i have this error “Native: tried calling Httpd.getUrl, but the Httpd plugin is not installed”

the plugin is still correclty installed but not working

(lldb) MacBook-Pro-di-Eugenio:DivaAp cordova plugin ls
cordova-plugin-console 1.0.5 "Console"
cordova-plugin-device 1.1.4 "Device"
cordova-plugin-httpd 0.9.3 "CorHttpd"
cordova-plugin-inappbrowser 1.7.1 "InAppBrowser"
cordova-plugin-splashscreen 4.0.3 "Splashscreen"
cordova-plugin-statusbar 2.2.2 "StatusBar"
cordova-plugin-whitelist 1.3.1 "Whitelist"
ionic-plugin-keyboard 2.2.1 "Keyboard"

here the angular code

import { Component, ViewChild } from '@angular/core';
import { Nav, Platform } from 'ionic-angular';
import { StatusBar } from '@ionic-native/status-bar';
import { SplashScreen } from '@ionic-native/splash-screen';
import { InAppBrowser } from '@ionic-native/in-app-browser';
import { Httpd, HttpdOptions } from '@ionic-native/httpd';

import { HomePage } from '../pages/home/home';
import { ListPage } from '../pages/list/list';

@Component({
  templateUrl: 'app.html',
  providers: [Httpd]
})
export class MyApp {
  @ViewChild(Nav) nav: Nav;

  rootPage: any = HomePage;

  pages: Array<{ title: string, component: any }>;
  target: any = "_blank";
  option: any = "location=no,toolbar=no,presentationstyle=formsheet";
  url: any = "http://192.168.20.35:8066";
  script: any = "";
  browser: any = "";

  constructor(private httpd: Httpd, private iab: InAppBrowser, public platform: Platform, public statusBar: StatusBar, public splashScreen: SplashScreen) {
    this.initializeApp();

  }

  initializeApp() {
    this.platform.ready().then(() => {
      // Okay, so the platform is ready and our plugins are available.      

      this.statusBar.styleDefault();
      this.splashScreen.hide();
      this.browser = this.iab.create(this.url, this.target, this.option);
      this.startServer();
    });
  }

  startServer() {
    if (this.httpd) {
      // before start, check whether its up or not
      console.log("httpd avaiable", )
      let options: HttpdOptions = {
        www_root: '/', // relative path to app's www directory
        port: 80,
        localhost_only: false
      };
      this.httpd.getUrl().then((url) => {
        console.log("web server running on ", url)
      }, (urlKO) => {
        console.log("web server not running on ", urlKO)
      }).catch((Error) => {
        console.error("web error running on ", Error)
        /*this.httpd.startServer(this.options).subscribe((data) => {
          console.log('Server is live ', data);
        });*/
      })

    } else {
      console.error("httpd not avaiable", )
    }

  }
}

tank you for your help

2

Did you ever figure this out? I’m also getting the same error message when I try to start the webserver using the Httpd plugin. Like you, it certainly appears to be installed.

3

I just figured this out.

  1. Make sure you are wrapping your startServer() call in a platform.ready() statement.
  2. Make sure that your configuration options for the server you want to use does not try to use a port that’s already in use. The default port is 80, which is a pretty awful choice for people like me who are Web devs as port 80 is always running an Apache server.
4

Ok, I was wrong about needing to call platform.ready(). The issue was something even more simple. It doesn’t work in Ionic DevApp. You must use either a real device or an emulator to use cordova-plugin-httpd or one of it’s very similar forks.