Can not call embed css/js files

Viewed 104

I'm embedding my css and js files as below:

package resources

import (
    "embed"
)

// WebUI is our static web ui from onsen ui.
//go:embed public/onsen
var WebUI embed.FS

// Views is our static web server layouts, views with dynamic content and partials content that is a static view.
//go:embed templates/layouts templates/views templates/partials
var Views embed.FS

And trying to define this WebUI as static folder in my main function:

package main

import (
    "fmt"
    "log"
    "html/template"
    "net/http"
    "onsen/resources"
)

var view *template.Template
var err error

func init() {
    fmt.Println("Starting up.")
    view = template.Must(template.ParseFS(resources.Views, "templates/layouts/*.html", "templates/views/*.html", "templates/partials/*.html"))

    if err != nil {
        log.Fatal("Error loading templates:" + err.Error())
    }
}

func main() {
    http.Handle("/static/", http.StripPrefix("/static/", http.FileServer(http.FS(resources.WebUI))))
    //http.Handle("/static/", http.FileServer(http.FS(resources.WebUI)))

    http.HandleFunc("/index", index)
    server := http.Server{
        Addr: "127.0.0.1:8070",
    }
    server.ListenAndServe()
}

func index(w http.ResponseWriter, r *http.Request) {
    err = view.ExecuteTemplate(w, "index.html", nil)
    if err != nil {
        log.Fatalln(err)
    }
}

The folders structure is as shown:

enter image description here

But a running, I' getting the below errors:

enter image description here

CSS files: Refused to apply style from 'http://127.0.0.1:8070/static/css/onsenui.css' because its MIME type ('text/plain') is not a supported stylesheet MIME type, and strict MIME checking is enabled.

JS files: Failed to load resource: the server responded with a status of 404 (Not Found)
1 Answers

I solved it by fixing the static route as:

http.Handle("/webUI/", http.StripPrefix("/webUI/", http.FileServer(http.FS(resources.WebUI))))

And both css and js files calls as:

<link rel="stylesheet" type="text/css" href="/webUI/public/onsen/css/onsenui.css"/>

that is: 'The static path [/webUI] + the original route [public/onsen/...]

Related