Binding.scala使用教程13--上传文件

binding.scala

package app

import com.thoughtworks.binding.dom
import org.scalajs.dom.FormData
import org.scalajs.dom.ext.Ajax
import org.scalajs.dom.raw.{Event, HTMLFormElement}
import org.scalajs.{dom => DOM}

import scala.scalajs.concurrent.JSExecutionContext.Implicits.queue
import scala.scalajs.js.JSON
import scala.util.{Failure, Success}

object View
{

  val submitForm =
  {
    event: Event =>
      event.preventDefault()  // 能避免 form 表单自动提交
      upload
  }

  @dom def css = <style>
  {
    """
    .fileinput-button {
             position: relative;
             display: inline-block;
             overflow: hidden;
         }

         .fileinput-button input{
             position:absolute;
            right: 0px;
             top: 0px;
             opacity: 0;
             -ms-filter: 'alpha(opacity=0)';
             font-size: 100px;
         }
    """
  }
  </style>

  def upload =
  {
    val fileObj =DOM.document.getElementById("upload").asInstanceOf[HTMLFormElement]
    val form =new FormData(fileObj)
    val result = Ajax.post("/upload", data = form)
    result.andThen
    {
      case Success(response) =>
        val json = JSON.parse(response.responseText)
        println(JSON.stringify(json))
      case Failure(exception)=>
        println("went some errors")
    }
  }
  @dom def render =
  {

    <div>
      {css.bind}
      <form id="upload"  enctype="multipart/form-data" method="post">
       <span class="ui primary button fileinput-button">
            <span>选择文件</span>
            <input type="file" name="file"  />
        </span>
      </form>
      <button class="ui violet basic button" onclick={submitForm}>提交</button>
    </div>
  }
}

flask

@app.route('/upload', methods=['POST'])
def upload():
    from os import path

    file = request.files['file']
    print(request.form)
    print(file.filename)
    base_path = path.abspath(path.dirname(__file__))
    upload_path = path.join(base_path, 'static\\upload\\')
    print(upload_path+file.filename)
    file.save(upload_path+file.filename)
    status = {
        "email": "e",
        "password": "p"
    }
    return json.dumps(status)