Intégration de sveltekit dans les binaires Golang

l'éditeur php Baicao vous présentera aujourd'hui une technologie intéressante : l'intégration de SvelteKit dans des fichiers binaires Golang. Avec le développement continu de la technologie front-end, de plus en plus de frameworks et d’outils ont vu le jour. En tant que framework émergent, SvelteKit offre une vitesse de chargement plus rapide et des performances plus élevées en créant des applications au moment de la compilation. Cet article vous montrera comment intégrer des applications SvelteKit dans les binaires Golang pour obtenir un déploiement et une distribution plus pratiques. Découvrons ensemble !

Contenu de la question

J'essaie d'utiliser embedd pour servir un seul binaire afin d'inclure un site Web sveltekit. J'utilise le chi comme routeur. Mais je n'arrive pas à le faire fonctionner. J'obtiens l'une de ces options ci-dessous. D'après ce que j'ai compris, intégrez all: 选项可确保包含以 _ 为前缀的文件。我还尝试了主v1中stripprefix方法的变体：/uibuild/或uibuild/etc...

Quelqu’un peut-il nous éclairer là-dessus ?

Exemple de référentiel

1. Liste du répertoire, dans mon cas "uibuild"
2. Il y a une page vierge au niveau du "/", mais dans la console Chrome, le fichier imbriqué obtient une erreur 404
3. 404 apparaît sur la page d'accueil "/".

​

Configuration simplifiée :

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 :

Cela produit l'erreur 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 :

Cela donnera l'erreur 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))

Structure du fichier :

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

Solution de contournement

Il est frustrant que votre "main.go v2" ne puisse ajouter qu'un seul caractère. Vous utilisez :

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

D'après la documentation :

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

Chaque méthode de routage accepte les modèles d'URL et les chaînes de gestionnaires. Le modèle d'URL prend en charge les paramètres nommés (c'est-à-dire /users/{userid}) et les caractères génériques (c'est-à-dire /admin/). Vous pouvez obtenir les paramètres d'URL au moment de l'exécution en appelant chi.urlparam(r, "userid") (pour les paramètres nommés) et chi.urlparam(r, "") (pour les paramètres génériques).

Donc, vous passez "/" comme "motif" ; cela correspondra à / mais rien d'autre ;

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

J'ai testé cela avec l'une de mes applications légères et cela a bien fonctionné. Une amélioration que vous pourriez envisager est de rediriger toutes les demandes de fichiers qui n'existent pas vers

(sinon, si l'utilisateur marque la page avec un chemin, la page ne se chargera pas). Voir /cette réponse pour plus d'informations.

En plus de ce qui précède - pour démontrer ce que j'ai dit dans les commentaires, veuillez consulter la

réponse liée<a href="/about">about</a> 添加到 ui/src/routes/+page.svelte 的末尾并重建（两者都是 svelte 和然后去应用程序）。然后，您将能够导航到 about 页面（首先加载主页，然后单击“关于”）。这是由客户端路由器处理的（因此您可能不会看到任何对 go 服务器的请求）。有关如何在直接访问页面（例如 /about pour savoir comment la faire fonctionner lors de l'ajout de ). Voici un exemple rapide (et quelque peu hacky) qui servira les bits requis du système de fichiers intégré et renverra le principal

pour toutes les autres requêtes (afin que le routeur svelte puisse afficher la page requise). index.html

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

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!