'Javascript location.href not working on amplify server

I have the following code working fine on my local

    searchForm.addEventListener('submit', (e) => {
      e.preventDefault()

      new google.maps.Geocoder().geocode( { 'address': input.value }, function(results, status) {
        if (status == google.maps.GeocoderStatus.OK) {
          console.log(results[0].geometry.location.lat(), results[0].geometry.location.lng())

          let url = new URL(`http://${window.location.host}/page--node--1.html?location=${results[0].formatted_address}`)
          location.href = url

          return false
        } 
        console.log('Geocode was not successful for the following reason: ' + status)
        input.classList.add('error')
        errorMessage.style.display = 'block'
        
      })
    })

There seems to be a problem on my staging server with amplify when this code runs it redirects to https://main.23103jf.amplifyapp.com/page--node--1/ when it should be something like this https://main.23103jf.amplifyapp.com/page--node--1.html?location=and query params here

and this loads the root directory of the site with none of the assets loading.

EDIT

I have gotten more luck using the following code

    searchForm.addEventListener('submit', (e) => {
      e.preventDefault()

      new google.maps.Geocoder().geocode( { 'address': input.value }, function(results, status) {
        if (status == google.maps.GeocoderStatus.OK) {
          console.log(results[0].geometry.location.lat(), results[0].geometry.location.lng())

          if (window.location.host.includes('amplifyapp')) {
            console.log('on amplify')
            setTimeout(() => {
              location.href = '/page--node--1.html'
            }, 1000)
          } else {
            let url = new URL(`http://${window.location.host}/page--node--1.html?location=${results[0].formatted_address}`)
            location.href = url
          }
        } 
        console.log('Geocode was not successful for the following reason: ' + status)
        input.classList.add('error')
        errorMessage.style.display = 'block'
      })

      return false
    })

i'm going to the correct page only when I add this query parameter ?location=${results[0].formatted_address}` it breaks again

any help is appreciated thanks



Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source