diff --git a/src/hooks/map/useMap.ts b/src/hooks/map/useMap.ts index 493f655..64461e9 100644 --- a/src/hooks/map/useMap.ts +++ b/src/hooks/map/useMap.ts @@ -6,6 +6,7 @@ import useMarkerFeature, { getInitialMarkersFromLocalStorage, } from '../../hooks/map/useMarkerFeature'; import { urlToJson } from '../../utils/urlParsing'; +import validateStyle from '../../utils/validateStyle'; import { WholeStyleActionPayload, HistoryState, @@ -49,10 +50,12 @@ function useMap(): MapHookType { if (search && pathname === URLPathNameType.show) { const { filteredStyle, mapCoordinate } = urlToJson(); - // 이부분에 문제가 있는 것 같습니다. 없애면 에러 안나고 잘 되는데 있으면 안되요 - // if (validateStyle(states.filteredStyle as WholeStyleActionPayload)) { - changeStyle(filteredStyle as WholeStyleActionPayload); - // } + if (validateStyle(filteredStyle as WholeStyleActionPayload)) { + changeStyle(filteredStyle as WholeStyleActionPayload); + } else { + alert('URL에 잘못된 속성이 포함되어 있습니다.'); + } + const { zoom, lng, lat } = mapCoordinate as LocationType; if (zoom && lng && lat) { map.setCenter({ lng, lat }); diff --git a/src/utils/urlParsing.ts b/src/utils/urlParsing.ts index 496333d..bcbf238 100644 --- a/src/utils/urlParsing.ts +++ b/src/utils/urlParsing.ts @@ -69,7 +69,7 @@ export function jsonToURL({ }: ExportType): string { const url = process.env.NODE_ENV === 'development' - ? 'http://localhost:3000/show?=' + ? 'http://localhost:3000/show?' : process.env.REACT_APP_DEPLOY_URL; const styleQueryString = isNotEmptyObject(filteredStyle) ? `style=${encodeURIComponent( @@ -88,6 +88,12 @@ export function jsonToURL({ return url + locationQueryString + styleQueryString + markerQueryString; } +function stringToNumber(style: string): number | string { + const result = Number(style); + if (Number.isNaN(result)) return style; + return result; +} + function urlToJsonGetStyleJson(styleParams: string): URLJsonFeatureType { if (!styleParams) return {}; @@ -130,14 +136,18 @@ function urlToJsonGetStyleJson(styleParams: string): URLJsonFeatureType { element ] as URLJsonSubFeatureType)[ value as StyleKeyType - ] as URLJsonStyleType) = values[index + 1] as URLJsonStyleType; + ] as URLJsonStyleType) = stringToNumber( + values[index + 1] + ) as URLJsonStyleType; return; } ((((state[feature] as URLJsonSubFeatureType)[subFeature][ element ] as URLJsonSubFeatureType)[subElement] as URLJsonStyleType)[ value as StyleKeyType - ] as URLJsonStyleType) = values[index + 1] as URLJsonStyleType; + ] as URLJsonStyleType) = stringToNumber( + values[index + 1] + ) as URLJsonStyleType; } }); return state as URLJsonFeatureType;