Enabling Address Search Using Address Services

Overview

Address Services enables address-location searching using the Address Search component. End-users End-users, also known as Express Users, are the individuals accessing an application through Express View. In most cases, end-users are the customers using the product. enter a location's address, and results narrow as they type. Sometimes, your end-users might know the name of the location, but not the address. Address Services let your end-users look up a location instead. These services also let them search for the name of a business, building, or landmark.

The benefits of using the address service for the Address Search component include:

When setting up a new service, it is the customer or Creator's responsibility to obtain an API key for the Google Places or Canada Post services. API keys are owned by the customer and should not be exposed to end-users.

Setting Up Address Services

To learn more about setting up an address service, click on the buttons below.

Setting Up a Google Places Service in Service Administration

The first step in using Google Places address look-up is adding the Google Place Details API service. You'll do this in Services Administration. You must have a Google Places API key to set up a Google Place Details Service.

To learn more about getting a Google Places API key, visit the following link: https://developers.google.com/places/web-service/get-api-key.

1. At the top right of the Unqork Designer Platform, click Administration.
2. Under Integration, click Services Administration.
3. At the top right of the page, click + Add a Service. The Create New Service modal A modal is a window that appears on top of the content you are currently viewing. displays.

A image showing how to create a new Service.

4. In the Service Title field, enter {teamName} - Google Places. Replace {teamName} with your initials or the name of your application team. For example, Sales - Google Places.
5. In the Service Name field, enter {teamName}-google-places.

Use lowercase alphanumeric characters along with a hyphen (-). A Service Name cannot not start or end with a hyphen. There cannot be consecutive hyphens in a Service Name.

6. Click Next. The Manage Access page displays.
7. From the Share To setting, choose to share with the environment or a specific workspace.
8. Click Create. The service's information page displays.
9. Click Edit.
10. From the menu to the left, click Service Type
11. From the Authentication method drop-down, select Google Places.
12. In the API Key field, enter the Google Places API key.

A static image displaying the Service Info page of a newly created Google Places service. The Authentication method drop down and API Key fields are highlighted.

13. Click Save Changes. The Services Administration page loads, displaying the new service in the list.

Configuring an Address Search Component to Use the Google Place Details Service

Configure an Address Search component to use the Google Place Details service. These instructions assume that you have an open module saved with a title.

1. In the Module Builder, drag and drop an Address Search icon Address Search component onto your canvas.
2. In the Property ID A Property ID is the unique field ID used by Unqork to track and link components in your module. field, enter address.
3. In the Label Text Label Text conveys what the input component is and what information it displays. Enter the purpose of the corresponding component or field. field, enter Enter Your Address:.
4. Select any of the Show Street, Show Street 2, Show City, Show State, Show Zip, and Show Country options as desired. Selected fields display in Express View Express View is how your end-user views your application. Express View also lets you preview your applications to test your configuration and view the styling. This is also the view your end-users will see when interacting with your application. After configuring a module, click Preview in the Module Builder to interact with the module in Express View. and populate with the data returned by the Google Places API.

All location data returned by the Google Places API stores in the submission data, even if you do not select the respective option.

A static image displaying the Address Search configuration page, the Property ID, Label, and Address Display Settings are highlighted.

5. Navigate to the Data settings.
6. From the Select API drop-down, select the Address Service created in the previous section. In this case, sales-googleplaces. Doing so connects your Address Search component to the Google Places service you added in Services Administration.

If only one Address Service exists, it's selected by default.

A static image displaying the Address Search configuration window. The Data section is displayed and the Sales - Google Places Address Service is highlighted.

7. Click Save Component.
8. Save your module.

You're now ready to use Google Places-enabled address search.

Setting Up a Canada Post Service in Service Administration

To use the Canada Post address look-up, you must configure the Canada Post service. You'll do this in Services Administration. You must have a Canada Post API key to set up a Canada Post Service.

To learn more about getting a Canada Post API key, visit the following link: https://www.canadapost-postescanada.ca/ac/support/setup-guides/#create-an-api-key.

1. At the top right of the Unqork Designer Platform, click Administration.
2. Under Integration, select Services Administration.
3. At the top right of the page, click + Add a Service.

A image showing how to create a new Service for Canada Post

4. In the Service Title field, enter {teamName} - Canada Post. Replace {teamName} with your initials or the name of your application team. For example, Sales - Canada Post.
5. In the Service Name field, enter {teamName}-canada-post.

Use lowercase alphanumeric characters along with a hyphen (-). A Service Name cannot start or end with a hyphen. There cannot be consecutive hyphens in a Service Name.

6. Click Next. The Manage Access page displays.

A image showing how to create a new Service Manage Access tab page.

7. From the Share To setting, choose to share with the environment or a specific workspace.
8. Click Create. The service's information page displays.
9. Click Edit.
10. From the menu to the left, click Service Type
11. From the Authentication method drop-down, select Canada Post.
12. In the API Key field, enter the Canada Post API key.

A static image displaying the Service Info page of a newly created Canada Post service. The Authentication method drop down and API Key fields are highlighted.

13. Click Save Changes. The Services Administration page loads, displaying the new service in the list.

Configuring an Address Search Component to Use the Canada Post Service

Configure an Address Search component to use the Canada Post service. These instructions assume that you have an open module saved with a title.

1. In the Module Builder, drag and drop an Address Search icon Address Search component onto your canvas.
2. In the Property ID A Property ID is the unique field ID used by Unqork to track and link components in your module. field, enter address.
3. In the Label Text Label Text conveys what the input component is and what information it displays. Enter the purpose of the corresponding component or field. field, enter Enter Your Address:.
4. Select any of the Show Street, Show Street 2, Show City, Show State, Show Zip, and Show Country options as desired. Selected fields display in Express View and populate with the data returned by the Canada Post API.

All location data returned by the Canada Post API stores in the submission data, even if you do not select the respective option.

A static image displaying the Address Search configuration page, the Property ID, Label, and Address Display Settings are highlighted.

5. Navigate to the Data settings.
6. From the Select API drop-down, select the Address Service created in the previous section. In this case, sales-canadapost. Doing so connects your Address Search component to the Canada Post service you added in Services Administration.

If only one Address Service exists, it's selected by default.

A static image displaying the Address Search configuration window. The Data section is displayed and the Sales - Canada Post Address Service is highlighted.

7. Click Save Component.
8. Save your module.

You're now ready to use Canada Post-enabled address search.

Best Practices