data-star를 이용한 실시간 웹
- DDD원래의
- 2024-10-13 06:12:02610검색
여기 https://data-star.dev를 사용하여 golang에서 "라이브"가 얼마나 간단하고 깔끔한지 보여주는 작은 예가 있습니다
서버 시계:
cmd/app/main.go
package main
import (
"log"
"net/http"
"github.com/blinkinglight/clock-data-star/handlers"
"github.com/go-chi/chi/v5"
)
func main() {
router := chi.NewRouter()
handlers.SetupHome(router)
log.Printf("Starting server on :3000")
log.Fatal(http.ListenAndServe(":3000", router))
}
handlers/handlers.go
package handlers
import (
"net/http"
"time"
"github.com/blinkinglight/clock-data-star/web/views"
"github.com/delaneyj/datastar"
"github.com/go-chi/chi/v5"
)
func SetupHome(router chi.Router) {
homeRoute := func(w http.ResponseWriter, r *http.Request) {
views.ClockPage().Render(r.Context(), w)
}
clockRoute := func(w http.ResponseWriter, r *http.Request) {
sse := datastar.NewSSE(w, r)
ticker := time.NewTicker(time.Second)
for {
select {
case <-r.Context().Done():
ticker.Stop()
return
case <-ticker.C:
datastar.RenderFragmentTempl(sse, views.ClockFragment(time.Now().Format("15:04:05")))
}
}
}
router.Get("/", homeRoute)
router.Get("/clock", clockRoute)
}
웹/뷰/page.templ
package views
templ Page() {
<!DOCTYPE html>
<html>
<head>
<script type="module" defer src="https://cdn.jsdelivr.net/npm/@sudodevnull/datastar"></script>
</head>
<body>
<div>
{ children... }
</div>
</body>
</html>
}
그리고 web/views/clock.templ
package views
import "github.com/delaneyj/datastar"
templ ClockPage() {
@Page() {
<div data-on-load={ datastar.GET("/clock") }>
<h1>Clock</h1>
<div id="clock"></div>
</div>
}
}
templ ClockFragment(t string) {
<div id="clock">
{ t }
</div>
}
그게 다입니다.
실제 사례는 여기에 있습니다: https://github.com/blinkinglight/clock-data-star
위 내용은 data-star를 이용한 실시간 웹의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!
성명：
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.