Azure App Service provides very convenient way to publish your web application on internet. You can directly publish the web application from Visual Studio publish.
We considering a simple web application created using Visual Studio and published in Azure. So, the application will have a URL,
app-name is the app service name. You can find detailed steps in my previous blog article.
For following all steps in this article, we will need Azure Subscription. If you don’t have an Azure subscription, create a free account before you begin.
Google Developers Console
Refer previous blog article detailed steps on creating the developers console account and registering an application.
In the same application, select Credentials from the left navigation. Here we need to make two changes as mentioned below. Make sure to replace the
app-name with actual name of app service.
https://app-name.azurewebsites.net, as now the requests will directly be initiated by App Service instead of Azure AD.
- Authorized Redirect URIs, set this to
Once these two modifications are done, save the settings. Copy the
Client ID and
Client Secret values from here and keep it with you. These will be required in App Service configurations.
Facebook for Developers
Refer my previous blog article which explains all the steps for registering and creating first application in Facebook for Developers.
Select the application from the dashboard. Go to the Facebook Login option under Products and select Settings. Under Valid OAuth Redirect URIs, add a new URI –
https://app-name.azurewebsites.net/.auth/login/facebook/callback to allow redirect from the App Service. Do not forget to replace
app-name with actual name of the service. Then hit the Save Changes button.
In the left pane, select Settings > Basic. In the App Secret field, select Show. Copy the values of App ID and App Secret. You use them later to configure your App Service app in Azure.
App Service Configurations
Login to Azure Portal for following next steps.
In the published app service, select the Authentication / Authorization option from the left navigation. Then enable the app service authentication by turning it on.
We also can see another input – Action to take when request is not authenticated. This is the important input in this demo. Select Log in with Google option.
When you set this input, your app requires all requests to be authenticated. It also redirects all unauthenticated requests to Google for authentication.
Login with Google
Select Google provider from the above screen and enter
Client ID and
Client Secret copied form the Google Developers Console. Then click on OK.
Login with Facebook
No select Facebook provider and enter
App ID and
App Secret copied from the Facebook for Developers portal and click on OK.
Run and Verify
Now if you run the application, the application will by default redirect the user to Google login page. This is because we have set Action to take when request is not authenticated to
Login with Google. If we change this setting to
Login with Facebook, and then run the application, users will be redirected to Facebook login page.
So, we have successfully configured authentication without changing the application code.
App Service provides
authentication, but it
doesn't restrict authorized access to your site content and APIs. You need to authorize users in your app code.
Let’s say you want to allow only specific users to view all functionality of your app, while other users should have read-only access. The above configurations will help to authenticate the users, but we will need custom authorization logic in the application code to authorize the users and show right pages them.
So, in my opinion, this option may be good in initial phase of project to switch on authentication on the application until your authentication and authorization decisions are made by the development / architect team.
I hope you enjoyed this article. Let me know your thoughts.