MultipartFileで画像登録したいです！

Question

前提・実現したいこと

情報登録データを作っているのですが、
MultipartFileで画像登録をnew,createで作成時に一緒に挿入したいです！

entity

public class Book {
  private int id;
  private String title;
  private String author;
  private String publisher;
  private Date   buyDate;
  private Date   releaseDate;
  private String genre;
  private String overView;
  private MultipartFile bookImage;

  public int getId() {
    return id;
  }
  public void setId(int id) {
    this.id = id;
  }

  public String getTitle() {
    return title;
  }
  public void setTitle(String title) {
    this.title = title;
  }

  public String getAuthor() {
    return author;
  }
  public void setAuthor(String author) {
    this.author = author;
  }

  public String getPublisher() {
    return publisher;
  }
  public void setPublisher(String publisher) {
    this.publisher = publisher;
  }

  public Date getBuyDate() {
    return buyDate;
  }
  public void setBuyDate(Date buyDate) {
    this.buyDate = buyDate;
  }

  public Date getReleaseDate() {
    return releaseDate;
  }
  public void setReleaseDate(Date releaseDate) {
    this.releaseDate = releaseDate;
  }

  public String getGenre() {
    return genre;
  }
  public void setGenre(String genre) {
    this.genre = genre;
  }

  public String getOverView() {
    return overView;
  }
  public void setOverView(String overView) {
    this.overView = overView;
  }

  public MultipartFile getBookImage() {
    return bookImage;
  }

  public void setBookImage(MultipartFile bookImage) {
    this.bookImage = bookImage;
  }


}

controller

    @Controller
@RequestMapping("/books")
public class BookController {



  private final BookService bookService;

  
  @Autowired
    public BookController(BookService bookService) {
        this.bookService = bookService;
    }
  
  @GetMapping
  public String index(Model model) {
    List<Book> book = bookService.findAll();
    model.addAttribute("book", book);
    return "books/index";
  }


  @GetMapping("new")
  public String newBook(@RequestParam("bookImage") MultipartFile bookImage, Model model) {
    bookImage.getOriginalFilename();
      return "books/new";
  }

  @PostMapping
	public String create(@ModelAttribute("book") @Validated Book book, BindingResult result, Model model) {
		if (result.hasErrors()) {
			return "books/new";
		} else {
			bookService.save(book);
			return "redirect:/books";
		}
  }



  @GetMapping("{id}")
	public String show(@PathVariable int id, Model model) {
    bookService.findOne(id).ifPresent(o -> model.addAttribute("book", o));
		return "books/show";
	}
  
  
	@GetMapping("{id}/edit")
	public String edit(@PathVariable int id, @ModelAttribute("book") Book book, Model model) {
    model.addAttribute("selectBooks",getGenre());
   //上のshowメソッドと同じ
    bookService.findOne(id).ifPresent(o -> model.addAttribute("book", o));
		return "books/edit";
	}
  
  @PostMapping("{id}")
  public String update(@PathVariable int id, @ModelAttribute("book") @Validated Book book, BindingResult result, Model model){
    if (result.hasErrors()) {
			model.addAttribute("book", book);
			return "edit";
		} else {
			book.setId(id);
			bookService.update(book);
			return "redirect:/books";
		}
  }
  
  @DeleteMapping("{id}")
	public String delete(@PathVariable("id") int id) {
    Book book = bookService.findOne(id).get();
    if(book == null){
      return "";
    }
		bookService.delete(id);
		return "redirect:/books"; 
  }

}

html

          <form th:action="@{/books}" th:method="post" enctype="multipart/form-data">


          <input class="form-control" type="file" name="bookImage" />
 

        <div class="form-group">
          <label class="control-label">タイトル</label>
          <input class="form-control" type="text" name="title" />
        </div>
        <div class="form-group">
          <label class="control-label">著者</label>
          <input class="form-control" type="text" name="author" />
        </div>
        <div class="form-group">
          <label class="control-label">出版社</label>
          <input class="form-control" type="text" name="publisher" />
        </div>
        <div class="form-group">
          <label class="control-label">購入日</label>
          <input class="form-control" type="date" name="buyDate" />
        </div>
        <div class="form-group">
          <label class="control-label">発売日</label>
          <input class="form-control" type="date" name="releaseDate" />
        </div>

        <div class="form-group">
          <label class="control-label">ジャンル</label>
          <select name="genre">
            <option value="">---</option>
            <option th:each="book : ${selectBooks}" th:value="*{book.value}"
             th:text="*{book.value}" th:selected="*{book.value} == *{selectBooks}"  ></option>
          </select>
        </div>

        <div class="form-group">
          <label class="control-label">概要</label>
          <input class="form-control" type="text" name="overView" />
        </div>
        
        <button class="btn btn-default" type="submit">作成</button>
      </form>


      <div class="pull-right">
        <a class="btn btn-link" href="/books">一覧画面へ</a>
      </div>
    </div>
  </body>
</html>

repository

@Repository
public class BookRepositoryImpl implements BookRepository{
  

  @Autowired
  private final JdbcTemplate jdbcTemplate;

  @Autowired
  public BookRepositoryImpl(JdbcTemplate jdbcTemplate) {
    this.jdbcTemplate = jdbcTemplate;
  }


  @Override
  public List<Book> findAll() {

    String sql = "SELECT book.id, title, author, publisher, buy_date, release_date, genre, over_view, book_image FROM Book";
    
    return jdbcTemplate.query(sql,new BeanPropertyRowMapper<Book>(Book.class));
    
  }


    @Override
    public Optional<Book> findOne(int id) {
      
      String sql = "SELECT book.id, title, author, publisher, buy_date, release_date, genre, over_view, book_image FROM book "
        + "WHERE id = ?";
        
      Map<String, Object> result = jdbcTemplate.queryForMap(sql, id);

        Book book = new Book();
        book.setId((int)result.get("id"));
        book.setTitle((String)result.get("title"));
        book.setAuthor((String)result.get("author"));
        book.setPublisher((String)result.get("publisher"));
        book.setBuyDate((Date)result.get("buy_date"));
        book.setReleaseDate((Date)result.get("release_date"));
        book.setGenre((String)result.get("Genre"));
        book.setOverView((String)result.get("over_view"));
        book.setBookImage((MultipartFile)result.get("book_image"));
        System.out.println(result);
        //bookをOptionalでラップする
        Optional<Book> bookOpt = Optional.ofNullable(book);
        return bookOpt;
	}

      @Override
      public void save(Book book) {
        jdbcTemplate.update("INSERT INTO book(title, author, publisher, buy_date, release_date, genre, over_view, book_image) VALUES(?, ?, ?, ?, ?, ?, ?, ?)",
        book.getTitle(), book.getAuthor(), book.getPublisher(), book.getBuyDate(), book.getReleaseDate(), book.getGenre(), book.getOverView(), book.getBookImage() );
      }
      
      
      @Override
      public int update(Book book) {
        return   jdbcTemplate.update("UPDATE book SET title = ?, author = ?, publisher = ?, buy_date = ?, release_date = ?, genre = ?, over_view = ?, book_image = ? WHERE id = ?",
        book.getTitle(), book.getAuthor(), book.getPublisher(), book.getBuyDate(), book.getReleaseDate(), book.getGenre(), book.getOverView(), book.getId() );
      }

      @Override
      public int delete(int id) {
        return jdbcTemplate.update("DELETE FROM book WHERE id = ?", id);
      }

    }

現在は
Unresolved compilation problem: The method upload(MultipartFile, Model) in the type BookController is not applicable for the arguments ()
こういったエラーが出ます。

編集後
Current request is not a multipart requestのエラー
やはり似たエラーなので原因はほぼ同じだと思っています。

multipartFileこの引数がおかしいのかなと思ってますが解決に至りません。
何方かわかりますか？

Answer 1

Controllerクラスにて、

private String upload(@RequestParam("imgFile") MultipartFile multipartFile, Model model)

public ではないでしょうか。

Comments

[aoinosuke]

ありがとうございます。
ですがエラー文は変わりませんでした。
newメソッドに引数でuploadを貰うという、考え方としてはあってますか？

[A-pZ]

コンパイルエラーが検出されていますので、Controllerは抜粋ではなく、全体を記載すると他になにか問題のある箇所が見つかるかもしれません。

[aoinosuke]

畏まりました。

[aoinosuke]

一旦整理して、情報を全部出させていただきました。
あれから進んでいまして、少し変更箇所ありますが、質問内容は変わっておりませんのでご了承をお願いいたします。

[aoinosuke]

いまだ解決せずです！
何方かどうぞよろしくお願いします！

[A-pZ]

エラー内容とControllerの実装があっていませんが、

HTMLのformで th:action="@{/books}" th:method="post" enctype="multipart/form-data" と指定しているので、これに対応するControllerのメソッドは例えば以下のようになります。

@PostMapping("/books")
public ModelAndView upload(MultipartFile bookImage, ModelAndView mnv, .......) {

}

Answer 2

formの入れ子はできません。

Comments

[aoinosuke]

ありがとうございます
```

<div class="form-group">
<label class="control-label">画像</label>
<form method="POST" enctype="multipart/form-data"></form>
<input class="form-control" type="file" name="imgFile" />
</div>

<form th:action="@{/users}" th:method="post">
<div class="form-group">
<label class="control-label">名前</label>
<input class="form-control" type="text" name="name" />
</div>
<button class="btn btn-default" type="submit">作成</button>
</form>
```

ずらしてみました。

[m.ts10806]

そういうことじゃないですし、formタグ内にないものは送信されません。「作成」ボタンで送信したいのでしたらfileも同じform内にいれる必要がありますし、そのformにenctypeを指定する必要があります。

[aoinosuke]

<form th:action="@{/users}" th:method="post" enctype="multipart/form-data">
<div class="form-group"></div>
<input class="form-control" type="file" name="imgFile" />
</div>

こうですね！
ありがとうございます。
一つ進んで助かりました。
あとは引数エラーのみになりますが、
続けての質問恐縮ですが何かヒント等ありますか？