maxence-charriere / go-app

A package to build progressive web apps with Go programming language and WebAssembly.
https://go-app.dev
MIT License
7.88k stars 361 forks source link

Errors in browser #864

Closed omani closed 1 year ago

omani commented 1 year ago

hi all, new to go-app. tried to run my first hello example app and set an autoupdate interval. does not work. was wondering why so I looked into the dev-tools console and saw this:

2023-08-09-065943_1181x552_scrot

my server.go:

package main

import (
    "log"
    "net/http"
    "time"

    "github.com/maxence-charriere/go-app/v9/pkg/app"
)

func AppServer() {
    // HTTP routing:
        h := &app.Handler{
        Name:        "Hello",
        Description: "An Hello World! example",
        Styles: []string{
            "/web/css/main.css",
        },
        Scripts: []string{
            // "https://livejs.com/live.js", // Add simple live reloading
        },
        LoadingLabel: "Loading",
        Title: "My new shiny app",
        AutoUpdateInterval: time.Second,
    }

    http.Handle("/", h)

    if err := http.ListenAndServe(":8000", nil); err != nil {
        log.Fatal(err)
    }
}

as a workaround to the autoupdate (which does not work at all) Im using entr to watch files and make run whenever files change.

omani commented 1 year ago

and this is the error to why autoupdate doesn't work:

2023-08-09-070506_916x251_scrot

I get an Uncaught (in promise) DomException error. every second due to AutoUpdateInterval: time.Second in my server.go.

mlctrez commented 1 year ago

Hi @omani ,

A few things:

Setup your app.Handler configuration with icons for your application. If they can't be loaded the service worker won't load properly. The defaults might point to locations that are no longer available or have CORS issues like in your first screen shot.

You appear to be missing the app.Route(....) and app.RunWhenOnBrowser() sections in your example code.. This will definitely cause issues with the wasm in the browser functioning correctly. edit: you may have more than one file so you could be doing this there.

The AutoUpdateInterval is how frequent the client code checks for a new version on the server. You also need the corresponding component to handle reloading the page automatically or presenting a button to update to the user.

https://github.com/mlctrez/goappnew has examples of the above items and can be used as another point of reference.

omani commented 1 year ago

Ive cloned the goappnew repo. I see DEV=1 is set in Makefile. still no updates when I change something in the route. I guess I have to make wasm to build a new wasm (which makes sense to me). but after doing so I dont see any updates (after 3 seconds, according to the code).

also it says using env: export GIN_MODE=release even though DEV=1 is set in Makefile. I dont know if this is supposed to be because GIN_MODE should be set to env DEV according to the code.

oderwat commented 1 year ago

@omani You need to recompile everything and to stop the old and run that new server. The update interval tells the web worker to check if there is a new version available. If so, the frontend update check will trigger, and you need to reload the page in the browser.

Notice: If you set a version in the app.Handler you also need to make sure that it is different from before. If you do not set it, it will be changed by default.

omani commented 1 year ago

@omani You need to recompile everything and to stop the old and run that new server. The update interval tells the web worker to check if there is a new version available. If so, the frontend update check will trigger, and you need to reload the page in the browser.

Notice: If you set a version in the app.Handler you also need to make sure that it is different from before. If you do not set it, it will be changed by default.

I dont get it, what is the purpose of autoupdate if I have to rebuild the whole server and restart it? I thought autoupdate is something like Hot Reload? in my old app (the examples given above) it reloads the page as well when I rebuild the server. maybe Im missing something here. I thought autoupdate means rebuilding the wasm and thus placing it into /web, makes the browser reload automatically. without the need to rebuild the whole server.

omani commented 1 year ago

what I basically want is hot reload feature like in sveltekit (vite), deno fresh, react, etc. when I change HTML and save it, I want the changes reflected in the browser immediately.

oderwat commented 1 year ago

Auto-update has nothing to do with "hot reload". It is about finding out that there is an update for the PWA and letting the user know, so he can update the browser/app, do it for him or force the update on the user. See https://go-app.dev/lifecycle

P.S.: You will probably never get anything like a hot-reload. This is not possible with this technology. We have something proprietary in the company to make the whole compilation and reloading painless and a matter of seconds (similar to other file watching tools that recompile), but for having "hot reload" like updates in the PWA frontend you need to have that be able to reload the page and keep state, which can be difficulty.

omani commented 1 year ago

Auto-update has nothing to do with "hot reload". It is about finding out that there is an update for the PWA and letting the user know, so he can update the browser/app, do it for him or force the update on the user. See https://go-app.dev/lifecycle

P.S.: You will probably never get anything like a hot-reload. This is not possible with this technology. We have something proprietary in the company to make the whole compilation and reloading painless and a matter of seconds (similar to other file watching tools that recompile), but for having "hot reload" like updates in the PWA frontend you need to have that be able to reload the page and keep state, which can be difficulty.

I see. so I indeed misunderstood the autoupdate feature of go-app. thanks anyway. nevertheless I will use the goappnew repo as a starting template because it has a nice structure and the handler.json file is handy.

also https://go-app.dev/lifecycle made it clear for me now.

thanks guys.