Category: Revel

画像uploadの確認画面で、uploadファイルがあればその画像を表示し、なければplaceholdの画像を表示したい

app.go
– filepathを””で宣言し、uploadファイルがあれば、保存するファイルパスに置き換える

　　　　　　　　　　　　　　　　filepath := ""
	if file1 != nil {
		fmt.Println(c.Params.Files["file1"][0].Filename)
		filename := c.Params.Files["file1"][0].Filename
		data, e := ioutil.ReadAll(file1)
		if e != nil {
			fmt.Println("error")
		}
		ioutil.WriteFile("public/tmp/" + filename, data, 777)
		filepath = "public/tmp/" + filename
	}

uploadconfirm.html
– if eq で値の中身を確認して条件分岐で表示する。 {{if .filepath == “” }}と書くとエラーになるので注意が必要

            <td>
              {{if eq .filepath ""}}
              <img src="http://placehold.jp/150x150.png" class="img-icon">
              {{ else }}
              <img src="{{ .filepath }}" width="150px" height="150px" class="img-icon preview1">
              {{end}}
              <div class=""></div>
            </td>

go本体では、if .filepath == “” という順番でかけるのに、templateでは if eq と書かなければダメなのは面白いですね。いっその事統一して欲しいですが…

test.html

<h1>テストデータのアップロードページ</h1>
    <form name="upload" method="POST" action="/test/upload" enctype="multipart/form-data">
      <input type="file"   name="imgFile"  accept="image/jpeg, image/png">
      <input type="submit" name="submit"   value="commit">
    </form>

App.go

import (
	"github.com/revel/revel"
	"app/app/models"
	"fmt"
	"os"
)

func (c App) Test() revel.Result {

	return c.Render()
}

func (c App) Upload(imgFile *os.File) revel.Result {
  fmt.Printf("imgFile => %v\n", imgFile)
  return c.Redirect(App.Test)
}

imgFile => &{0xc0000a85a0}

### 画像の保存
– ioutil.WriteFile(path, data, permission)で画像を保存する

import (
	"github.com/revel/revel"
	"app/app/models"
	"fmt"
	"io/ioutil"
	"os"
)

func (c App) Upload(imgFile *os.File) revel.Result {
  fmt.Println(c.Params.Files["imgFile"][0].Filename)
  name := c.Params.Files["imgFile"][0].Filename
  data, e := ioutil.ReadAll(imgFile)
  if e != nil {
	fmt.Println("error")
  }
  ioutil.WriteFile("public/tmp/" + name, data, 755)

  return c.Redirect(App.Test)

}

おおお、なんか久しぶりに感動した。

html
L 新しいパスワードと、パスワード確認のフォームを用意する
L radioボタンでchangeなら表示、not changeなら非表示

<tr>
            <td>Password</td>
            <td><input type="radio" name="password_change" value="n" checked>Not Change <input type="radio" name="password_change" value="y">Change
            <div class="changeterm displaynone">
              <input type="password" name="password" class="input" placeholder="new password"><br>
              <input type="password" name="password_confirm" class="input" placeholder="new password confirm">
                    </div>
            </td>
          </tr>

app.go
　 L passwordが4文字以上の場合は、Min()を使う
　　　L if文でpasswordとpassword_confirmが一致かではなく、requiredの中で一致するか確認する

func (c App) MypageConfirm(email string, message string, password string, password_confirm string) revel.Result {

	// 省略
	if len(password) > 0 {
		c.Validation.Min(len(password), 4).Message("Password must be more than 4 character")
		c.Validation.Required(password == password_confirm).Message("password and password confirmation must be same.")
	}

	// 省略
	return c.Render(name, email, message)
}

if文で書きたいところだが、変わってるなー

### revel-csrfをインストール
$ go get github.com/cbonello/revel-csrf

app/init.go

import (
	"github.com/revel/revel"
	"prd/app/controllers"
	"github.com/cbonello/revel-csrf" // 追加
	_ "github.com/revel/modules"

)
	revel.Filters = []revel.Filter{
		// 省略
		csrf.CSRFFilter, 			   // 追加
	}

*.html

      <form action="/mypage-confirm" method="post" enctype="multipart/form-data">
      <input type="hidden" name="csrf_token" value="{{ .csrf_token }}" />
      // 省略

CSRFがないと何か落ち着きませんが、あって良かったです。

c.Validation.Email(email)と書く

app.go

func (c App) MypageConfirm(email string, message string) revel.Result {

	name := c.Session["userName"]
	c.Validation.Required(email).Message("Email is required")
	c.Validation.Email(email).Message("Please enter in email format")

	if c.Validation.HasErrors(){
		c.Validation.Keep()
		c.FlashParams()
		return c.Redirect(App.Mypage)
	}

	return c.Render(name, email, message)
}

うん、良さそうではある

Go Revelでnavigationとside menuをテンプレート化したい
-> classでページによってis-activeと付与する箇所は、テンプレート側でセットできるようにする。

/app/views/menu.html

  <section class="main-content columns is-fullheight">
  <aside class="column is-3 is-narrow-mobile is-fullheight section is-hidden-mobile">
    <p class="menu-label is-hidden-touch">MENU</p>
    <ul class="menu-list">
      <li>
        <a href="/home" class="{{.home}}">
          <span class="icon"><i class="fa fa-home"></i></span> Home
        </a>
      </li>
      <li>
        <a href="#" class="">
          <span class="icon"><i class="fa fa-table"></i></span> Channel
        </a>

        <ul>
          <li>
            <a href="#" class="{{.ch1}}">
              <span class="icon is-small"><i class="fa fa-link"></i></span> Ch1
            </a>
          </li>
          <li>
            <a href="#" class="{{.ch2}}">
              <span class="icon is-small"><i class="fa fa-link"></i></span> Ch2
            </a>
          </li>
          <li>
            <a href="#" class="{{.ch3}}">
              <span class="icon is-small"><i class="fa fa-link"></i></span> Ch3
            </a>
          </li>
        </ul>
      </li>
      <li>
        <a href="#" class="{{.mypage}}">
          <span class="icon"><i class="fa fa-id-card"></i></span> MyPage
        </a>
      </li>
      <li>
        <a href="#" class="{{.doc}}">
          <span class="icon"><i class="fa fa-file-alt"></i></span> Document
        </a>
      </li>
      <li>
        <a href="#" class="{{.chat}}">
          <span class="icon"><i class="fa fa-comments"></i></span> Chat room
        </a>
      </li>
    </ul>
  </aside>

/app/views/App/Index.html

{{template "nav.html" .}}
{{set . "home" "is-active"}}
{{template "menu.html" .}}

/app/views/App/mypage.html

{{template "nav.html" .}}
{{set . "mapage" "is-active"}}
{{template "menu.html" .}}

昔1000ページぐらいのサイトを運営してた時に、12/31に1000ページのall right reserved 20XXを1000ページ修正してたの思い出した🤮🤮🤮
絶対テンプレートを使う