React.js, SpringBoot, axios, CORS 에러

Question

import React, {useState, useEffect} from "react"; import axios from "axios"; function AxiosTest() { const [post, setPosts] = useState(''); console.log(post) const connection = () => { axios.get('http://localhost:8080/').then((response) => { setPosts(response.data); }).catch((error) => { setPosts(error.message); }) } useEffect(() => { connection(); }, []); return(

) } export default AxiosTest;package com.project.backend.controller; //import org.springframework.stereotype.Controller; import org.springframework.web.bind.annotation.CrossOrigin; import org.springframework.web.bind.annotation.GetMapping; import org.springframework.web.bind.annotation.RequestMapping; import org.springframework.web.bind.annotation.RestController; @CrossOrigin(originPatterns = "http://localhost:3000") @RestController @RequestMapping("/") public class BackendController { @GetMapping("") public String hello(){ return "Success"; } // @GetMapping("/main") // public String index() { // return "index"; // } // @GetMapping("/") // public String root() { // return "redirect:/index"; // } } http://localhost:3000/axiostest에 들어가서 실행하면Access to XMLHttpRequest at 'http://localhost:8080/' from origin 'http://localhost:3000' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.에러가 나옵니다.crossorgin어노테이션 사용해서 cors문제도 해결된 듯 한데 뭐가 문제일까요?

크리미드림 · Answer

https://developer.mozilla.org/en-US/docs/Web/HTTP/CORS

React.js, SpringBoot, axios, CORS 에러

1개의 답변

Q&A 목록