How to pass parameters for Lightning component called via quick a action

I have a lightning component which is included inside a visualForce page.
When accessing the page directly with a url parameter ‘Id’ this works fine
(component loads inside the vf page and display record details)

My next step is to call this vf page from a quick action, so I created a quick action and referred the vf page.

PROBLEM; when call from the quick action it doesn’t set value to the “Id” parameter

Can someone tell me what’s wrong here, and provide an explanation?

VF page

<apex:page standardController="Account">
    <apex:includeScript value="/lightning/lightning.out.js" />
    <apex:stylesheet value="/resource/slds0120/assets/styles/salesforce-lightning-design-system-vf.css"/>
    <apex:includeLightning />
    <div class="slds" style="margin-top:10px;margin-left:10px;"> 
        <div id="lightning" />
    </div>

    <script>
        var accountId = "{!$CurrentPage.parameters.id}";
        console.log(accountId);
        $Lightning.use("c:AccountListWrapper1", function() {
          $Lightning.createComponent("c:AccountsList",
                { "Id" : accountId },
                  "lightning",
                  function(cmp) {
                      alert("{!$CurrentPage.parameters.id}");
                    // do some stuff
               });
        });
    </script>
</apex:page>

HELPER.JS (this.getURLParameter(‘id’); returns null when called via quick action 🙁 )

    ({
     doInit : function(cmp, event, helper) {
         var accountId = this.getURLParameter('id');
         var action = cmp.get("c.getAccount");
         var params = {"id":accountId};
        action.setParams(params);

        var self = this;
        action.setCallback(this, function(response) {
            try {
                self.actionResponseHandler(response, cmp, self, self.gotAccount);
            }
            catch (e) {
                alert('Exception ' + e);
            }
        });
        $A.enqueueAction(action); 
    },
    gotAccount : function(cmp, helper, acc) {
        console.log(acc);

        cmp.set('v.account', acc);
    },
    getURLParameter : function(param) {
        var result=decodeURIComponent((new RegExp('[?|&]' + param + '=' + '([^&;]+?)(&|#|;|$)').exec(location.search)||[,""])[1].replace(/\+/g, '%20'))||null
        return result;
    },
    actionResponseHandler : function (response, component, helper, cb, cbData) {
        try
        {
            var state = response.getState();
            if (state === "SUCCESS") {
                var retVal=response.getReturnValue();
                console.log('response');
                console.log(response);
                cb(component, helper, retVal, cbData);
            }
            else if (state === "ERROR") {
                var errors = response.getError();
                if (errors) {
                    if (errors[0] && errors[0].message) {
                        alert("Error message: " + errors[0].message);
                    }
                } 
                else {
                    alert("Unknown error");
                }
            }
        }
        catch (e) {
            alert('Exception in actionResponseHandler: ' + e);
        }
    }
})

Answer

<aura:attribute name="accountId" type="String" />

var accountId = "{!$CurrentPage.parameters.id}";

$Lightning.use("c:AccountListWrapper1", function() {
$Lightning.createComponent("c:AccountsList",
          { "accountId" : accountId },
            "lightning",
             function(cmp) {
                // do some stuff
           });
 });

var accountId = cmp.get("v.accountId");

Attribution
Source : Link , Question Author : Hasantha , Answer Author : Hasantha