javascriptnext.jsgoogle-apigoogle-places-apireact-google-autocomplete

Restrict google places auto complete to only show residential addresses


I am building an application that makes use of the google places autocomplete API. For my use case I do not want to allow users to input things like businesses and points of interest - I only want to allow them to select residential addresses. I have looked through the docs and there doesn't seem to be an obvious answer. I can see that I can restrict it to only show businesses, but this doesn't work in my case. Any help would be much appreciated!

I am using the react-places-autocomplete package to implement this within a next.js app. If there is something that can be added to the search options to add this restriction it would be useful.

  <PlacesAutocomplete
    value={searchValue}
    onChange={handleChange}
    searchOptions={{ componentRestrictions: { country: 'uk' } }}
    debounce={500}
  >
    {({ getInputProps, suggestions, loading }) => (
      <Autocomplete
        disablePortal
        blurOnSelect
        loading={loading}
        loadingText='Loading...'
        options={suggestions.map((x) => x.description)}
        sx={{ width }}
        onChange={handleOnSelect}
        value={address}
        renderInput={(params) => <TextField {...getInputProps({ placeholder: 'Address...' })} {...params} label="Search Address" />}
      />
    )}
  </PlacesAutocomplete>

Solution

  • For anyone facing this issue, I found that setting the types parameter to the following gave the result I was hoping for:

    ["street_number", "street_address"]