brunch

사파리에서 페이지 렌더링 오류 해결하기(크로스브라우징)

사파리의 Date format은 크롬보다 엄격하다.

by 찐님
스크린샷 2024-02-07 190911.png



웹과 안드로이드에서는 정상 동작하던 웹뷰가 아이폰에서는 위와 같은 화면만 출력되었다.


앱이라 개발자도구를 볼 수도 없고,

윈도우를 사용하기 때문에 사파리를 확인할 수도 없고

미치고 팔짝 뛸 노릇이었다.



검색을 해봐도 해당 오류에 대한 정보는 제한적이고,

원인조차 감이 오지 않아 막막했다.



당시 내가 생각한 원인은 아래 3개 였다.

* 개발자 도구의 경고 때문인가?

* https가 아니라서 그런가?

* 날짜 형태가 엄격하다던데...?




결론은 가장 아니라고 생각했던 날짜 형태때문에 발생한 오류였다.


정확하게는 사파리는 그 브라우저만의 날짜 포멧이 정해져 있어

그 형태가 아니라면 렌더링을 하지 않는다.


Safari 에서는 new Date 객체의 yyyy-mm-dd 형태의 RFC822 포맷이 지원되지 않는다.
따라서 포맷을 yyyy/mm/dd H:i:s 의 형태로 변경해서 사용해야 한다.
스크린샷 2024-02-07 191629.png


이렇게 점으로 되어있던 형태를 /(슬래시)로 변경했다.

keyword
작가의 이전글스타트업 절망편