2017-03-05 6 views
1

問題:のスクリプトsrcタグはindex.htmlのページにありますが、ブラウザではこのスクリプトは読み込まれません(実際にロードされますが、index.htmlファイル0_0下の写真を参照)。質問は:どのように私のHTMLページ上の別のファイル(myscripts.js)にあるJavaScriptコードを使用することができますか?私は「解決策」を見つかりましたが、それが必要のように、私は完全に動作しないグーグルの間にGo私のHTMLページでJavaScriptコードを使用するにはどうすればいいですか

js file looks like html (index.html) file

。私だけのViewHandlerメソッドに次の行を追加:要約すると

index.html after adding line above

:この後

http.ServeFile(w, r, r.URL.Path[1:]) 

、プロジェクトは次のようになり始めた

私の目標は、HTMLを表示することですスクリプト/フォルダにあるjavascript関数を使用してください。

プロジェクト構造:

-scripts 
--myscripts.js 
-templates 
--index.html 
server.go 

Server.go:

func viewHandler(w http.ResponseWriter, r *http.Request) { 
    fmt.Println("listening . . .") 
      tpl.ExecuteTemplate(w, "index.html", nil) 
     } 

func main() { 

    http.HandleFunc("/", viewHandler) 
     http.ListenAndServe(":8080", nil) 
} 

myscripts.js:

function clickFunc(){ 
console.log("clicked") 
} 

のindex.html:

<head> 
<script type="text/javascript" src="scripts/myscripts.js"></script> 
</head> 
<body> 

<button onclick="clickFunc()">Click me</button> 

</body> 
</html> 
+0

rofl、 "http.ServeFile(w、r、r.URL.Path [1:])" - 覚え書きの例としてのメモリ。小さいあなたは間違いなく頭を悩ます。私のコード例:https://github.com/spouk/spoukfw/blob/master/spoukrender.go – Spouk

答えて

2

あなたはhttpパッケージを使用して、特定のディレクトリから静的ファイルを提供することができるはずです。例えば

func main() { 
    ScriptsDirectory := http.FileServer(http.Dir("scripts")) 
    http.Handle("/scripts", ScriptsDirectory) 

    log.Println("Listening at port 3000") 
    http.ListenAndServe(":3000", nil) 
} 

は、そのディレクトリから直接サーバーのファイルをできるようになります。

ここからindex.htmlページの/scriptsディレクトリをそのまま参照することができます。

Hereもこのテクニックが使用されるチュートリアルです。

+0

これに+1して、質問としてr.URL.Path [1:]を使用しないでください。ファイルシステム上のパスを直接選択するための入力。 –

+0

StaticFilesをScriptsDirectoryに置き換えることを正しく理解しましたか? テンプレートを使用して、javascriptでHTMLページを表示することができます: ' 私はFileServerを使用してファイルを提供できますが、テンプレートは提供できません。 どうにかして両方使うことはできますか? 1つのディレクトリ "scripts"のhtmlとfileserverのテンプレートと同じですか? – Illia

+0

@Illiaはキャッチのために感謝します。編集されました。 Golangは独自の魅力的なエンジンを提供しています。あなたは[ここ](https://golang.org/pkg/text/template/) – weqlix

関連する問題