Xamarin Alliance Challenge Part 4 & 5
Today I finished the Xamarin Challenge part #4 and #5. In the rest of this post you can see what the two new challenges are about and how I completed them. In case you missed the first three parts or you are just curious what I am talking about here, take a look a few lines below, there you can find a link to that first post.
Fast forward:
Xamarin Challenge #4
In the fourth challenge we have to integrate authentication in our app. So we will continue with the Azure Mobile App from challenge #3.
First I configured authentication in the Azure Mobile App. In the mobile app, from the previous challenge, I selected “Authentication” under “Settings”.
I was going with “Microsoft” as authentication provider.
To get the “Client Id” and the “Client Secret” I followed this guide.
Basically all it takes is a login to the application registration site from Microsoft. There you hit add, select a name, copy the id and generate / copy the password. Very important: Don’t forget to click “Add Platform”, select “Web” and enter a callback url.
Back in Azure enter password and id in the given fields (“Application Id” == “Client Id”).
Next I added, as the guidance mentioned, an interface for the authentication in my app.
Then I added the following code to the App.cs file.
To complete the challenge I needed to provide the user with an opportunity to login. As in the challenge description, I added a button for this purpose.
I also added the code from the provided “How to configure your App Service application to use Microsoft Account login” guide, to setup the actual login, with the provider we selected earlier.
If I now open my app, it looks like this.
After entering the credentials, one has to accept the permission the app needs (unfortunately in german).
If everything worked out, the user is logged in.
And challenge #4 is completed!
Xamarin Challenge #5
The last part of the Xamarin Challenge, part #5, wants us to receive our credit – the diploma.
Targets:
- Retrieve a SAS token from the backend.
- Retrieve an image from Azure Blob Storage with the given token.
- Get the diploma.
The Azure Blog Storage account was already set up by the Xamarin Challenge team, so the first thing I did, was to add the Azure Storage NuGet package.
Next I created a new mobile service client for the provided blob storage backend.
Then I created a new button on my frontpage, to retrieve data from the blob storage. I also added an Image element and a new Label for the GUID that I would need later on to receive the diploma.
To retrieve the image and the GUID I added a new clicked event on the button I created above.
This snippet sets the image and also adds the GUID to the label. Now the app looked like in the picture below and I finished part #5 as well.
The last thing to do is to fill out this survey, provide a screenshot, the GUID and wait for the diploma.
