Go语言 + Angular

14

我开始尝试使用 Go 和 Angular 进行开发,但我遇到了一个奇怪的问题……我猜只是少了一些细节,但我想不出来。

我正在使用https://github.com/julienschmidt/httprouter 作为 Go 的路由器...... 现在有了 Angular,我应该能够将 URL 复制并粘贴到浏览器中,然后 Angular 应该处理相应的路由,对吧?

我有一个“/login”路由。如果通过前端访问该路由,则可以正常工作...但是如果我在浏览器中输入“mypage.com/login”,则会得到404错误。

Go 路由基本上只做了这个:

router.NotFound = http.FileServer(http.Dir("./public"))

这适用于"/"路由,但对于其他任何内容都不适用。这似乎是正确的。但我该如何正确设置路由,以便Angular处理所有路由?


1
为什么这个被踩了?我有同样的问题!! - CESCO
5个回答

13

这是我正在使用标准Go库进行路由的方式,路由效果非常好。

请查看此处的Adapt函数

// Creates a new serve mux
mux := http.NewServeMux()

// Create room for static files serving
mux.Handle("/node_modules/", http.StripPrefix("/node_modules", http.FileServer(http.Dir("./node_modules"))))
mux.Handle("/html/", http.StripPrefix("/html", http.FileServer(http.Dir("./html"))))
mux.Handle("/js/", http.StripPrefix("/js", http.FileServer(http.Dir("./js"))))
mux.Handle("/ts/", http.StripPrefix("/ts", http.FileServer(http.Dir("./ts"))))
mux.Handle("/css/", http.StripPrefix("/css", http.FileServer(http.Dir("./css"))))

// Do your api stuff**
mux.Handle("/api/register", util.Adapt(api.RegisterHandler(mux),
    api.GetMongoConnection(),
    api.CheckEmptyUserForm(),
    api.EncodeUserJson(),
    api.ExpectBody(),
    api.ExpectPOST(),

))
mux.HandleFunc("/api/login", api.Login)
mux.HandleFunc("/api/authenticate", api.Authenticate)

// Any other request, we should render our SPA's only html file,
// Allowing angular to do the routing on anything else other then the api    
// and the files it needs for itself to work.
// Order here is critical. This html should contain the base tag like
// <base href="/"> *href here should match the HandleFunc path below 
mux.HandleFunc("/", func(w http.ResponseWriter, r *http.Request) {
    http.ServeFile(w, r, "html/index.html")
})

2
你可以直接使用 http 包。

索引页面

http.HandleFunc("/", func(w http.ResponseWriter, r *http.Request) {
    http.ServeFile(w, r, "./public/index.html")
})

这将在所有不匹配路由的请求上提供index.html文件。

文件服务器

http.Handle("/public/", http.StripPrefix("/public/", http.FileServer(http.Dir("./public"))))

这将从公共目录提供所有文件。
不要忘记启动您的服务器。
http.ListenAndServe(":8000", nil)

1
同样的问题,我访问"/login"页面时出现了404错误。 - user2515948
你还在使用httprouter吗? - jmaloney
1
是的,我在每个.js文件上都遇到了“Unexpected token <”错误。 - user2515948
听起来像是HTML文件被提供而不是JS文件。 - jmaloney
1
是的,我也遇到了“资源被解释为样式表,但传输的MIME类型为text/html”的问题... - user2515948
显示剩余3条评论

1
使用Goji微框架。

https://github.com/zenazn/goji

使用起来很容易

func render_html_page(w http.ResponseWriter, url string) {
    t, err := template.ParseFiles(url) 
    if err != nil {
        panic (err)
    }
    t.Execute(w, nil)
}

func index(c web.C, w http.ResponseWriter, r *http.Request) {
    render_html_page(w, "./public/index.html")
}

func main() {
        goji.Get("/", index)
        goji.Serve()
}

这段代码可行,你只需要导入相关模块即可。

0

我曾经遇到过完全相同的404问题。这是html5mode路由。你需要在app.yaml中告诉处理程序。在这里检查我的Tour of Heroes项目分支https://github.com/nurp/angular2-tour-of-heroes

将此添加到您的app.yaml中可能会解决问题。

- url: /.*
  static_files: index.html
  upload: index.html

0
请定义路由器的Notfound处理程序以提供Angular index.html文件。
import (
  "log"
  "net/http"

  "github.com/julienschmidt/httprouter"
)

func angularHandler(w http.ResponseWriter, r *http.Request) {
  http.ServeFile(w, r, "./public/index.html")
}

func main() {
  router := httprouter.New()

  // handle angular
  router.NotFound = http.HandlerFunc(angularHandler)

  // serve static files
  router.ServeFiles("/*filepath", http.Dir("./public"))

  log.Fatal(http.ListenAndServe(":3000", router))
}

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接