php小编百草今天要为大家介绍一种有趣的技术——在golang二进制文件中嵌入SvelteKit。随着前端技术的不断发展,越来越多的框架和工具涌现出来。而SvelteKit作为一个新兴的框架,通过编译时构建应用程序,提供了更快的加载速度和更高的性能。本文将向大家展示如何将SvelteKit应用程序嵌入到golang的二进制文件中,以实现更方便的部署和分发,让我们一起来了解一下吧!
问题内容
我正在尝试使用 embedd 提供单个二进制文件以包含 sveltekit 网站。我使用 chi 作为我的路由器。但我无法让它发挥作用。我得到下面这些选项之一。据我了解, embedd all:
选项可确保包含以 _
为前缀的文件。我还尝试了主v1中stripprefix
方法的变体:/uibuild/
或uibuild/
等...
有人可以照亮它吗?
示例存储库
- 目录列表,在我的例子中为“uibuild”
- “/”处有空白页,但在 chrome 控制台中,嵌套文件出现 404 错误
- 主页“/”上出现 404。
精简配置:
import preprocess from "svelte-preprocess";
import adapter from "@sveltejs/adapter-static";
const config = {
kit: {
adapter: adapter({
pages: "./../server/uibuild",
assets: "./../server/uibuild",
fallback: "index.html",
}),
},
preprocess: [
preprocess({
postcss: true,
}),
],
};
export default config;
main.go v1:
这会产生错误 3。
package main
import (
"embed"
"log"
"net/http"
chi "github.com/go-chi/chi/v5"
)
//go:embed all:uibuild
var sveltestatic embed.fs
func main() {
r := chi.newrouter()
r.handle("/", http.stripprefix("/uibuild", http.fileserver(http.fs(sveltestatic))))
log.fatal(http.listenandserve(":8082", r))
}
main.go v2:
这将给出错误 2。
static, err := fs.sub(sveltestatic, "uibuild")
if err != nil {
panic(err)
}
r := chi.newrouter()
r.handle("/", http.fileserver(http.fs(static)))
log.fatal(http.listenandserve(":8082", r))
文件结构:
.
├── go.mod
├── go.sum
├── main.go
└── uibuild
├── _app
│ ├── immutable
│ │ ├── assets
│ │ │ ├── 0.d7cb9c3b.css
│ │ │ └── _layout.d7cb9c3b.css
│ │ ├── chunks
│ │ │ ├── index.6dba6488.js
│ │ │ └── singletons.b716dd01.js
│ │ ├── entry
│ │ │ ├── app.c5e2a2d5.js
│ │ │ └── start.58733315.js
│ │ └── nodes
│ │ ├── 0.ba05e72f.js
│ │ ├── 1.f4999e32.js
│ │ └── 2.ad52e74a.js
│ └── version.json
├── favicon.png
└── index.html
解决方法
令人沮丧的是,您的“main.go v2”只能添加单个字符。您正在使用:
r.handle("/", http.fileserver(http.fs(static)))
来自文档:
func (mx *mux) 句柄(模式字符串,处理程序 http.handler)
每个路由方法都接受 url 模式和处理程序链。 url 模式支持命名参数(即 /users/{userid})和通配符(即 /admin/)。可以在运行时通过调用 chi.urlparam(r, "userid")(对于命名参数)和 chi.urlparam(r, "")(对于通配符参数)来获取 url 参数。
所以你传入“/”作为“模式”;这将匹配 /
但没有其他内容;修复使用:
r.handle("/*", http.fileserver(http.fs(static)))
// or
r.mount("/", http.fileserver(http.fs(static)))
我用我的一款精简应用程序对此进行了测试,它运行良好。您可能需要考虑的一项改进是将不存在的文件的任何请求重定向到 /
(否则,如果用户使用路径为页面添加书签,则该页面将无法加载)。请参阅此答案了解信息。
除上述内容之外 - 为了演示我在评论中所说的内容,请将 about
添加到 ui/src/routes/+page.svelte
的末尾并重建(两者都是 svelte 和然后去应用程序)。然后,您将能够导航到 about
页面(首先加载主页,然后单击“关于”)。这是由客户端路由器处理的(因此您可能不会看到任何对 go 服务器的请求)。有关如何在直接访问页面(例如 /about
)时使其工作的信息,请参阅链接的答案。 p>
这是一个快速(有点hacky)的示例,它将从嵌入式文件系统提供所需的位,并为所有其他请求返回主 index.html
(以便 svelte 路由器可以显示所需的页面)。
package main
import (
"embed"
"fmt"
"io/fs"
"log"
"net/http"
"github.com/go-chi/chi/v5"
)
//go:embed all:uibuild
var svelteStatic embed.FS
func main() {
s, err := fs.Sub(svelteStatic, "uibuild")
if err != nil {
panic(err)
}
staticServer := http.FileServer(http.FS(s))
r := chi.NewRouter()
r.Handle("/", staticServer) // Not really needed (as the default will pick this up)
r.Handle("/_app/*", staticServer) // Need to serve any app components from the embedded files
r.Handle("/favicon.png", staticServer) // Also serve favicon :-)
r.HandleFunc("/*", func(w http.ResponseWriter, r *http.Request) { // Everything else returns the index
r.URL.Path = "/" // Replace the request path
staticServer.ServeHTTP(w, r)
})
fmt.Println("Running on port: 8082")
log.Fatal(http.ListenAndServe(":8082", r))
}
以上就是在 golang 二进制文件中嵌入 sveltekit的详细内容,更多请关注编程网其它相关文章!