Hosting an HTML endpoint

🚧 Developers
1

Can any one lend me some advice on how to create an endpoint in a smart app that serves up HTML, CSS and JavaScript content?

1 Like
2

Have you tried mapping some HTTP endpoints and then returning HTML from those?

mappings {
  path("/mypage") {
    action: [
      GET: "renderMyCoolPage"
    ]
  }
}

def renderMyCoolPage(){
   render data: "<p>Awesome page</p>"
}
3

I have not. Thank you!

5

Here's a more complete example for you:

definition(
        name: "Test HTML Endpoints",
        namespace: "joshualyon",
        author: "Josh Lyon",
        description: "Test HTML Endpoints",
        category: "Amazing Apps",
        iconUrl: "",
        iconX2Url: "",
        oauth: [displayName: "HTML Endpoint", displayLink: "https://sharptools.io"]){
}

preferences(){
    page(name: "setupScreen")
}

def setupScreen(){
    if(!state.accessToken){	
        //enable OAuth in the app settings or this call will fail
        createAccessToken()	
    }
    def uri = getFullLocalApiServerUrl() + "/?access_token=${state.accessToken}"
    return dynamicPage(name: "setupScreen", uninstall: true, install: true){
        section(){ 
            paragraph("Use the following URI to access the page: <a href='${uri}'>${uri}</a>")
        }
    }
}

mappings {
    //the root path - you can also map other paths or use parameters in paths and posted data
    path("/") { 			 action: [ GET: 	"renderWebsite" ] }
}

def renderWebsite(){
    log.info "Rendering page"
    html = "<html><head><title>Awesome Page</title></head><body><h1>hello world</h1></body></html>"
    render contentType: "text/html", data: html, status: 200
}
5 Likes
6

Is there a way to also reference/locally host a CSS file or do we have to inject the CSS inline in the HTML header?

7

Hubitat recently introduced a local file manager. I haven't played with it much yet, but there's an interface in the admin section on your hub and I've seen other community members (locally) hyperlink to files that are stored there.

Alternatively, you can either inline CSS or point to a CSS file anywhere on the internet (GitHub, a CDN, a basic webserver, etc).

2 Likes