Einbetten von Sveltekit in Golang-Binärdateien

php-Editor Baicao stellt Ihnen heute eine interessante Technologie vor – die Einbettung von SvelteKit in Golang-Binärdateien. Mit der kontinuierlichen Weiterentwicklung der Frontend-Technologie sind immer mehr Frameworks und Tools entstanden. Als aufstrebendes Framework bietet SvelteKit eine schnellere Ladegeschwindigkeit und höhere Leistung, indem Anwendungen zur Kompilierungszeit erstellt werden. In diesem Artikel erfahren Sie, wie Sie SvelteKit-Anwendungen in Golang-Binärdateien einbetten, um eine bequemere Bereitstellung und Verteilung zu erreichen. Lassen Sie es uns gemeinsam herausfinden!

Frageninhalt

Ich versuche, mit embedd eine einzelne Binärdatei bereitzustellen, um eine Sveltekit-Website einzubinden. Ich verwende Chi als meinen Router. Aber ich bekomme es nicht zum Laufen. Ich bekomme eine dieser Optionen unten. Soweit ich weiß, einbetten all: 选项可确保包含以 _ 为前缀的文件。我还尝试了主v1中stripprefix方法的变体：/uibuild/或uibuild/etc...

Kann jemand Licht ins Dunkel bringen?

Sample Repository

1. Verzeichnisliste, in meinem Fall „uibuild“
2. Am „/“ befindet sich eine leere Seite, aber in der Chrome-Konsole wird für die verschachtelte Datei ein 404-Fehler angezeigt
3. 404 erscheint auf der Homepage „/“.

​

Optimierte Konfiguration:

import preprocess from "svelte-preprocess";
import adapter from "@sveltejs/adapter-static";

/** @type {import('@sveltejs/kit').config} */
const config = {
  kit: {
    adapter: adapter({
      pages: "./../server/uibuild",
      assets: "./../server/uibuild",
      fallback: "index.html",
    }),
  },

  preprocess: [
    preprocess({
      postcss: true,
    }),
  ],
};

export default config;

​

main.go v1:

Dies führt zu Fehler 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:

Dies führt zu Fehler 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))

Dateistruktur:

.
├── 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

Workaround

Es ist frustrierend, dass Ihr „main.go v2“ nur ein einziges Zeichen hinzufügen kann. Sie verwenden:

r.handle("/", http.fileserver(http.fs(static)))

Aus der Dokumentation:

func (mx *mux) 句柄(模式字符串，处理程序 http.handler)

Jede Routing-Methode akzeptiert URL-Muster und Handlerketten. Das URL-Muster unterstützt benannte Parameter (z. B. /users/{userid}) und Platzhalter (z. B. /admin/). Sie können URL-Parameter zur Laufzeit abrufen, indem Sie chi.urlparam(r, „userid“) (für benannte Parameter) und chi.urlparam(r, „“) (für Platzhalterparameter) aufrufen.

Also geben Sie „/“ als „Muster“ ein; dies wird übereinstimmen /, aber nichts anderes wird behoben, indem Sie Folgendes verwenden:

r.handle("/*", http.fileserver(http.fs(static)))
// or
r.mount("/", http.fileserver(http.fs(static)))

Ich habe es mit einer meiner Lite-Apps getestet und es hat gut funktioniert. Eine Verbesserung, die Sie möglicherweise in Betracht ziehen sollten, besteht darin, alle Anfragen für nicht vorhandene Dateien an / umzuleiten (andernfalls wird die Seite nicht geladen, wenn der Benutzer die Seite mit einem Pfad als Lesezeichen speichert). Weitere Informationen finden Sie in dieser Antwort.

Zusätzlich zum oben Gesagten – um zu veranschaulichen, was ich in den Kommentaren gesagt habe, sehen Sie sich bitte die <a href="/about">about</a> 添加到 ui/src/routes/+page.svelte 的末尾并重建（两者都是 svelte 和然后去应用程序）。然后，您将能够导航到 about 页面（首先加载主页，然后单击“关于”）。这是由客户端路由器处理的（因此您可能不会看到任何对 go 服务器的请求）。有关如何在直接访问页面（例如 /aboutverlinkte Antwort an, um zu erfahren, wie es beim Hinzufügen funktioniert ).

Hier ist ein schnelles (und etwas kniffliges) Beispiel, das die erforderlichen Bits aus dem eingebetteten Dateisystem bereitstellt und die Hauptbits index.html für alle anderen Anforderungen zurückgibt (damit der Svelte-Router die erforderliche Seite anzeigen kann).

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))
}

Das obige ist der detaillierte Inhalt vonEinbetten von Sveltekit in Golang-Binärdateien. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!