연습 - CORS 구성
이번 연습에서는 로컬 Azure Functions에서 CORS(원본 간 리소스 공유)를 구성하고 Product Manager 애플리케이션을 구현합니다.
CORS 구성
api/local.settings.json
파일을 엽니다.“Values” 속성 ‘아래’에 “Host” 섹션을 추가합니다. “Host”에서 값을 “CORS” 값을 “*”로 설정합니다.
{ "IsEncrypted": false, "Values": { "AzureWebJobsStorage": "", "FUNCTIONS_WORKER_RUNTIME": "node", "AzureWebJobsFeatureFlags": "EnableWorkerIndexing", "CONNECTION_STRING": "PASTE YOUR CONNECTION STRING HERE" }, "Host": { "CORS": "*" } }
API가 여전히 실행 중인 경우 디버그 표시줄에서 연결 끊기를 선택하여 프로세스를 다시 시작한 다음 F5 키를 눌러 다시 시작합니다.
프런트 엔드 앱 확인
프런트 엔드 앱은 여전히 포트 5000의 브라우저 탭에서 실행되어야 합니다. 페이지를 새로 고칩니다.
앱이 API에서 데이터를 로드합니다.
모든 엔드포인트가 작동하도록 제품을 만들고, 업데이트하고, 삭제해 보세요.
앱이 정상적으로 보입니다. 매우 양호합니다. 뛰어난 API 없이는 어떤 것도 불가능합니다. 배운 내용을 테스트할 준비가 되었나요?