react-leaflet doesn't show current location by domain - reactjs

Question

I'm facing with a problem that I can't get my current location by react-leaflet v4.0.1 and react v18.2.0 when the project has been deployed on IIS.
I Just can get the current location when node js is running on localhost/register but not on domain example.com/register.
maybe its CROS origin problem but I dont know how to handle it by domain
name.
it workes well:
but it has problem with domain:
in Map.js
import React, { useEffect, useState } from 'react'
import { MapContainer, TileLayer, Marker, Popup, useMap } from 'react-leaflet'
import 'leaflet/dist/leaflet.css'
import L from 'leaflet'
import icon from './constants'
export default function App() {
function LocationMarker() {
const [position, setPosition] = useState(null)
const [bbox, setBbox] = useState([])
const map = useMap()
useEffect(() => {
map.locate().on('locationfound', function (e) {
setPosition(e.latlng)
map.flyTo(e.latlng, map.getZoom())
setBbox(e.bounds.toBBoxString().split(','))
})
}, [map])
return position === null ? null : (
<Marker position={position} icon={icon}>
<Popup>
You are here. <br />
Map bbox: <br />
<b>Southwest lng</b>: {bbox[0]} <br />
<b>Southwest lat</b>: {bbox[1]} <br />
<b>Northeast lng</b>: {bbox[2]} <br />
<b>Northeast lat</b>: {bbox[3]}
</Popup>
</Marker>
)
}
return (
<MapContainer
center={[35.1951, 51.6068]}
zoom={13}
scrollWheelZoom
style={{ height: '50vh' }}
>
<div style={{ height: '50vh' }}>
<TileLayer
attribution='© OpenStreetMap contributors'
url="https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png"
/>
<LocationMarker />
</div>
</MapContainer>
)
}