기록은 기억을 이기고 시간보다 오래 남는다.

API 2

[Vue/Spring boot]CORS 에러: 원인과 해결 방법

CORS는 브라우저가 보안 때문에 다른 도메인(출처) 간 리소스 요청을 제한하는 정책이야. 서버에서 CORS 설정 제대로 안 하면 브라우저가 요청 막아서 "CORS 에러"가 뜨지. 이 글에선 CORS 에러 원인과 해결 방법을 정리CORS 에러의 원인Access-Control-Allow-Origin 헤더 누락이나 설정 오류서버가 Access-Control-Allow-Origin 헤더를 응답에 포함 안 하거나 잘못 설정하면 발생함.프리플라이트(OPTIONS) 요청 설정 오류CORS는 HTTP OPTIONS 요청으로 서버가 요청 허용하는지 확인해. 이 설정 제대로 안 하면 에러가 남.인증과 쿠키 관련 문제인증 정보나 쿠키 포함된 요청 보낼 때, Access-Control-Allow-Credentials 헤더 ..

에러일지 2025.01.16

React에서 API 데이터를 불러오는 방법: 실전 가이드

React에서 API 데이터 불러오기: 실전 가이드React 애플리케이션에서 데이터를 불러와서 화면에 표시하는 것은 매우 중요한 작업 중 하나입니다.여기서는 fetch API를 사용하여 데이터를 불러오고, 이를 상태로 관리하는 방법을 설명합니다.예제로 사용할 코드는 jsonplaceholder.typicode.com에서 댓글 데이터를 불러오는 것입니다. import React, { useEffect, useState, useRef } from 'react';const App = () => { const [data, setData] = useState([]); const dataId = useRef(1); const getData = async () => { const res = await fe..

FRONT-END/React 2024.06.17