Access services with OAuth credentials

Before starting this tutorial:

1. You need an ArcGIS Location Platform or ArcGIS Online account.

2. Your system meets the system requirements.

3. The ArcGIS Maps SDK for Qt, version 200.8.0 or later is installed.

4. The Qt 6.8.2 software development framework is installed.

Option 1: Develop the code

Create a new ArcGIS Maps Qt Creator Project

1. Start Qt Creator.

2. In the top menu bar, click File > New Project.

3. In the New Project dialog, in the left frame, under Projects, select ArcGIS. Then select the ArcGIS Maps 200.8.0 Qt Quick C++ app project template (or a later version) and click Choose. This will launch the template wizard.

4. In the Project Location template, name your project AccessServicesWithOAuth. You can specify your own "create in" location for where the project will be created or leave the default. Click Next.

5. In the Define Build System template, select qmake for your build system. Click Next.

6. In the Define Project Details template, give this app a description or leave as is. Leave the 3D project box unchecked. At the ArcGIS Online Basemap dropdown menu, select Topographic. Do not provide an Access Token (also called an API Key), leave it blank. We will be using OAuth for the project to access secured web mapping services, this will be discussed in a later section. Click Next.

7. In the Kit Selection template, check on the kit you previously set up when you installed Qt (Desktop Qt 6.8.2 MSVC2022 64bit or higher required). Click Next.

8. In the Project Management template, the option to Add as a subproject to root project is only available if you have already created a root project. If you have a version control system set up, you can select it in the dropdown but it is not needed to complete this tutorial. Click Finish to complete the template wizard.

Configure the .pro file

Qt .pro files contains information required by qmake to build an application, a library, or a plugin.

1. In the project Sources folder of Qt Creator, open AccessServicesWithOAuth.pro. To utilize Authenticator, add the path to where the toolkitcpp.pri file is located on your development system (for example: C:/arcgis-maps-sdk-toolkit-qt/uitools/toolkitcpp/toolkitcpp.pri). Then add the Qt WebEngine Quick module to your project. The Qt WebEngine is used to display an OAuth sign in webpage in your app. Save and close the AccessServicesWithOAuth.pro file.

   See the Install and setup for details on installing the Qt WebEngine on your system.

   AccessServicesWithOAuth.pro

   Expand

   Use dark colors for code blocks

   1
   2
   3
   4
   5
   6
   7
   8
   9
   10
   11
   12
   13
   14
   15
   16
   17
   18
   19
   20
   21
   22
   23
   24
   25
   26
   27
   28
   29
   30
   31
   32
   33
   34
   35
   36
   37
   38
   39
   40
   41
   42
   43
   44
   45
   46
   47
   48
   49
   50
   51
   52
   53
   54
   55
   56
   57
   58
   59
   60
   61
   62
   63
   64
   65
   66
   67
   68
   69
   70
   71
   72
   73
   74
   ARCGIS_RUNTIME_VERSION = 200.8.0
   include($$PWD/arcgisruntime.pri)
   
   # TODO: You need to replace the <path_to_toolkit_repo> with a valid location where the Qt Toolkit
   # resides on your system, example: C:/arcgis-maps-sdk-toolkit-qt/uitools/toolkitcpp/toolkitcpp.pri
   include(<path_to_toolkit_repo>/uitools/toolkitcpp/toolkitcpp.pri)
   
   qtHaveModule(webenginequick) {
     QT += webenginequick
   }
   

   Expand

Implement user authentication using OAuth credentials

The OAuth sign in web page is implemented using the Authenticator class and the Qt WebEngine, which is part of the ArcGIS Toolkit.

1. In the project Sources folder of Qt Creator, open main.cpp. Remove these #include statements. These Qt types are not needed for this tutorial.

   main.cpp

   Use dark colors for code blocks

   1
   2
   3
   4
   5
   6
   7
   8
   9
   10
   11
   12
   13
   14
   15
   16
   17
   18
   19
   20
   21
   22
   23
   24
   25
   26
   27
   28
   29
   30
   31
   32
   33
   34
   35
   36
   37
   38
   39
   40
   41
   42
   43
   44
   45
   46
   47
   48
   49
   50
   51
   52
   53
   54
   55
   56
   57
   58
   59
   60
   61
   62
   63
   64
   65
   66
   67
   68
   69
   70
   71
   72
   73
   74
   75
   76
   77
   78
   79
   80
   #include "Display_a_map.h"
   
   #include "ArcGISRuntimeEnvironment.h"
   #include "MapQuickView.h"
   
   #include <QDir>
   #include <QGuiApplication>
   #include <QQmlApplicationEngine>
   

2. Add #include statements for QtWebEngineQuick and register.h for the Toolkit.

   main.cpp

   Use dark colors for code blocks

   1
   2
   3
   4
   5
   6
   7
   8
   9
   10
   11
   12
   13
   14
   15
   16
   17
   18
   19
   20
   21
   22
   23
   24
   25
   26
   27
   28
   29
   30
   31
   32
   33
   34
   35
   36
   37
   38
   39
   40
   41
   42
   43
   44
   45
   46
   47
   48
   49
   50
   51
   52
   53
   54
   55
   56
   57
   58
   59
   60
   61
   62
   63
   64
   65
   66
   67
   68
   69
   70
   71
   72
   73
   74
   75
   76
   77
   78
   79
   80
   81
   82
   83
   84
   85
   86
   87
   88
   #include "AccessServicesWithOAuth.h"
   #include "ArcGISRuntimeEnvironment.h"
   #include "MapQuickView.h"
   
   #include <QtWebEngineQuick>
   #include "Esri/ArcGISRuntime/Toolkit/register.h"
   

3. Add code to initialize QtWebEngineQuick.

   main.cpp

   Use dark colors for code blocks

   1
   2
   3
   4
   5
   6
   7
   8
   9
   10
   11
   12
   13
   14
   15
   16
   17
   18
   19
   20
   21
   22
   23
   24
   25
   26
   27
   28
   29
   30
   31
   32
   33
   34
   35
   36
   37
   38
   39
   40
   41
   42
   43
   44
   45
   46
   47
   48
   49
   50
   51
   52
   53
   54
   55
   56
   57
   58
   59
   60
   61
   62
   63
   64
   65
   66
   67
   68
   69
   70
   71
   72
   73
   74
   75
   76
   77
   78
   79
   80
   81
   82
   83
   84
   85
   86
   87
   88
   using namespace Esri::ArcGISRuntime;
   
   int main(int argc, char *argv[])
   {
       QGuiApplication app(argc, argv);
   
       // Initialize the QtWebEngineQuick to use the web based login dialog.
       QtWebEngineQuick::initialize();
   
       ArcGISRuntimeEnvironment::setUseLegacyAuthentication(false);
   

4. Add code to register the Toolkit. Then save and close main.cpp.

   main.cpp

   Expand

   Use dark colors for code blocks

   1
   2
   3
   4
   5
   6
   7
   8
   9
   10
   11
   12
   13
   14
   15
   16
   17
   18
   19
   20
   21
   22
   23
   24
   25
   26
   27
   28
   29
   30
   31
   32
   33
   34
   35
   36
   37
   38
   39
   40
   41
   42
   43
   44
   45
   46
   47
   48
   49
   50
   51
   52
   53
   54
   55
   56
   57
   58
   59
   60
   61
   62
   63
   64
   65
   66
   67
   68
   69
   70
   71
   72
   73
   74
   75
   76
   77
   78
   79
   80
   81
   82
   83
   84
   85
   86
   87
   88
       // Register the AccessServicesWithOAuth (QQuickItem) for QML
       qmlRegisterType<AccessServicesWithOAuth>("Esri.AccessServicesWithOAuth", 1, 0, "AccessServicesWithOAuth");
   
       // Initialize application view
       QQmlApplicationEngine engine;
   
       // Register the toolkit
       Esri::ArcGISRuntime::Toolkit::registerComponents(engine);
   

   Expand

5. In Qt Creator, navigate to Resources > qml\qml.qrc > qml and open AccessServicesWithOAuthForm.qml. Add an import statement for the Toolkit.

   AccessServicesWithOAuthForm.qml

   Use dark colors for code blocks

   1
   2
   3
   4
   5
   6
   7
   8
   9
   10
   11
   12
   13
   14
   15
   16
   17
   18
   19
   20
   21
   22
   23
   24
   25
   26
   27
   28
   29
   30
   31
   32
   33
   34
   35
   36
   37
   38
   39
   40
   import QtQuick
   import QtQuick.Controls
   import Esri.AccessServicesWithOAuth
   
   import Esri.ArcGISRuntime.Toolkit
   

6. Now that the toolkit is available, declare an Authenticator component. Then save and close AccessServicesWithOAuthForm.qml.

   AccessServicesWithOAuthForm.qml

   Expand

   Use dark colors for code blocks

   1
   2
   3
   4
   5
   6
   7
   8
   9
   10
   11
   12
   13
   14
   15
   16
   17
   18
   19
   20
   21
   22
   23
   24
   25
   26
   27
   28
   29
   30
   31
   32
   33
   34
   35
   36
   37
   38
   39
   40
       // Declare the C++ instance which creates the map etc. and supply the view
       AccessServicesWithOAuth {
           id: model
           mapView: view
       }
   
       // Declare an Authenticator to support login.
       Authenticator {
           anchors.centerIn: parent
       }
   

   Expand

   NOTE: The Authenticator is a Toolkit component that simplifies the authentication workflow to automatically display the correct login user interface for each security method (Token, OAuth, PKI, and so on).

Define a function in the header file

The app will use the map view to display a map centered on the Santa Monica Mountains in California. The map will contain a layer built from the ArcGISTopographic BasemapStyle.

1. In the Projects window, open the Headers folder. Double-click the file AccessServicesWithOAuth.h to open it.

2. Add the declaration void setupViewpoint(); under private:. Then save the file.

   AccessServicesWithOAuth.h

   Expand

   Use dark colors for code blocks

   1
   2
   3
   4
   5
   6
   7
   8
   9
   10
   11
   12
   13
   14
   15
   16
   17
   18
   19
   20
   21
   22
   23
   24
   25
   26
   27
   28
   29
   30
   31
   32
   33
   34
   35
   36
   37
   38
   39
   40
   41
   42
   43
   44
   45
   46
   47
   48
   49
   private:
       Esri::ArcGISRuntime::MapQuickView* mapView() const;
       void setMapView(Esri::ArcGISRuntime::MapQuickView* mapView);
   
       void setupViewpoint();
   
       Esri::ArcGISRuntime::Map* m_map = nullptr;
       Esri::ArcGISRuntime::MapQuickView* m_mapView = nullptr;
   

   Expand

3. After you have added the declaration, right click on the setupViewPoint() and from the popup context menus choose Refactor > Add definition in AccessServicesWithOauth.cpp. This will open the AccessServicesWithOAuth.cpp file stub out the setupViewPoint method.

Add required class header files and namespaces

Several additional classes and a namespace are required to support the functionality your app needs. Specifically, for managing OAuth authentication, creating an image layer, and accessing the secured traffic layer portal item.

1. In Qt Creator, find the project Sources folder and open the AccessServicesWithOAuth.cpp file. Add #include statements for the required header files as shown.

   AccessServicesWithOAuth.cpp

   Use dark colors for code blocks

   1
   2
   3
   4
   5
   6
   7
   8
   9
   10
   11
   12
   13
   14
   15
   16
   17
   18
   19
   20
   21
   22
   23
   24
   25
   26
   27
   28
   29
   30
   31
   32
   33
   34
   35
   36
   37
   38
   39
   40
   41
   42
   43
   44
   45
   46
   47
   48
   49
   50
   51
   52
   53
   54
   55
   56
   57
   58
   59
   60
   61
   62
   63
   64
   65
   66
   67
   68
   69
   70
   71
   72
   73
   74
   75
   76
   77
   78
   79
   80
   81
   82
   83
   84
   85
   86
   87
   88
   89
   90
   91
   92
   93
   94
   95
   96
   97
   98
   99
   100
   101
   102
   103
   104
   105
   106
   107
   108
   #include "AccessServicesWithOAuth.h"
   #include "Map.h"
   #include "MapTypes.h"
   #include "MapQuickView.h"
   
   #include "ArcGISMapImageLayer.h"
   #include "LayerListModel.h"
   #include "Point.h"
   #include "Portal.h"
   #include "PortalItem.h"
   #include "SpatialReference.h"
   #include "Viewpoint.h"
   
   #include <QFuture>
   
   #include "OAuthUserConfigurationManager.h"
   
   #include "Authentication/OAuthUserConfiguration.h"
   

2. Add another namespace statement as shown.

   AccessServicesWithOAuth.cpp

   Use dark colors for code blocks

   1
   2
   3
   4
   5
   6
   7
   8
   9
   10
   11
   12
   13
   14
   15
   16
   17
   18
   19
   20
   21
   22
   23
   24
   25
   26
   27
   28
   29
   30
   31
   32
   33
   34
   35
   36
   37
   38
   39
   40
   41
   42
   43
   44
   45
   46
   47
   48
   49
   50
   51
   52
   53
   54
   55
   56
   57
   58
   59
   60
   61
   62
   63
   64
   65
   66
   67
   68
   69
   70
   71
   72
   73
   74
   75
   76
   77
   78
   79
   80
   81
   82
   83
   84
   85
   86
   87
   88
   89
   90
   91
   92
   93
   94
   95
   96
   97
   98
   99
   100
   101
   102
   103
   104
   105
   106
   107
   108
   using namespace Esri::ArcGISRuntime;
   
   using namespace Esri::ArcGISRuntime::Authentication;
   

Create the view point

1. Add code to implement the setupViewpoint method. This method creates a center Point based on a SpatialReference along with longitude and latitude. It also creates a Viewpoint based on center and sets scale. Lastly, it asynchronously sets the initial Map viewpoint.

   The center Point and scale value keep the initial Viewpoint centered and focused on the Santa Monica Mountains. The scale value sets the level of detail to focus on the area of interest.

   The spatial reference created above is set to use World Geodetic System 1984 (WGS84), the spatial reference commonly used for GPS, and it has the well known id 4326. To learn more, see Spatial References in the ArcGIS Maps SDK for Qt Guide.

   AccessServicesWithOAuth.cpp

   Use dark colors for code blocks

   1
   2
   3
   4
   5
   6
   7
   8
   9
   10
   11
   12
   13
   14
   15
   16
   17
   18
   19
   20
   21
   22
   23
   24
   25
   26
   27
   28
   29
   30
   31
   32
   33
   34
   35
   36
   37
   38
   39
   40
   41
   42
   43
   44
   45
   46
   47
   48
   49
   50
   51
   52
   53
   54
   55
   56
   57
   58
   59
   60
   61
   62
   63
   64
   65
   66
   67
   68
   69
   70
   71
   72
   73
   74
   75
   76
   77
   78
   79
   80
   81
   82
   83
   84
   85
   86
   87
   88
   89
   90
   91
   92
   93
   94
   95
   96
   97
   98
   99
   100
   101
   102
   103
   104
   105
   106
   107
   108
   MapQuickView* AccessServicesWithOAuth::mapView() const
   {
       return m_mapView;
   }
   
   void AccessServicesWithOAuth::setupViewpoint()
   {
   
       const Point center(-118.80543, 34.02700, SpatialReference::wgs84());
       const Viewpoint viewpoint(center, 100000.0);
       m_mapView->setViewpointAsync(viewpoint);
   
   }
   

   The setMapView method appearing later in this file gets a handle to the MapView object that was declared in QML code and sets the Map on the MapView for display. This code is installed by the templates that ArcGIS provides when creating a new project in Qt. You should not modify it.

2. Add the following line of code to call the setupViewpoint method.

   AccessServicesWithOAuth.cpp

   Use dark colors for code blocks

   1
   2
   3
   4
   5
   6
   7
   8
   9
   10
   11
   12
   13
   14
   15
   16
   17
   18
   19
   20
   21
   22
   23
   24
   25
   26
   27
   28
   29
   30
   31
   32
   33
   34
   35
   36
   37
   38
   39
   40
   41
   42
   43
   44
   45
   46
   47
   48
   49
   50
   51
   52
   53
   54
   55
   56
   57
   58
   59
   60
   61
   62
   63
   64
   65
   66
   67
   68
   69
   70
   71
   72
   73
   74
   75
   76
   77
   78
   79
   80
   81
   82
   83
   84
   85
   86
   87
   88
   89
   90
   91
   92
   93
   94
   95
   96
   97
   98
   99
   100
   101
   102
   103
   104
   105
   106
   107
   108
   // Set the view (created in QML)
   void AccessServicesWithOAuth::setMapView(MapQuickView* mapView)
   {
       if (!mapView || mapView == m_mapView)
       {
           return;
       }
   
       m_mapView = mapView;
       m_mapView->setMap(m_map);
   
       setupViewpoint();
   
       emit mapViewChanged();
   }

Create an OAuth user configuration and portal to access secured services

Using the Redirect URL and Client ID information obtained from the earlier prerequisites section Create OAuth credentials for user authentication in the tutorial when creating your OAuth credentials, you will create a new OAuthUserConfiguration object. This object is used as the input for the Qt Toolkit OAuthUserConfigurationManager to make use of the Qt WebEngine based login dialog. You will then use an instance of the Portal class to access secure services on your portal.

1. In the setupViewpoint function, add the following code to create a OAuthUserConfiguration object. Replace the "REDIRECT_URL" and "CLIENT_ID" placeholders strings (created earlier in this tutorial in the section Create OAuth credentials for user authentication).

   AccessServicesWithOAuth.cpp

   Use dark colors for code blocks

   1
   2
   3
   4
   5
   6
   7
   8
   9
   10
   11
   12
   13
   14
   15
   16
   17
   18
   19
   20
   21
   22
   23
   24
   25
   26
   27
   28
   29
   30
   31
   32
   33
   34
   35
   36
   37
   38
   39
   40
   41
   42
   43
   44
   45
   46
   47
   48
   49
   50
   51
   52
   53
   54
   55
   56
   57
   58
   59
   60
   61
   62
   63
   64
   65
   66
   67
   68
   69
   70
   71
   72
   73
   74
   75
   76
   77
   78
   79
   80
   81
   82
   83
   84
   85
   86
   87
   88
   89
   90
   91
   92
   93
   94
   95
   96
   97
   98
   99
   100
   101
   102
   103
   104
   105
   106
   107
   108
   void AccessServicesWithOAuth::setupViewpoint()
   {
   
       const Point center(-118.80543, 34.02700, SpatialReference::wgs84());
       const Viewpoint viewpoint(center, 100000.0);
       m_mapView->setViewpointAsync(viewpoint);
   
       // Define the Redirect URL string obtained when creating the OAuth credentials.
       // TODO: You need to replace the "REDIRECT_URL" with your own valid string,
       // ex: "urn:ietf:wg:oauth:2.0:oob"
       const auto qStringRedirectUrl = QString{"REDIRECT_URL"};
   
       // Define the URL of the portal to authenticate with.
       const QUrl qUrlPortal = QUrl{"https://www.arcgis.com/"};
   
       // Define a unique identifier associated with an application registered with the
       // portal that assists with client/server OAuth authentication.
       // TODO: You need to replace the "CLIENT_ID" with your own valid string.
       const QString qStringClientId = QString{"CLIENT_ID"};
   
       // Create a new OAuth user configuration using: the Url to ArcGIS online, the Client ID
       // string, and the Redirect Url string.
       auto* oAuthUserConfiguration = new OAuthUserConfiguration(qUrlPortal, qStringClientId,
                                                                 qStringRedirectUrl, this);
   
       // Call the Toolkit's OAuthUserConfigurationManager static `addConfiguration`
       // method to use the OAuth dialog. This will require the input of a valid username/password.
       Toolkit::OAuthUserConfigurationManager::addConfiguration(oAuthUserConfiguration);
   

2. Now add code to create a Portal that will use the boolean true which forces the login to occur to gain access to the secured ArcGIS World Traffic service.

   AccessServicesWithOAuth.cpp

   Use dark colors for code blocks

   1
   2
   3
   4
   5
   6
   7
   8
   9
   10
   11
   12
   13
   14
   15
   16
   17
   18
   19
   20
   21
   22
   23
   24
   25
   26
   27
   28
   29
   30
   31
   32
   33
   34
   35
   36
   37
   38
   39
   40
   41
   42
   43
   44
   45
   46
   47
   48
   49
   50
   51
   52
   53
   54
   55
   56
   57
   58
   59
   60
   61
   62
   63
   64
   65
   66
   67
   68
   69
   70
   71
   72
   73
   74
   75
   76
   77
   78
   79
   80
   81
   82
   83
   84
   85
   86
   87
   88
   89
   90
   91
   92
   93
   94
   95
   96
   97
   98
   99
   100
   101
   102
   103
   104
   105
   106
   107
   108
       // Call the Toolkit's OAuthUserConfigurationManager static `addConfiguration`
       // method to use the OAuth dialog. This will require the input of a valid username/password.
       Toolkit::OAuthUserConfigurationManager::addConfiguration(oAuthUserConfiguration);
   
       // Create a new portal using the boolean `true` which forces the login to occur.
       constexpr auto loginRequired = true;
       Portal* portal = new Portal(loginRequired, this);
   

Add the secured traffic layer

The ArcGIS World Traffic service is a dynamic map service that presents historical and near real-time traffic information for different regions of the world. This service requires an ArcGIS Online organizational subscription. You will add a portal item referencing this service, and create a traffic layer from that.

ArcGIS World Traffic service data is updated every five minutes to provide traffic speed and traffic incident visualization and identification. Traffic speeds are displayed as a percentage of free-flow speeds, which is frequently the speed limit or how fast cars tend to travel when unencumbered by other vehicles. The streets are color coded as follows:

• Green (fast): 85 - 100% of free flow speeds
• Yellow (moderate): 65 - 85%
• Orange (slow); 45 - 65%
• Red (stop and go): 0 - 45%

1. Add code to create a PortalItem using the traffic service's item ID. Then create an ArcGISMapImageLayer to display the traffic service. Finally, append the traffic layer to the map's collection of data layers (operational layers).

   AccessServicesWithOAuth.cpp

   Expand

   Use dark colors for code blocks

   1
   2
   3
   4
   5
   6
   7
   8
   9
   10
   11
   12
   13
   14
   15
   16
   17
   18
   19
   20
   21
   22
   23
   24
   25
   26
   27
   28
   29
   30
   31
   32
   33
   34
   35
   36
   37
   38
   39
   40
   41
   42
   43
   44
   45
   46
   47
   48
   49
   50
   51
   52
   53
   54
   55
   56
   57
   58
   59
   60
   61
   62
   63
   64
   65
   66
   67
   68
   69
   70
   71
   72
   73
   74
   75
   76
   77
   78
   79
   80
   81
   82
   83
   84
   85
   86
   87
   88
   89
   90
   91
   92
   93
   94
   95
   96
   97
   98
   99
   100
   101
   102
   103
   104
   105
   106
   107
   108
       // Create a new portal using the boolean `true` which forces the login to occur.
       constexpr auto loginRequired = true;
       Portal* portal = new Portal(loginRequired, this);
   
       // Create a new portal item using the inputs of: a portal and the String ID for the
       // ArcGIS World Traffic service. This causes the OAuth challenge to occur.
       PortalItem* portalItem = new PortalItem(portal, "ff11eb5b930b4fabba15c47feb130de4", this);
   
       // Create a new ArcGIS map image layer using the input of the portal item.
       ArcGISMapImageLayer* arcGISMapImageLayer = new ArcGISMapImageLayer(portalItem, this);
   
       // Append the traffic layer to the map's data layer collection.
       m_map->operationalLayers()->append(arcGISMapImageLayer);
   

   Expand

2. Press Ctrl + R to run the app.

The app will open and you should see the Sign In prompt you for to enter your ArcGIS Online Username and Password for the Authenticator Qt Toolkit control. When entered, click the Sign In button.

After authenticating successfully with ArcGIS Online, a map with the topographic basemap layer centered on the Santa Monica Mountains in California. The map will appear with the traffic layer also displayed.

Option 2: Download the solution

1. Click the Download solution link in the right-hand panel of the page.

2. Unzip the file to a location on your machine.

3. Using Windows Explorer, double click on the AccessServicesWithOAuth.pro file to launch Qt Creator.

Set path to the Qt Toolkit in the project

1. Ensure you have completed the prerequisites listed at the beginning of this tutorial. In particular, ensure you have done the step Download the ArcGIS Maps SDK for Qt Toolkit and have noted the path to the toolkitcpp.pri file that is in the directory structure of the Qt Toolkit on your development machine.

2. In the project Sources folder of Qt Creator, open the AccessServicesWithOAuth.pro file and locate the following line and update the include statement to the path of the toolkitcpp.pri file.

   AccessServicesWithOAuth.pro

   Use dark colors for code blocks

   1
   2
   3
   4
   5
   6
   7
   8
   9
   10
   11
   12
   13
   14
   15
   16
   17
   18
   19
   20
   21
   22
   23
   24
   25
   26
   27
   28
   29
   30
   31
   32
   33
   34
   35
   36
   37
   38
   39
   40
   41
   42
   43
   44
   45
   46
   47
   48
   49
   50
   51
   52
   53
   54
   55
   56
   57
   58
   59
   60
   61
   62
   63
   64
   65
   66
   67
   68
   69
   70
   71
   72
   73
   74
   ARCGIS_RUNTIME_VERSION = 200.8.0
   include($$PWD/arcgisruntime.pri)
   
   # TODO: You need to replace the <path_to_toolkit_repo> with a valid location where the Qt Toolkit
   # resides on your system, example: C:/arcgis-maps-sdk-toolkit-qt/uitools/toolkitcpp/toolkitcpp.pri
   include(<path_to_toolkit_repo>/uitools/toolkitcpp/toolkitcpp.pri)
   
   qtHaveModule(webenginequick) {
     QT += webenginequick
   }
   

Set developer credentials in the solution

To allow your app users to access ArcGIS location services, use the developer credentials that you created in the Create OAuth credentials for user authentication step to authenticate requests for resources.

1. In the project Sources folder of Qt Creator, open the AccessServicesWithOAuth.cpp file.

2. Set your values for the REDIRECT_URL (qStringRedirectUrl) and the CLIENT_ID (qStringClientId).

   AccessServicesWithOAuth.cpp

   Use dark colors for code blocks

   1
   2
   3
   4
   5
   6
   7
   8
   9
   10
   11
   12
   13
   14
   15
   16
   17
   18
   19
   20
   21
   22
   23
   24
   25
   26
   27
   28
   29
   30
   31
   32
   33
   34
   35
   36
   37
   38
   39
   40
   41
   42
   43
   44
   45
   46
   47
   48
   49
   50
   51
   52
   53
   54
   55
   56
   57
   58
   59
   60
   61
   62
   63
   64
   65
   66
   67
   68
   69
   70
   71
   72
   73
   74
   75
   76
   77
   78
   79
   80
   81
   82
   83
   84
   85
   86
   87
   88
   89
   90
   91
   92
   93
   94
   95
   96
   97
   98
   99
   100
   101
   102
   103
   104
   105
   106
   107
   108
       // Define the Redirect URL string obtained when creating the OAuth credentials.
       // TODO: You need to replace the "REDIRECT_URL" with your own valid string,
       // ex: "urn:ietf:wg:oauth:2.0:oob"
       const auto qStringRedirectUrl = QString{"REDIRECT_URL"};
   
       // Define the URL of the portal to authenticate with.
       const QUrl qUrlPortal = QUrl{"https://www.arcgis.com/"};
   
       // Define a unique identifier associated with an application registered with the
       // portal that assists with client/server OAuth authentication.
       // TODO: You need to replace the "CLIENT_ID" with your own valid string.
       const QString qStringClientId = QString{"CLIENT_ID"};
   

Best Practice: The OAuth credentials are stored directly in the code as a convenience for this tutorial. Do not store credentials directly in source code in a production environment.

1. Press Ctrl + R to run the app.

The app will open and you should see the Sign In prompt you for to enter your ArcGIS Online Username and Password for the Authenticator Qt Toolkit control. When entered, click the Sign In button.

After authenticating successfully with ArcGIS Online, a map with the topographic basemap layer centered on the Santa Monica Mountains in California. The map will appear with the traffic layer also displayed.