snack-game / front

스낵게임! 선택한 스낵 숫자합을 10을 만들면 점수를 얻는 게임입니다!
https://snackga.me
13 stars 0 forks source link

[TroubleShooting] 모바일에서 카카오 로그인 할 경우 프로필 이미지가 보이지 않는 문제 #252

Closed nijuy closed 1 month ago

nijuy commented 1 month ago

원인

  1. 카카오 소셜 로그인할 때 프로필 이미지 주소가 http임 (그쪽에서 그렇게 줌)

  2. 이는 수동적 혼합 콘텐츠에 해당함

    이미지, 동영상, 오디오를 비롯한 수동적 혼합 콘텐츠는 페이지의 나머지 부분과 상호작용하지 않으므로 중간자 공격은 해당 콘텐츠를 가로채거나 변경하는 경우 할 수 있는 작업이 제한됩니다. - https://web.dev/articles/what-is-mixed-content?hl=ko

  3. 그동안은 브라우저가 자동으로 업그레이드 한 후 경고를 표시해주고 있었음

    수동적 혼합 콘텐츠의 예는 다음과 같은 경고를 표시합니다. 브라우저가 https URL에서 콘텐츠를 찾을 수 있으면 자동으로 업그레이드한 다음 메시지를 표시합니다. - https://web.dev/explore/progressive-web-apps?hl=ko

    image

  4. 그치만! RN에서 WebView는 http origin을 차단하기 때문에 이미지가 정상적으로 보이지 않는 것 같음

    image

해결

WebViewmixedContentMode는 안드로이드 전용이라서 iOS 대응이 불가 ㅠ.ㅠ CSP 설정용 meta 태그를 추가해보기로 함 (땡스투땡칠................🤸‍♀️) image

살짝 걱정

meta 태그는 http 이미지가 있으면 https에 대해 요청하도록 하는 내용인데, img src는 여전히 http로 남아있어서 WebView에서 계속 안 보여줄 것도 같음 이건..... 해봐야................

해보고 안되면 걍 replace() 써서 http를 https로 바꿔버리겠음