`
heoxsoft
  • 浏览: 12942 次
  • 性别: Icon_minigender_1
  • 来自: 潍坊
最近访客 更多访客>>
社区版块
存档分类
最新评论

揭秘 Compojure – Part 3

阅读更多

 

揭秘 Compojure – Part 3

 

在第二部分中我们学习了怎么使用Compojure建立了一个框架项目。在本节中我们开始在这个项目中加入一些静态的文件。

在该程序中,将使用JQuery做为前端,而Clojure作为后台,主要关注Compojure。

1) 在address_book目录下创建存放静态文件的文件夹。

1. mkdir public
2. mkdir public/css
3. mkdir public/js
静态文件最好是放在一个单独的目录中,并由webserver进行处理。当前我们使用Compojure来处理这些静态文件。

2) 在public下创建index.html

 

01	<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
02	    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
03	<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
04	    <head>
05	        <meta http-equiv="content-type" content="text/html; charset=utf-8" />
06	        <title>My Address book</title>
07	        <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
08	    </head>
09	 
10	  <body id="main">
11	    <p>
12	      My Address Book
13	    </p>
14	  <body>
15	</html>
 

 

 

3) 启动webserver

 

lein repl src/address_book/core.clj


4) 存取 index.html

在浏览器中打开 http://localhost:8080/index.html,就会出现 “Page not found” 的错误信息,而不是 “My Address Book”。 这是因为Compojure 还不知道如何处理静态文件夹。

辅助函数:

在Compojure 中需要添加两个路由辅助函数(route helper functions)。其中一个已经在 core.clj 中了

1) not-found :

Compojure使用这个函数来处理所有其他未被定义路由。而此时还没有定义index.html 所以就会出现

“Page not found”。

2) files :

这个函数用来通知Compojure需要做为静态文件处理的目录。

然后修改 core.clj 使其能处理静态文件。

 

01	(ns address_book.core
02	  (:use [compojure.core]
03	        [ring.adapter.jetty])
04	  (:require [compojure.route :as route]))
05	 
06	(defroutes example
07	  (GET "/" [] "<h1>My Address Book!</h1>")
08	  (route/files "/" {:root "public"})
09	  (route/not-found "Page not found"))
10	 
11	(run-jetty example {:port 8080})
 

重新启动server (我将在稍后的blog中介绍通过使用futures以避免每次修改后对server的重启) ,

存取http://localhost:8080/index.html。现在你应该能够看到“My Address Book”。

在这一部分中介绍了怎样处理静态文件。而在下一部分,我将开始实现Add,View,View All等功能。

PS: 我将在以后的帖子中介绍在Clojure 使用 Hiccup 来创建 HTML 和 css。

源码存放在 github . 每一部分对应一个分支。

 

分享到:
评论

相关推荐

Global site tag (gtag.js) - Google Analytics