38
Help us understand the problem. What are the problem?

More than 5 years have passed since last update.

posted at

updated at

[SpringBoot]CORS対応で他サイトからのアクセスを許可

現象

@RestControllerを使ったWebAPIを作成していて、localhostで動作確認するためにjQueryでgetなりpostなりを実行するhtmlファイルを作ってローカル(fileプロトコル)で開いて実行すると、403 Method Not Allowed
GETもPOSTも許可しているはずなのに?と開発者ツールから通信の詳細を見ると、OPTIONSメソッドでアクセスしている。
ブラウザによっては何の問題もなく正常に動作しますが、FireFoxやChromeではダメでした。

原因

なんとなくセキュリティ関係の制限ぽい臭いがします。
というわけでよくよく調べるとやはりモダンブラウザでは別のサイトにアクセスしようとすると、アクセス許可の確認をするようになっているようです。
これはサイトをまたいだアクセス、Cross-Origin Resource Sharing (CORS)と言うそうで。

HTTP アクセス制御 (CORS) - Mozilla Developer Network

原因がわかれば対策が調べられる、ということでSpring Bootの場合はどうすればいいかを調べました。

結論

メソッドなりクラスなりに@CrossOriginアノテーションをつける。

Enabling Cross Origin Requests for a RESTful Web Service - Spring Guide

@RequestMapping(もちろん@GetMapping@PostMappingも)をつけているメソッドに@CrossOriginをつけるだけですね。

こんな感じ
import org.springframework.web.bind.annotation.CrossOrigin;
import org.springframework.web.bind.annotation.RequestBody;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RequestMethod;
import org.springframework.web.bind.annotation.RestController;

@RestController
@RequestMapping("/")
public class Hoge {

    @CrossOrigin
    @RequestMapping(value="/corstest", produces = "application/json; charset=utf-8", method={RequestMethod.POST,RequestMethod.GET})
    public String hoge() {
        return "OK!";
    }
}

上の例のように省略してしまうことも可能ですが、公式ガイドにあるようにアクセス許可する呼び出し元(Origin)を指定すればより安全ですね。

単にCORSと言ってもいろいろとあるようで、こちらの記事も参考になります。
CORSまとめ - Qiita

Why not register and get more from Qiita?
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away
Sign upLogin
38
Help us understand the problem. What are the problem?