File tree Expand file tree Collapse file tree 7 files changed +183
-0
lines changed
_templates/browser/browser-go Expand file tree Collapse file tree 7 files changed +183
-0
lines changed Original file line number Diff line number Diff line change 1+ build
2+ node_modules
3+ .wrangler
Original file line number Diff line number Diff line change 1+ # browser-go
2+
3+ - A template for starting a browser-based HTTP server with Go.
4+ - This template uses Cloudflare Workers to just serve a static page.
5+ - This template uses [ ` workers ` ] ( https://github.com/syumai/workers ) package to run an HTTP server.
6+
7+ ## Usage
8+
9+ - ` main.go ` includes simple HTTP server implementation. Feel free to edit this code and implement your own HTTP server.
10+
11+ ## Requirements
12+
13+ - Node.js
14+ - Go 1.24.0 or later
15+
16+ ## Getting Started
17+
18+ - Create a new worker project using this template.
19+
20+ ``` console
21+ npm create cloudflare@latest -- --template github.com/syumai/workers/_templates/browser/browser-go
22+ ```
23+
24+ - Initialize a project.
25+
26+ ``` console
27+ cd my-app
28+ go mod init
29+ go mod tidy
30+ npm start # start running dev server
31+ ```
32+
33+ Then, open http://localhost:8787 in your browser.
34+
35+ ## Development
36+
37+ ### Commands
38+
39+ ```
40+ npm start # run dev server
41+ npm run build # build Go Wasm binary
42+ npm run deploy # deploy static assets
43+ ```
Original file line number Diff line number Diff line change 1+ package main
2+
3+ import (
4+ "bytes"
5+ "fmt"
6+ "io"
7+ "net/http"
8+
9+ "github.com/syumai/workers"
10+ )
11+
12+ func main () {
13+ http .HandleFunc ("/hello" , func (w http.ResponseWriter , req * http.Request ) {
14+ name := req .URL .Query ().Get ("name" )
15+ if name == "" {
16+ name = "World"
17+ }
18+ msg := fmt .Sprintf ("Hello, %s!" , name )
19+ w .Write ([]byte (msg ))
20+ })
21+ http .HandleFunc ("/echo" , func (w http.ResponseWriter , req * http.Request ) {
22+ b , err := io .ReadAll (req .Body )
23+ if err != nil {
24+ panic (err )
25+ }
26+ io .Copy (w , bytes .NewReader (b ))
27+ })
28+ workers .Serve (nil ) // use http.DefaultServeMux
29+ }
Original file line number Diff line number Diff line change 1+ {
2+ "name" : " <TBD>" ,
3+ "version" : " 0.0.0" ,
4+ "private" : true ,
5+ "scripts" : {
6+ "build" : " go run github.com/syumai/workers/cmd/workers-assets-gen -mode=go -runtime=browser -o ./public/build && GOOS=js GOARCH=wasm go build -o ./public/build/app.wasm ." ,
7+ "deploy" : " wrangler deploy" ,
8+ "dev" : " wrangler dev" ,
9+ "start" : " wrangler dev"
10+ },
11+ "devDependencies" : {
12+ "wrangler" : " ^4.9.1"
13+ }
14+ }
Original file line number Diff line number Diff line change 1+ <!doctype html>
2+ < html >
3+
4+ < head >
5+ < title > Go HTTP Server in the Browser</ title >
6+ </ head >
7+
8+ < body >
9+ < h1 > Go HTTP Server in the Browser</ h1 >
10+ < form id ="app ">
11+ < div >
12+ < label >
13+ Path
14+ < select name ="path ">
15+ < option value ="hello "> /hello</ option >
16+ < option value ="echo "> /echo</ option >
17+ </ select >
18+ </ label >
19+ </ div >
20+ < div >
21+ < label >
22+ Name (for hello)
23+ < input type ="text " name ="name " value ="Name " />
24+ </ label >
25+ </ div >
26+ < div >
27+ < label >
28+ < label >
29+ Message (for echo)
30+ < input type ="text " name ="message " value ="Message " />
31+ </ label >
32+ </ div >
33+ < button type ="submit "> Send</ button >
34+ </ form >
35+
36+ < h2 > Result</ h2 >
37+ < div id ="result "> </ div >
38+ < script src ="./index.mjs " type ="module "> </ script >
39+ </ body >
40+
41+ </ html >
Original file line number Diff line number Diff line change 1+ import handlers from "./build/worker.mjs" ;
2+
3+ const appForm = document . getElementById ( "app" ) ;
4+ const resultContainer = document . getElementById ( "result" ) ;
5+
6+ const paths = {
7+ hello : "/hello" ,
8+ echo : "/echo" ,
9+ } ;
10+
11+ const methods = {
12+ hello : "GET" ,
13+ echo : "POST" ,
14+ } ;
15+
16+ appForm . addEventListener ( "submit" , async ( e ) => {
17+ e . preventDefault ( ) ;
18+
19+ const formData = new FormData ( e . target ) ;
20+ const path = formData . get ( "path" ) ;
21+ const message = formData . get ( "message" ) ;
22+ const name = formData . get ( "name" ) ;
23+
24+ let url = paths [ path ] ;
25+ if ( path === "hello" ) {
26+ url = `${ url } ?name=${ encodeURIComponent ( name ) } ` ;
27+ }
28+
29+ const req = new Request ( url , {
30+ method : methods [ path ] ,
31+ body : path === "echo" ? message : undefined ,
32+ } ) ;
33+ const res = await handlers . fetch ( req ) ;
34+ const text = await res . text ( ) ;
35+
36+ resultContainer . textContent = text ;
37+ } ) ;
Original file line number Diff line number Diff line change 1+ {
2+ "$schema" : " node_modules/wrangler/config-schema.json" ,
3+ "name" : " <TBD>" ,
4+ "compatibility_date" : " <TBD>" ,
5+ "build" : {
6+ "command" : " npm run build"
7+ },
8+ /**
9+ * Static Assets
10+ * https://developers.cloudflare.com/workers/static-assets/binding/
11+ */
12+ "assets" : {
13+ "directory" : " ./public" ,
14+ "html_handling" : " drop-trailing-slash"
15+ }
16+ }
You can’t perform that action at this time.
0 commit comments