加载js文件时返回404错误。

huangapple go评论139阅读模式
英文:

returned 404 error when load js file

问题

当我尝试渲染包含一个指向js文件的脚本链接的html文件时,出现了错误。但是当我加载页面时,出现了以下错误:

  1. Started GET "/views/script.js" .... Returning 404

我的文件夹结构如下:

  1. |--todolist
  2. |--main.go
  3. |--views/
  4. |--index.html
  5. |--script.js

main.go

  1. package main
  2. import (
  3. "github.com/zenazn/goji"
  4. "html/template"
  5. "net/http"
  6. )
  7. func renderHTMLPage(w http.ResponseWriter, path string) {
  8. t, err := template.ParseFiles(path)
  9. if err != nil {
  10. panic(err)
  11. }
  12. t.Execute(w, nil)
  13. }
  14. func Index(w http.ResponseWriter, r *http.Request) {
  15. renderHTMLPage(w, "./views/index.html")
  16. }
  17. func main() {
  18. goji.Get("/", Index)
  19. goji.Serve()
  20. }

views/index.html

  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="UTF-8">
  5. <title>Le titre du document</title>
  6. </head>
  7. <body>
  8. <script src="https://code.jquery.com/jquery-1.10.2.js"></script>
  9. <script src="script.js"></script>
  10. <h1>To-Do List </h1>
  11. <ul id="todolist">
  12. <li> Hello <button>Delete</button></li>
  13. <li> Wesh <button>Delete</button></li>
  14. </ul>
  15. <input type="text" id="new-text" /><button id="add">Add</button>
  16. </body>
  17. </html>

views/script.js

  1. function addListItem() {
  2. var text = $('#new-text').val()
  3. if (text != "") {
  4. $('#todolist').append('<li>'+text+'<button id="dede" name=\"' + i + '\">Delete</button></li>')
  5. }
  6. $('#new-text').val("")
  7. }
  8. function deleteItem() {
  9. $(this).parent().remove()
  10. }
  11. $(function() {
  12. $('#add').on('click', addListItem);
  13. $("#todolist").on("click", "#dede", deleteItem)
  14. });

我该如何使它正确加载js文件?

创建一个仅使用jQuery/JavaScript和Golang API的应用程序的最佳方法是什么?

谢谢。

英文:

I get an error when i would like to render html file which contains a script link on js file.
But when i load page i get this error :

  1. Started GET "/views/script.js" .... Returning 404

my folder is like this

  1. |--todolist
  2. |--main.go
  3. |--views/
  4. |--index.html
  5. |--script.js

main.go

  1. package main
  2. import (
  3. "github.com/zenazn/goji"
  4. "html/template"
  5. "net/http"
  6. )
  7. func renderHTMLPage(w http.ResponseWriter, path string) {
  8. t, err := template.ParseFiles(path)
  9. if err != nil {
  10. panic(err)
  11. }
  12. t.Execute(w, nil)
  13. }
  14. func Index(w http.ResponseWriter, r *http.Request) {
  15. renderHTMLPage(w, "./views/index.html")
  16. }
  17. func main() {
  18. goji.Get("/", Index)
  19. goji.Serve()
  20. }

views/index.html

  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="UTF-8">
  5. <title>Le titre du document</title>
  6. </head>
  7. <body>
  8. <script src="https://code.jquery.com/jquery-1.10.2.js"></script>
  9. <script src="script.js"></script>
  10. <h1>To-Do List </h1>
  11. <ul id="todolist">
  12. <li> Hello <button>Delete</button></li>
  13. <li> Wesh <button>Delete</button></li>
  14. </ul>
  15. <input type="text" id="new-text" /><button id="add">Add</button>
  16. </body>
  17. </html>

views/script.js

  1. function addListItem() {
  2. var text = $('#new-text').val()
  3. if (text != "") {
  4. $('#todolist').append('<li>'+text+'<button id="dede" name=\"' + i + '\">Delete</button></li>')
  5. }
  6. $('#new-text').val("")
  7. }
  8. function deleteItem() {
  9. $(this).parent().remove()
  10. }
  11. $(function() {
  12. $('#add').on('click', addListItem);
  13. $("#todolist").on("click", "#dede", deleteItem)
  14. });

How can I do to make it properly load the js file ?

And what is the best way to create an app who use only jquery/javascript with a golang api on architecture ?

Thank you

答案1

得分: 1

你需要做以下操作之一:

  • 从包含/views目录的路径提供服务 - 例如 goji.Get("/views/*", http.FileServer(http.Dir("/Users/matt/Desktop/views/")))
  • 使用http.StripPrefix(推荐)

下面的代码允许你将路径与目录名称解耦:

  1. func main() {
  2. goji.Get("/views/*", http.StripPrefix("/views", http.FileServer(http.Dir("/Users/matt/Desktop/views/"))))
  3. goji.Get("/", Index)
  4. goji.Serve()
  5. }

我建议不要从根目录/*提供服务,最好从专用的资源路径提供服务,这样在缓存、与CDN交互等方面更容易处理。

英文:

You need to either:

  • Serve from the directory containing /views - e.g. goji.Get("/views/*", http.FileServer(http.Dir("/Users/matt/Desktop/views/")))`
  • Use http.StripPrefix (recommended)

The below allows you to decouple the path from the directory name:

  1. func main() {
  2. goji.Get("/views/*", http.StripPrefix("/views", http.FileServer(http.Dir("/Users/matt/Desktop/views/"))))
  3. goji.Get("/", Index)
  4. goji.Serve()
  5. }

I'd recommend against serving from the 'root' - /*. Better to serve from a dedicated assets path as it makes it easier when looking at caching, interacting with CDNs, etc.

答案2

得分: 0

在这种特殊情况下,代码应该如下所示:

  1. goji.Get("/", Index)
  2. goji.Get("/*", http.FileServer(http.Dir("./views")))
  3. goji.Serve()

但是我必须说,将模板文件和静态文件保存在同一个目录中并从根目录提供静态文件是一个不好的主意。

英文:

In this particular case code should look like

  1. goji.Get("/", Index)
  2. goji.Get("/*", http.FileServer(http.Dir("./views")))
  3. goji.Serve()

But I must say keeping template and static files in same directory is bad idea as well as serving static files from root.

huangapple
  • 本文由 发表于 2016年2月26日 04:03:20
  • 转载请务必保留本文链接:https://go.coder-hub.com/35637196.html
匿名

发表评论

匿名网友

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen:

确定