์ํฉ
์ผ๋ฌด์ง๊ฒ CORS๋ฅผ ๊ณต๋ถํ๊ณ ๋ธ๋ก๊ทธ์ ์ ๋ฆฌํ์ง๋ง,,
์ค์ ํ๋ก์ ํธ๋ฅผ ์งํํ๋ฉด์ CORS๊ฐ ๋ฐ์ํ๋๊น ํด๊ฒฐํ๋ ๋ฐ์ ํ์ฐธ ๊ฑธ๋ ธ๋ค.
์๋ฌ ์ฝ๋
Access to fetch at โhttp://localhost/8089/api/authโ from origin โhttp://localhost:8080โ has been blocked by CORS policy: No โAccess-Control-Allow-Originโ header is present on the requested resource. If an opaque response serves your needs, set the requestโs mode to โno-corsโ to fetch the resource with CORS disabled.
๋ฐ์ํ๋ ์ด์
์์ฒญ ์ถ์ฒ ๊ฐ ๋ฌ๋ผ์ ์๊ธด๋ค.
- ์ถ์ฒ๋ URL์ ํ๋กํ ์ฝ, ํธ์คํธ, ํฌํธ
ํด๊ฒฐ ๋ฐฉ๋ฒ
// /pages/api/index.js
const getAuth = (token) => axios.create({
baseURL: BASE_URL,
headers: {
"Content-Type": `application/json;charset=UTF-8`,
"Accept": "application/json",
"Authorization": "Bearer "+token,
// ์ถ๊ฐ
"Access-Control-Allow-Origin": `http://localhost:3000`,
'Access-Control-Allow-Credentials':"true",
}
})
addAllowedOrigin
์ผ๋ก ํ๋ก ํธ์๋ ์ถ์ฒ๋ฅผ ์ถ๊ฐํด์ฃผ์๋ค.// WebMvcConfig.java
package com.ssafy.config;
import com.ssafy.common.util.JwtTokenUtil;
import org.springframework.boot.web.servlet.FilterRegistrationBean;
import org.springframework.context.annotation.Bean;
import org.springframework.context.annotation.Configuration;
import org.springframework.web.cors.CorsConfiguration;
import org.springframework.web.cors.CorsConfigurationSource;
import org.springframework.web.cors.UrlBasedCorsConfigurationSource;
import org.springframework.web.filter.CommonsRequestLoggingFilter;
import org.springframework.web.servlet.config.annotation.ResourceHandlerRegistry;
import org.springframework.web.servlet.config.annotation.ViewControllerRegistry;
import org.springframework.web.servlet.config.annotation.WebMvcConfigurer;
import javax.servlet.Filter;
@Configuration
public class WebMvcConfig implements WebMvcConfigurer {
@Bean
public CorsConfigurationSource corsConfigurationSource() {
CorsConfiguration configuration = new CorsConfiguration();
// ์ถ๊ฐ
configuration.addAllowedOrigin("http://localhost:3000");
...
}
}