Javascript CORS 정책 문제

Question

현재 javascript에서 API를 사용해보고 있는 중인데 papago API를 사용 중에 CORS에 막혀 질문 드립니다. 찾아보니 가장 좋은 건 서버에서 허용해 주는 것 이고 그 외에 프록시 사용, 확장 프로그램을 사용해 보았지만 400에러가 발생하거나 여전히 CORS에 막혔습니다. 혹시 제가 해결 방법을 잘못 사용한 것일까요 아니면 안 되는 게 맞는 것 일까요. 그리고 해결 방안을 알려주시면 감사하겠습니다.Node.js같은 것들은 이걸 위해 잠깐 건드릴 것이 못 되는 것 같아 천천히 해보려 합니다.postman에서 테스트 할 때는 잘 사용되었습니다.프록시는 주소 앞에 붙여서 사용했습니다.사용한 프록시:https://api.allorigins.win/get?url&#61;https://cors.bridged.cc/ https://cors-anywhere.herokuapp.com/사용한 확장 프로그램: Allow CORS, CORS Unblockasync function translateWithPapago(text, sourceLang, targetLang) { const papago_client_id &#61; 'client id'; const papago_apiKey &#61; 'APIkey'; const papago_url &#61; 'https://naveropenapi.apigw.ntruss.com/nmt/v1/translation'; const params &#61; new URLSearchParams({ source: sourceLang, target: targetLang, text: text, }); try{ const response &#61; await fetch(papago_url, { method: 'POST', headers: { 'X-NCP-APIGW-API-KEY-ID': papago_client_id, 'X-NCP-APIGW-API-KEY': papago_apiKey, 'Content-Type': 'application/x-www-form-urlencoded', }, body: params }); if (!response.ok) { throw new Error(&#96;HTTP error! Status: ${response.status}&#96;); } const data &#61; await response.json(); papago.textContent &#61; data.message.result.translatedText; } catch (error) { console.error('Error:', error); }}

qwer1232 · Answer

파파고 지금 안되는것 아니에요? cors 자체는 브라우저에서 차단하는 것이니까 포스트맨은 브라우저에서 요청하는것이 아니니까 잘되는거구요 어쨋든간에 cors는 origin이 일치 하지 않는건데 , 서버에서 허용 해줘야 하는건데 지원종료되서 그런거 아닌감

soop · Answer

파파고에 API 쓰겠다고 하셔서 키 받으셨음? 보통 저런건 키를 받아서 사용을 하는 것임그게 없으면 허용되지 않았으니 cors 로 막힌거구용

ansdbduf · Answer

proxy

hong7friend · Answer

파파고 보안 이슈로 서버측에서민 호출 가능하고 cors이슈가 항상 따라왔던거 같습니다. 갠적으로 3개로 해결해 볼 수 있을 듯합니다.첫 번째는 서버 측 프록시:가장 안전하고 효과적인 방법Node.js, Express 등을 활용하여 간단하게 구현API 키를 안전하게 관리하고, 요청을 중계하는 역할두 번째는 클라이언트 코드 수정:프록시 서버를 통해 API 요청을 전달API 키를 노출하지 않도록 주의마지막 세 번째 서버리스 함수:간단한 기능 구현에 적합AWS Lambda, Google Cloud Functions 등 활용참고하세요.

Javascript CORS 정책 문제

4개의 답변

Q&A 목록