mirror of
https://github.com/dunglas/frankenphp.git
synced 2025-12-24 13:38:11 +08:00
225ca409d3
This patch brings hot reloading capabilities to PHP apps: in development, the browser will automatically refresh the page when any source file changes! It's similar to HMR in JavaScript. It is built on top of [the watcher mechanism](https://frankenphp.dev/docs/config/#watching-for-file-changes) and of the [Mercure](https://frankenphp.dev/docs/mercure/) integration. Each time a watched file is modified, a Mercure update is sent, giving the ability to the client to reload the page, or part of the page (assets, images...). Here is an example implementation: ```caddyfile root ./public mercure { subscriber_jwt {env.MERCURE_SUBSCRIBER_JWT_KEY} anonymous } php_server { hot_reload } ``` ```php <?php header('Content-Type: text/html'); ?> <!DOCTYPE html> <html lang="en"> <head> <title>Test</title> <script> const es = new EventSource('<?=$_SERVER['FRANKENPHP_HOT_RELOAD']?>'); es.onmessage = () => location.reload(); </script> </head> <body> Hello ``` I plan to create a helper JS library to handle more advanced cases (reloading CSS, JS, etc), similar to [HotWire Spark](https://github.com/hotwired/spark). Be sure to attend my SymfonyCon to learn more! There is still room for improvement: - Provide an option to only trigger the update without reloading the worker for some files (ex, images, JS, CSS...) - Support classic mode (currently, only the worker mode is supported) - Don't reload all workers when only the files used by one change However, this PR is working as-is and can be merged as a first step. This patch heavily refactors the watcher module. Maybe it will be possible to extract it as a standalone library at some point (would be useful to add a similar feature but not tight to PHP as a Caddy module). --------- Signed-off-by: Kévin Dunglas <kevin@dunglas.fr> Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com>
45 lines
1.3 KiB
Go
45 lines
1.3 KiB
Go
//go:build !nomercure && !nowatcher
|
|
|
|
package frankenphp
|
|
|
|
import (
|
|
"encoding/json"
|
|
"log/slog"
|
|
|
|
"github.com/dunglas/frankenphp/internal/watcher"
|
|
"github.com/dunglas/mercure"
|
|
watcherGo "github.com/e-dant/watcher/watcher-go"
|
|
)
|
|
|
|
// WithHotReload sets files to watch for file changes to trigger a hot reload update.
|
|
func WithHotReload(topic string, hub *mercure.Hub, patterns []string) Option {
|
|
return func(o *opt) error {
|
|
o.hotReload = append(o.hotReload, &watcher.PatternGroup{
|
|
Patterns: patterns,
|
|
Callback: func(events []*watcherGo.Event) {
|
|
// Wait for workers to restart before sending the update
|
|
go func() {
|
|
data, err := json.Marshal(events)
|
|
if err != nil {
|
|
if globalLogger.Enabled(globalCtx, slog.LevelError) {
|
|
globalLogger.LogAttrs(globalCtx, slog.LevelError, "error marshaling watcher events", slog.Any("error", err))
|
|
}
|
|
|
|
return
|
|
}
|
|
|
|
if err := hub.Publish(globalCtx, &mercure.Update{
|
|
Topics: []string{topic},
|
|
Event: mercure.Event{Data: string(data)},
|
|
Debug: globalLogger.Enabled(globalCtx, slog.LevelDebug),
|
|
}); err != nil && globalLogger.Enabled(globalCtx, slog.LevelError) {
|
|
globalLogger.LogAttrs(globalCtx, slog.LevelError, "error publishing hot reloading Mercure update", slog.Any("error", err))
|
|
}
|
|
}()
|
|
},
|
|
})
|
|
|
|
return nil
|
|
}
|
|
}
|