fix: route static react resources

Author: snyh

punch-server/api.go

@@ -1,10 +1,13 @@
 package main
 
 import (
+	"github.com/gorilla/mux"
 	"github.com/gorilla/websocket"
+	"io/ioutil"
 	"log"
 	"net/http"
 	"os"
+	"strings"
 )
 
 func showList(m *Manager) http.HandlerFunc {
@@ -14,14 +17,42 @@ func showList(m *Manager) http.HandlerFunc {
 	}
 }
 
+type ReactRouter struct {
+	fs    http.Handler
+	other http.Handler
+}
+
+func (rr ReactRouter) ServeHTTP(w http.ResponseWriter, r *http.Request) {
+	p := r.URL.Path
+
+	if strings.HasPrefix(r.URL.Path, "/ws") {
+		rr.other.ServeHTTP(w, r)
+		return
+	}
+
+	if _, err := os.Stat("./ui/build/" + p); err != nil {
+		bs, _ := ioutil.ReadFile("./ui/build/index.html")
+		w.WriteHeader(200)
+		w.Write(bs)
+		return
+	} else {
+		rr.fs.ServeHTTP(w, r)
+	}
+}
+
 func UIServer(addr string, m *Manager) {
 	// See https://github.com/codegangsta/gin for get to known PORT environment.
 	if p := os.Getenv("PORT"); p != "" {
 		addr = ":" + p
 	}
-	http.Handle("/list", showList(m))
-	http.Handle("/connect", connectByWS(m))
-	http.ListenAndServe(addr, nil)
+
+	r := mux.NewRouter()
+	r.HandleFunc("/ws", connectByWS(m))
+
+	http.ListenAndServe(addr, ReactRouter{
+		fs:    http.FileServer(http.Dir("./ui/build/")),
+		other: r,
+	})
 }
 
 var upgrader = websocket.Upgrader{

punch-server/lib.go

@@ -68,7 +68,7 @@ func writeJSON(w http.ResponseWriter, code int, v interface{}) {
 
 func openUrl(url string) {
 	bin, err := exec.LookPath("xdg-open")
-	if err != nil || true {
+	if err != nil {
 		log.Printf("Please open %q to see more informations\n", url)
 	} else {
 		exec.Command(bin, url).Run()

punch-server/ui/src/App.js

@@ -9,7 +9,7 @@ import XTerm from './react-xterm.js';
 
 import UserView from './UserView.js';
 
-const API_SERVER = "localhost:2207"
+const API_SERVER = `${window.location.hostname}:2207`
 
 class MagicLinkWithEnsure extends Component {
     state = {
@@ -62,7 +62,7 @@ class MagicLink extends Component {
         }
 
         const id = this.props.magicKey;
-        const backend = new WebSocket(`ws://${API_SERVER}/connect?uuid=${id}`)
+        const backend = new WebSocket(`ws://${API_SERVER}/ws?uuid=${id}`)
         backend.onclose = this.handleError.bind(this)
         backend.onopen = this.handleOpen.bind(this, backend)
     }
@@ -131,9 +131,8 @@ class ListMagicLink extends Component {
             <div>
                 <Header> HackIt 管理后台 <Link to="/">Home</Link> </Header>
                 <Divider/>
-                <Header> 当前有 {ids.length} 个连接 </Header>
-                <ul>{ids}</ul>
-                <Link to="/mysys/8080"> 本地系统状态 </Link>
+                <Header> 当前有 {ids.length} 个有效连接 </Header>
+                <Link to="/mysys/7777"> 本地系统状态(localhost:7777) </Link>
             </div>
         );
     }

punch-server/ui/src/UserView.js

@@ -123,7 +123,7 @@ class ListConnection extends Component {
     tryGetDetailWidget() {
         const uuid = this.state.detail
         if (uuid) {
-            return <DetailView uuid={uuid} />
+            return <DetailView localServer={this.props.localServer} uuid={uuid} />
         }
         return null
     }
@@ -224,7 +224,7 @@ class DetailView extends Component {
         this.state = {
             backend: undefined
         }
-        const backend = new WebSocket(`ws://localhost:8080/tty/${props.uuid}`)
+        const backend = new WebSocket(`ws://${props.localServer}/tty/${props.uuid}`)
         backend.onopen = this.setBackend.bind(this, backend)
         backend.onclose = this.setBackend.bind(this, undefined)
     }

server/lib.go

@@ -68,7 +68,7 @@ func writeJSON(w http.ResponseWriter, code int, v interface{}) {
 
 func openUrl(url string) {
 	bin, err := exec.LookPath("xdg-open")
-	if err != nil || true {
+	if err != nil {
 		log.Printf("Please open %q to see more informations\n", url)
 	} else {
 		exec.Command(bin, url).Run()

server/server.go

@@ -7,17 +7,29 @@ import (
 	"io"
 	"net/http"
 	"os"
+	"time"
 )
 
 var (
-	PunchServerAddr = "localhost:2200"
-	LocalServerAddr = "localhost:8080"
+	PunchServerAddr = "hackit.snyh.org:2200"
+	LocalServerAddr = "localhost:7777"
 )
 
+func OpenBrowser() {
+	go func() {
+		time.Sleep(time.Millisecond * 500)
+		openUrl("http://hackit.snyh.org/mysys/7777")
+	}()
+}
+
 func main() {
 	if p := os.Getenv("PORT"); p != "" {
 		LocalServerAddr = ":" + p
 	}
+
+	fmt.Printf("开启本地监听%q，并连接到%q\n", LocalServerAddr, PunchServerAddr)
+	OpenBrowser()
+
 	m, err := NewManager(PunchServerAddr, LocalServerAddr)
 	if err != nil {
 		fmt.Println("ERR:", err)