인프런 커뮤니티 질문&답변
작성한 질문수
API와 DB연결
해결된 질문
작성
·
223
0
안녕하세요,
API와 DB 연결을 다루는 강의를 시청 중
강의 11분 50초 정도에 웹소켓 연결이 안 되는 문제가 생겨 질문 드립니다!
코드를 전부 똑같이 따라 작성하고 있음에도 왜 localhost 7071로 경로 수정 후 연결이 되지 않는지 모르겠습니다..
해결 방안이 있을지 여쭙고 싶습니다!
답변 2
0
안녕하세요. 확인이 늦어 죄송합니다.
저도 AI의 의견과 비슷합니다. 강의 내 해당 CORS 오류 해결을 위한 내용까지도 포함되어있는데, 혹시 해당 내용 모두 시도해봤는데도 안되는건지 재확인 부탁드려도 될까요?
현재 상황을 좀 더 자세히 알려주실 수 있을까요? 프론트 파일에서 채팅을 쳤는데 API의 라이브 메트릭에 응답이 없다면, 프론트에서 API로 요청을 아예 전달하지 못한 경우를 생각해볼 수 있습니다.
따라서 해당 브라우저의 개발자 도구를 켜셔서, Network 탭을 확인한 뒤, 채팅을 쳤을 때 API 요청을 보내는지부터 확인해보시면 좋을 듯 합니다.
만약 요청을 보내고 있는데 라이브 메트릭의 응답이 없다면 도메인은 정확한지, CORS에 막혔는지 등등을 확인해보고, 모두 정확한데도 라이브 메트릭에 응답이 없다면 그건 그냥 라이브 메트릭에 찍힐 때 까지의 지연시간이 긴 것일수도 있습니다.
저는 현재 'ServiceBus와 Azure Function 연결하기' 강의의 15분 쯤을 따라가는 중입니다!
1) 네트워크 탭을 확인 결과 '200 OK'가 뜨는 것으로 보아 API 요청을 보내고 있는 것 같습니다!
2) 도메인은 네트워크 탭의 요청 URL을 확인 해보면 되는 것일까요? 만약 맞다면 도메인은 정확한 것 같습니다!
3) CORS에 막혔는지는 콘솔창에 뜨는 CORS 관련 오류 메시지를 확인 해보면 되는 것일까요? 만약 맞다면 CORS에 막히지는 않았습니다.
4) agent-function 라이브 메트릭에는 계속 해보아도 응답이 없지만 api-function 라이브 메트릭에는 응답이 있습니다. ( 이건 단서가 될까 말씀드려 봅니다ㅎㅎ )
혹시 api 나 agent 코드 중 실행( run ) 시키고 있어야 하는 코드가 있을까요...?
둘 다 서버에 배포하셨다면, 둘 다 로컬에서 실행시키실 필요는 없습니다.
API-Function의 메트릭에는 응답이 있으나, Agent-Function 라이브 메트릭에는 응답이 없다면, Agent에서 Service Bus의 데이터를 빼오지 못하고 있다는것을 의미합니다.
따라서 다음과 같은 해결책을 생각해볼 수 있습니다.
1. Service Bus 리소스의 큐를 확인하여, 활성 메시지가 있는지 확인한다.
1-1. 있다 -> Agent에서 못가져가는게 맞음
1-2. 없다 -> API에서 MQ에 못넣는중인 상황
1-1의 경우, Agent가 제대로 개발되었는지, 로컬에서 실행했을때는 Queue의 메시지를 빼올 수 있는지, Agent의 환경변수가 제대로 설정되었는지 등을 확인해보시고,
1-2의 경우 로컬에서 실행했을 때 API에서 MQ로 데이터를 제대로 넣는지 확인해보시면 해결이 될 듯 합니다.
만약 접근 방법을 잘 모르시겠으면 다시 한번 댓글 부탁드립니다. 디스코드 혹은 원격 플랫폼을 통해 화면을 확인하며 알려드리겠습니다. 화이팅입니다!
1. Service Bus 리소스의 큐를 확인하여, 활성 메시지가 있는지 확인한다.
1-1. 있다 -> Agent에서 못가져가는게 맞음 ( 이 상황입니다! )
<1-1의 경우>
1) Agent가 제대로 개발되었는지
>> 개발에는 문제가 없는 것 같습니다.
2) 로컬에서 실행했을때는 Queue의 메시지를 빼올 수 있는지
>> 혹시 이건 어떻게 확인해보면 되는 것인지 조금 더 자세히 말씀해 주실 수 있을까요...ㅠㅠ
3) Agent의 환경변수가 제대로 설정되었는지 등을 확인
>> api 함수를 만들 때도 스토리지 과정이 없었는데 커뮤니티의 다른 분께서,
Azure 포탈 > 함수 앱 > 설정 > 환경 변수 에서 AzureWebJobsStorag에 스토리지 계정 > 액세스 키 > key1의 연결 문자열을 복사해 넣으면 된다고 하셔서 그대로 했었습니다.
그래서 agent 함수를 만들 때도 동일하게 진행했는데 이것이 문제가 될까요...?
제가 밖이라 집에 들어가면 자세히 설명드리겠습니다 ㅠㅠ
1-2의 경우, Agent를 로컬에서 실행시켰을 때 로그를 확인해서 Service Bus에 있는 메시지를 잘 가져오고있는지 확인하면 됩니다.
그냥 로그를 보면 메시지가 쭉쭉 오는걸 확인하실 수 있을거에요!
사진을 포함한 자세한 답변은 밤에 집 들어가면 작성 드리겠습니다 ㅠㅠ
답변이 늦어 죄송합니다 ㅠㅠㅠ
그렇다면 해당 경우 Agent Function의 배포 과정 중 문제가 발생한 듯 합니다.
Agent Function에서, 저렇게 함수가 있는지부터 확인을 해보시고, 그 다음에는
왼쪽의 Monitoring -> Application Insights를 통해 리소스로 이동해줍니다.
이후 Transaction Search에 가보시면 로그가 있을텐데, 해당 로그를 분석하다보면 될 듯 합니다.
Azure Function이 배포가 잘 되었는지, 로그는 뭐가 남아있는지 확인해보시면 될 듯 합니다.
함수가 없어서 재배포 했더니 해결되었습니다!!!!!
정말 감사드립니다ㅠㅠ
강사님 혹시 강의 내용과 관계없는 질문 몇 가지 드려도 될까요?
1) 모든 도메인 명에 제 이름의 일부를 넣었는데 위험한 일일까요?
2) 깃허브에 퍼블릭으로 코드를 올리면 모든 방문자가 이 앱을 사용할 수 있을까요?
3) 프론트 코드만 리팩토링 후 깃허브에 올리고 라이센스를 걸어도 될까요?
( 만약 안된다면 출처를 밝히고 라이센스를 걸어도 되나요? )
초성 정도라면 상관없겠지만, 이름은 위험해보입니다.
깃허브에 퍼블릭하게 올리지 않더라도 프론트 파일의 URL만 있다면 모든 방문자가 웹 사이트를 사용할 수 있겠지요!?
혹시 고고링님께서 여쭤보고 싶으셨던 질문이 "깃허브에 퍼블릭으로 코드를 올리면 모든 방문자가 코드를 통해 배포를 진행할 수 있을까요?" 일까요? 이에 대한 답변도 추가로 작성하자면.. 해보셔서 아시겠지만, 단순 초심자는 불가능할 듯 하고, Azure를 사용해보신분들께서는 배포가 가능하지 않을까 싶습니다.
다만, local.settings.json 파일의 경우 기본적으로 .gitignore에 들어가있고, 어떤 환경변수가 필요한지 README 파일에 미리 작성해두어야 배포가 가능할 듯 합니다. 아니라면 배포할 사람이 코드를 뒤져가면서 어떤 환경변수가 필요한지 찾아야겠지요!원래는 어떤 라이센스를 걸어도 될 지 까지 질문해주시는게 좋으나..! 제 경우는 상업적 용도로 사용해도 상관없기에 어떠한 라이센스를 사용하시더라도 괜찮을 듯 합니다. 다만 출처를 밝혀주실 수 있을까요!? 강의의 홍보에 도움이 되었으면 좋겠습니다 ㅠㅠㅠ
강의와 무관한 내용 얼마든지 질문주셔도 괜찮습니다 ㅋㅋㅋ 제가 답변드릴 수 있는 범위 내라면 얼마든지 답변 드릴게용!
이런 질문들에도 자세히 답변해주셔서 감사합니다ㅠㅠ
혹시 추가로 질문드려도 될까요..?
1-1) 강사님 성함을 예로 들어 'hyunggpt' 식의 이름을 사용했는데 이 정도도 어떤 부분에서 위험요소가 될 수 있을까요?
1-2) 만약 도메인 명을 전부 수정하고 싶다면 강의의 처음부터 다시 만들어야 하는 걸까요..?
( 지금은 섹션 6의 'Response Function 만들기' 만을 남겨두고 있는데요..ㅠㅠ)
2) 깃허브에 작성한 모든 코드를 올린다면 그 코드안에 프론트 파일의 URL이 담겨있나요..?
아니면 코드를 올리더라도 따로 프론트 파일의 URL을 리드미에 작성해 넣어야 하는 걸까요..?
3) 네 출처 남기겠습니다!! 라이센스는 MIT 사용 예정입니다!! ㅎㅎ
앗 2번 더 자세히 말씀드리겠습니다!!
깃허브에 제가 프론트 코드, api 코드, agent 코드.... 등을 전부 올릴 때
제가 만약 프론트 파일의 URL을 따로 남겨두지 않았다면
이 웹을 사용해보고 싶은 사용자는 어떻게 사용해볼 수 있나요?
코드를 다운받아서 로컬에서 여는 방법 뿐인가요?? ( 다운 받는 방법은 있나요..? )
Azure에 배포한 이후에는 뭔가 공식 URL 같은 게 있었는데 그걸 리드미에 넣어야 할까요?
따로 목적이 있는 질문은 아닙니다! 단지 사용자는 어떻게 코드만 있을 때 웹을 사용할까?
궁금할 뿐입니다ㅎㅎ ( 제가 다른 분들의 깃허브에 올라온 웹, 앱을 사용해본 적이 없어서요.. )
감사합니다ㅠㅠ
1-1) 그정도도 역시 문제없을 듯 합니다.
1-2) Azure Front Door를 사용한다던가, Azure Function 내 "설정 - 커스텀 도메인" 쪽을 확인하시면 아예 커스텀 도메인을 등록할수도 있습니다. 다만, 기본적으로 제공해주는 도메인을 바꾸고싶으시다면 다시 만드는 수 밖에 없습니다 ㅠㅠ
2) 로컬에서 다운받아서 여는방법 뿐입니다. 말씀해주신 내용이, 네이버의 소스코드를 갖고있는데, "www.naver.com"이라는 주소를 알려주지 않았다면 네이버에 어떻게 접속하는가? 입니다. 방문하는 유저가 "www.naver.com"이라는 도메인을 모르니, 결국 네이버의 소스코드를 열심히 배포해서 열어야겠지요..! 프론트 파일의 도메인만 제공하면 방문자들이 쉽게 확인할 수 있을거라 생각합니다.
3) 넵 감사합니다!
더 필요하신 질문 있으시면 언제든지 편하게 질문 주세요!! 정말 괜찮습니다!
감사합니다 강사님 완강했습니다~!!
배포 후 잘 돌아가는 걸 보니 너무 뿌듯합니다ㅠㅠ
개발은 처음이라 이해가 잘 안돼도 따라 만들기 급급했어서
여러번 다시 시청하며 이해해볼 생각입니다!!
이렇게 친절하신 강사님과 소통하면서 완성할 수 있어서 너무 운이 좋았네요..ㅠㅠ
후속 강의가 나온다면 젤 먼저 들으러 달려오겠습니다><
너무 감사드립니다!! 새해 복 많이 받으세요~!!
0
안녕하세요, 인프런 AI 인턴입니다.
고고링님, 강의를 수강하시면서 API와 DB 연결에서 웹소켓 연결 문제가 발생한 것 같아요. 첨부하신 이미지와 설명을 바탕으로, 아래 몇 가지 점을 확인하시길 권장드립니다.
- CORS 설정 확인:
- 웹소켓 연결 시 ‘Access-Control-Allow-Origin’ 헤더가 필요하여 CORS 정책에 의해 차단되는 경우가 많습니다. API 서버 코드에서 CORS 설정을 확인하고, 필요한 경우 모든 도메인을 허용하거나 특정 도메인만 허용하도록 설정해야 합니다.
- FastAPI의 경우,
CORSMiddleware를 활용하여 CORS를 설정할 수 있습니다.
- 웹소켓 연결 시 ‘Access-Control-Allow-Origin’ 헤더가 필요하여 CORS 정책에 의해 차단되는 경우가 많습니다. API 서버 코드에서 CORS 설정을 확인하고, 필요한 경우 모든 도메인을 허용하거나 특정 도메인만 허용하도록 설정해야 합니다.
예제:
from fastapi.middleware.cors import CORSMiddleware
app.add_middleware(
CORSMiddleware,
allow_origins=["*"], # 모든 도메인을 허용하려면 ["*"]
allow_credentials=True,
allow_methods=["*"],
allow_headers=["*"],
)
API 서버 실행 상태 확인:
http://localhost:7071에서 API 서버가 정상적으로 실행 중인지 확인해 주세요. 터미널에서 서버가 정상적으로 작동하는지, 오류 메시지가 없는지 확인해야 합니다.
포트 설정 충돌 확인:
- 포트
7071이 이미 다른 애플리케이션에 사용되고 있지는 않은지 점검이 필요합니다. 포트가 충돌하면 웹소켓 연결에 문제가 발생할 수 있습니다.
- 포트
네트워크 요청 문제:
- 브라우저의 네트워크 탭에서 요청이 어떻게 처리되고 있는지 확인해 보세요. 응답 본문이나 헤더에서 더 많은 정보를 확인할 수 있습니다.
- 브라우저의 네트워크 탭에서 요청이 어떻게 처리되고 있는지 확인해 보세요. 응답 본문이나 헤더에서 더 많은 정보를 확인할 수 있습니다.
관련 토론과 해결 방법은 아래 링크들을 참고해 주세요:
위의 링크들에서 비슷한 상황에서 해결된 사례들을 확인해 보시면 도움이 될 것입니다. CORS와 관련해서는 특히 많은 도움이 될 것 같습니다.
저는 질문자님의 이해를 돕고자 지식공유자님의 기존 답변을 참고하여 유사한 답변 링크를 추천해드리고 있습니다.
현재 베타 기능으로 답변이 만족스럽지 않을 수 있는 점 양해 부탁드립니다. 🙏
추가적으로 궁금한 점이 있으시면, 이어서 질문해 주세요. 곧 지식공유자께서 답변해 주실 것입니다.
헉 코드에서 잘못 타이핑한 부분이 있었습니다.. 죄송합니다ㅠㅠ
앞으로 더 꼼꼼히 따라가겠습니다 ㅎㅎ
감사드립니다!!