AnsweredAssumed Answered

Secure Storage Login Capability

Question asked by glalla_uwi2017 on Oct 16, 2018
Latest reply on Oct 18, 2018 by paul.haakma

Good Day,

I want to create a very basic app login hence I am looking for alternatives to OAuth, Token Auth etc. I just want a login page with a Username and Password. That's it, nothing else. Therefore, I decided to use Secure Storage with the thought process being.......a username and password is stored by a user initially. When the user opens the app in the future, they enter the same user name and password and hit 'Login'. So, this login checks the keychain to ensure the password is correct and then allows access to the app by opening a new window. 

 

I modified the Secure Storage code to include a 'Login' Button however nothing happens when I hit Login. Therefore, I assume that the problem lies with the Login button. Can I be guided on how to fix this? Thank you. Below is the code:

 

import QtQuick 2.7
import QtQuick.Layouts 1.1
import QtQuick.Controls 2.1
import QtQuick.Controls.Material 2.1
import QtGraphicalEffects 1.0
import QtQuick.Dialogs 1.2
import QtQuick.Window 2.1
import ArcGIS.AppFramework 1.0
import ArcGIS.AppFramework.Controls 1.0
//import Esri.ArcGISRuntime 100.1
import ArcGIS.AppFramework.SecureStorage 1.0
import "controls" as Controls
App {
    id: app
    width: 400
    height: 750
    function units(value) {
        return AppFramework.displayScaleFactor * value
    }
    property real scaleFactor: AppFramework.displayScaleFactor
    property int baseFontSize : app.info.propertyValue("baseFontSize", 15 * scaleFactor) + (isSmallScreen ? 0 : 3)
    property bool isSmallScreen: (width || height) < units(400)
    property string insertSuccessMessage: qsTr ("Inserted into Keychain")
    property string removeSuccessMessage: qsTr ("Removed from Keychain")
    property string failMessage:qsTr("Something Went Wrong")
    property color successColor: Material.color(Material.Teal)
    property color errorColor: Material.color(Material.DeepOrange)
    Page {
        anchors.fill: parent
        header: ToolBar{
            id:header
            width: parent.width
            height: 50 * scaleFactor
            Material.background: "#8f499c"
            Controls.HeaderBar{}
        }
        // sample starts here ------------------------------------------------------------------
        contentItem: Rectangle {
            anchors.top:header.bottom
            ColumnLayout {
                spacing: 5 * scaleFactor
                anchors.horizontalCenter: parent.horizontalCenter
                // Insert key in this text field
                TextField {
                    id: username
                    placeholderText: "Username"
                    echoMode: passwordVisible.checked === true ? TextInput.Normal: TextInput.PasswordEchoOnEdit
                    Material.accent: "#8f499c"
                    Layout.topMargin: 100 * scaleFactor
                    Layout.fillHeight: true
                    Layout.fillWidth: true
                }
                // Insert value in this text field
                TextField {
                    id: password
                    echoMode: passwordVisible.checked === true ? TextInput.Normal: TestInput.PasswordEchoonEdit
                    placeholderText: "Enter password"
                    Material.accent: "#8f499c"
                    Layout.fillHeight: true
                    Layout.fillWidth: true
                }
                //Click on the button to store key and value in the keychain
                Button {
                    id: saveButton
                    text: qsTr("Save Data to Keychain")
                    onClicked: {
                     SecureStorage.setValue(username.text, password.text)
                    }
                }
                Button {
                    id: loginButton
                    text: qsTr ("Login")
                    onClicked: {
                        if(password.text === true) {
                            var component = Qt.createComponent("Child.qml")
                            var window = component.createObject (root)
                            window.show ()
                        }
                    }
                }
                        }
                    }
                }
 
    }

 

    

Outcomes