DEV Community: nilanjana

Connect an Azure Runbook with Azure using Powershell

nilanjana — Thu, 23 Jul 2020 17:41:43 +0000

Azure-Runbook

Azure Runbook is tool, used for automatically deploy your code to azure. It is a great tool for azure automation. Normally there are 3 ways to write an azure runbook --> graphical, using PowerShell, using python.

We can create a runbook as a workflow also.
The basic difference between a workflow and a normal runbook is, in workflow we can use checkpoints to resume any operations if any error occurs also we can use the power of parallel processing to do multiple tasks in parallel.

Why do we need to connect runbook to azure?

The answer is pretty much simple and straight forward.
We need to connect Runbook With azure because if it is not connected to azure then how the runbook will do modifications or automation on Azure resources?
In other words, we can't access any azure resources from outside and for that purpose, we need to do the connection and for this purpose service principle is a great tool.

let's have a look at what is `service principle` :

service principle is an identity that is used to access azure resources, more specifically a combination of required ids or tokens to access azure resources like VMs.

Connect an Azure Runbook with Azure using Powershell :

In this article, I will discuss how to connect an Azure runbook using the service principle.

Connect an Azure Runbook with Azure using Powershell using service principle :

After creating a runbook one needs to write the following piece of code in order to connect the runbook with azure.

 Function connect{
        write-output 'Connecting .......'
        
        #CONNECTION 
        $conn = Get-AutomationConnection -Name "AzureRunAsConnection"
        $azConn=Connect-AzAccount -ServicePrincipal `
                -Tenant $Conn.TenantID `
                -ApplicationId $Conn.ApplicationID `
                -CertificateThumbprint $Conn.CertificateThumbprint
        #....

        write-output 'Connected ...'
    }

now just call the connect function to connect your runbook with Azure resources.

Code explanation :

1) Defining the function connect :

         Function connect{
             #my code goes here
          }

2) Use the default service principle AzureRunAsConnection using Get-AutomationConnection cmdlet to get the service principle automation connection in your runbook .
Now we get the service principle connection in the conn variable.

This step is just knowing the credentials which are required to connect to Azure, and here the type of the credential is service principle.

You can also use any other service principle but You have to create that first.

For using Get-AutomationConnection cmdlet the Az.automation module must be imported in your azure automation account's module section.

3) Connect to azure by using the Connect-AzAccount cmdlet and a service principal account, for which we need the parameter Tenant, ApplicationId (Application id), CertificateThumbprint.

Tenant - A tenant represents an organization in an azure ad. The tenant id is a universally unique number.

Certificate Thumbprint - Certificate Thumbprint is used to identify which certificate to use for a particular for a cloud service.

-ServicePrincipal denotes the type of credential.

We use the tenant id, application id, certificate thumbprint of the conn variable using . operator in order to connect azure from the runbook.

This step is used to connect with azure from the runbook using the credentials which we got from the previous step.

Finally your connection to azure from runbook is done ...

Popup form using jQuery

nilanjana — Wed, 23 Aug 2017 12:43:06 +0000

Pop-up window

Pop-up window is a child window inside the parent window that blocks interaction with parent window.There are also some options in a pop-up window to react with.Now a days websites use this feature a lot.This window is mainly used for collection of review of a website or for a feedback.Some websites use Pop-up box as a login window.Making a pop-up box is very easy using jQuery.

jQuery

jQuery is a cross platform,free,open source JavaScript library.It is used as a client side programming language with html.jQuery is supported by most of the browsers.The main purpose of using jQuery is to obtain a dynamic website.jQuery is used for animation,DOM,events,ajax etc.

Here's the code for making a simple jQuery feedback form


<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>popup</title>
</head>  
<body style="background-image: url('aa.jpg');background-image: cover;">

    <!--review button-->
    <input type="button" id="reviews" value="reviews" name="" style="margin-left: 35%;margin-right: 20%;margin-top: 2%;margin-bottom: 2%;height: 50px;background-color: #884FF3;text-align: center;width: 10%;border-radius: 5%;
    position: fixed;">

    <!--feedback button-->
    <input type="button" id="feedback" value="feedback" name="" style="margin-left: 55%;margin-right: 20%;margin-top: 2%;margin-bottom: 2%;height: 50px;background-color: #884FF3;text-align: center;width: 10%;border-radius: 5%;
    position: relative;">
    <!--welcome message -->
    <div class="pop" style="z-index: 4;margin-left: 20%;margin-right: 20%;margin-top: 10%;margin-bottom: 2%;height: 30%;background-color: #768b8e;text-align: center;border-radius: 5%"><br/><h1>   WELCOME </h1><br></div>

    <!--review -->
    <div id="pop1" z-index="1"  style="margin-left: 20%;margin-right: 20%;margin-top: 5%;margin-bottom: 2%;height: 30%; background-color: #40858e;text-align: center; position: fixed; display: none; width: 60%;border-radius: 5%"><h2> REVIEWS </h2>
<h3 >&nbsp&nbsp&nbsp&nbsp&nbsp Name  :  <input type="TextBox" style="opacity: 0.5;width: 25%;" id="txtNamef" name="txt" placeholder=" you can't edit this field" value="" disabled="disabled"></h3>
 <h3>Feedback : <input type="TextBox"  style="opacity: 0.5;width: 25%;" id="txtf" name="txt" placeholder=" you can't edit this field " value="" disabled="disabled"></h3>
   <input type="button" class="close" value="close" width="1000px">

    </div>


<!--feedback-->
    <div class="pop-feed" style="background-color: #995892:; position:fixed;display: none; ">

    <div id="pop2" z-index="1"; style="margin-left: 20%;margin-right: 20%;margin-top: 5%;margin-bottom: 2%;height: 40%;background-color: #40858e;text-align: center;width: 60%;border-radius: 5%;
    position: fixed;">
    <h2> &nbsp&nbsp&nbspFEEDBACK</h2>
        <h3>  &nbsp&nbsp&nbsp&nbsp&nbsp  Name  :  &nbsp&nbsp&nbsp <input style="opacity: 0.5;width: 25%;" type="TextBox" id="txtName" class="txt" name="txt" placeholder="enter your name " value=""></h3>
    <h3>Feedback  : &nbsp&nbsp <textarea style="opacity: 0.5;width: 25%;" id="txt" class="txt" name="txtFeedback" value="" placeholder="enter your opinion"></textarea> </h3>
    <br>
        <input type="submit" " value="FEEDBACK" disabled="disabled" style="height: 15%;background-color: #884FF3;text-align: center;width: 15%;border-radius: 5%;
    ">&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp
    <input type="button" class="close" value="CLOSE" style="height: 15%;background-color: #884FF3;text-align: center;width: 10%;border-radius: 5%;">
    </div>
    </div>

    <script type="text/javascript" src="jquery.js"></script>
    <script type="text/javascript" src="popup.js">
    </script>

</body>
</html>


$(document).ready(function(){
    $('.pop').delay('2000').fadeOut('5000');

    $('.close').click(function(){
        $('#pop1').hide('slow');
        $('#pop2').hide('slow');
    });


    $('.txt').change(function(){
    $(':submit').removeAttr('disabled');
    });
    $(':submit').click(function(){

        $('.txt').attr('value','nilanjana');
        alert('feedback submitted successfuly');
        var txtName =  $('#txtName').val();
        var txt =  $('#txt').val();
        alert(' NAME :'+txtName+'       FEEDBACK :'+txt);
        $('#txtNamef').attr('value',txtName);
        $('#txtf').attr('value',txt);
        $('.pop-outer').fadeOut('slow');
        $('#pop1').fadeIn('slow');
        $('#pop1').delay('3000').fadeOut('slow');

    });


    $('.close').click(function(){
        $('.pop-outer').fadeOut('slow');
    });

    $('#reviews').click(function(){
        $('.pop-outer').hide();
        $('#pop1').fadeIn('slow');
        $('#pop1').fadeIn('fast').toggle();

    });


    $('#feedback').click(function(){
        $('#pop1').hide();
        $('#pop2').fadeIn('slow');
        $('.pop-outer').fadeIn('slow');
        $('.pop-outer').fadeIn('fast').toggle();

    });

});

Explanation of jQuery

Basic syntax of jQuery :$(selector).action();
$ sign: define/access jQuery. A (selector) to find (query).

delay() is a method used to delay some task to perform.
click(function(){code}):click is an event handler which performs some tasks defined in function({code}) .
show()is a method used to show a particular element .It can take the 'slow','fast','milliseconds'values
hide() is a method used to hide a particular element.It can take the 'slow','fast','milliseconds'values
change() is a event handler used to know about any change of an element,(it is only valid for textbox, select,input,textarea).
removeAttr('attribute')method is used to remove the attributefrom an element.
attr('value','changed value')is used to change a specific attribute's valueto changed value.
val()method is used to return the value of value attribute.
fadeIn() method gradually changes the opacity of the selected element from hidden to visible.
fadeout()is a method used to vanish some element by fading that out;it gradually changes the opacity of the selected element from visible to hidden .
alert('message')is used to display an alert box with specified message.

Explore the code here : Pop-up form using jQuery
on codepen