教程: Play Framework 2 with Scala, Anorm, JSON, CoffeeScript, jQuery & Heroku

banq發表於2012-02-22
FrameworkORMJSONjQuery
一種全新的開發技術架構Play + Scala：教程: Play Framework 2 with Scala, Anorm, JSON, CoffeeScript, jQuery & Heroku，大概步驟：

1.下載安裝Play2 RC2

2.建立一個應用： play new foobar，提示中選擇Scala

3.在新建立的目錄foobar中生成IDE配置檔案，如使用IntelliJ，play idea；如是eclipse: play eclipsify

4.啟動Play伺服器:
play run
可在瀏覽器鍵入http://localhost:9000

5. Play 2 with Scala並不提供預設的ORM，使用的Anorm，Anorm並不是一個類似Hibernate的ORM，不能自動建立資料表結構，建立一個檔案：conf/evolutions/default/1.sql，在裡面寫入SQL語句：

# --- First database schema
 
# --- !Ups
 
CREATE TABLE bar (
  id                        SERIAL PRIMARY KEY,
  name                      VARCHAR(255) NOT NULL
);
 
# --- !Downs
 
DROP TABLE IF EXISTS bar;
<p class="indent">


Anorm能夠使用Scala的"case class"作為值物件，作為一個單例例項進行持久和CRUD的介面物件，建立一個Scala的Bar case class，檔名為：app/models/Bar.scala

package models
 
import play.api.db._
import play.api.Play.current
 
import anorm._
import anorm.SqlParser._
 
case class Bar(id: Pk[Long], name: String)
 
object Bar {
 
  val simple = {
    get[Pk[Long]]("id") ~
    get[String]("name") map {
      case id~name => Bar(id, name)
    }
  }
 
  def findAll(): Seq[Bar] = {
    //banq注： 直接進行資料庫操作，也夠醜陋的。
    DB.withConnection { implicit connection =>
      SQL("select * from bar").as(Bar.simple *)
    }
  }
 
  def create(bar: Bar): Unit = {
    DB.withConnection { implicit connection =>
      SQL("insert into bar(name) values ({name})").on(
        'name -> bar.name
      ).executeUpdate()
    }
  }
 
}
<p class="indent">


6.在conf/application.conf中配置一個記憶體h2資料庫資料來源：
db.default.driver=org.h2.Driver
db.default.url="jdbc:h2:mem:play"

7.建立一個應用控制器用來轉換Http請求到Bar物件，然後儲存到資料庫，app/controllers/Application.scala：

package controllers
 
import play.api.data.Form
import play.api.data.Forms.{single, nonEmptyText}
import play.api.mvc.{Action, Controller}
import anorm.NotAssigned
 
import models.Bar
 
 
object Application extends Controller {
 
   //將http請求資料進行驗證轉為Form物件
  val barForm = Form(
    single("name" -> nonEmptyText)
  )
 
  def index = Action {
    Ok(views.html.index(barForm))
  }
 
  //接受前臺新增Bar命令。
  def addBar() = Action { implicit request =>
    barForm.bindFromRequest.fold(
      errors => BadRequest,
      {
        case (name) =>
          //呼叫Bar內部儲存方法 資料庫儲存。
          Bar.create(Bar(NotAssigned, name))
          Redirect(routes.Application.index())
      }
    )
  }
 
}
<p class="indent">


8.建立一個對映POST請求路由到上面應用控制器，配置在"conf/routes":

POST    /addBar                     controllers.Application.addBar
<p class="indent">


9.編輯MVC的介面:app/views/index.scala.html

@(form: play.api.data.Form[String])
 
@main("Welcome to Play 2.0") {
 
    @helper.form(action = routes.Application.addBar) {
        @helper.inputText(form("name"))
        <input type="submit"/>
    }
 
}
<p class="indent">

在瀏覽器鍵入http://localhost:9000，進行資料庫構建，測試表單，如果一切正常，當按表單提交，應該轉到index頁面。

10.在app/controllers/Application.scala建立一個JSON服務用來獲得所有bar例項集合：

import com.codahale.jerkson.Json
 
  def listBars() = Action {
    val bars = Bar.findAll()
 
    val json = Json.generate(bars)
 
    Ok(json).as("application/json")
  }
<p class="indent">


將 “/listBars” 加入conf/routes:
GET /listBars controllers.Application.listBars

在瀏覽器測試http://localhost:9000/listBars

11.在app/assets/javascripts/index.coffee建立一個CoffeeScript 檔案使用jQuery抓取JSON包，遍歷Bar物件集合，逐個當前頁面顯示：

$ ->
  $.get "/listBars", (data) ->
    $.each data, (index, item) ->
      $("bars").append "<li>Bar " + item.name + "</li>"
<p class="indent">


12.修改app/views/index.scala.html，使用自動編譯的javascript原始碼：

<script src="@routes.Assets.at("javascripts/index.js")" type="text/javascript"></script>
 
    <ul id="bars"></ul>

在瀏覽器鍵入 http://localhost:9000 。

以上開發完成，可以使用Heroku部署到雲中。見原文。
<p class="indent">

相關文章