How to render an html inside the cordova folder in Quasar



  • Hi all,
    I am new to Quasar (and Vue) and I am trying to build a web server that runs on Android using the Quasar framework. I had asked a previous question in this forum and I was told that its better to investigate how to do this type of a solution in Cordova. This was quite helpful and I found a cordova add-on that does the job. The add on is - CorHttpd: embeded httpd for cordova https://github.com/floatinghotpot/cordova-httpd

    The addon uses an html page under … to help users start or stop the webserver [Screenshot 1]

    So, when I run cordova run android from inside the \src-cordova folder the solution works [Screenshot 1 and 2]

    But when I try to compile it using quasar cli - quasar dev -m cordova -T android - I get different types of errors. I think it all boils down to the fact that I dont know how to **call/display ** the addon using Vue/Quasar. Is there any guide on how to do this? How can I render the contents of this html file as a Vue file?

    I reviewed the examples given in the Quasar page for Cordova addons but I did not understand how for this particular addon I could use the same approach.

    Screenshot_20201122-022328.jpeg
    Screenshot_20201122-022400.jpeg



  • @avistad

    How can I render the contents of this html file as a Vue file?

    You can use the v-html directive example1:
    https://codepen.io/ontwikkelfabriek/pen/yLJdwXR

    You can use the v-html directive example2:
    https://codepen.io/ontwikkelfabriek/pen/PozrLKj

    Or you can use Vue.compile() ( second post):
    https://stackoverflow.com/questions/37133282/how-to-use-components-in-v-html?answertab=oldest#tab-top

    But I don’t think you need to render html in Vue components to be able to use this plugin.( just use the api of the plugin)

    I think it all boils down to the fact that I dont know how to **call/display ** the addon using Vue/Quasar.

    I think the cordova-httpd cordova plugin can be found somewhere in the browser window object. Like:
    window.cordova.plugins.CorHttpd But I am not sure , best to inspect the app with chrome devtools to see where it is hanging out.

    I did find some other webserver plugins:

    cordova:
    https://github.com/bykof/cordova-plugin-webserver

    capacitor( probably the best maintained)
    https://ionicframework.com/docs/v3/native/web-server/
    https://github.com/bykof/cordova-plugin-webserver

    BTW: If you need more support please provide relevant code listings and error logs, so we can help you better.


Log in to reply