How to use the force:navigateToURL from flow

Question

I have a simple flow which I start with a button. This has a screen component with a lightning component. I expect on clicking the button to be navigated to a record. To keep it simple, I created a string variable with an Id of an existing record. I currently get the error:

This page has an error. You might just need to refresh it. Action.prototype.finishAction Error [Failed to initialize a component [Cannot read property 'g' of undefined] Callback failed: serviceComponent://ui.interaction.runtime.components.controllers.FlowRuntimeController/ACTION$runInterview] Failing descriptor: {flowruntime:flowRuntimeV1}

What am I missing?

Ligning component

<aura:component implements="force:lightningQuickAction,lightning:availableForFlowActions,lightning:availableForFlowScreens">
   <aura:attribute name="recId" type="String"/>
    <aura:handler name="navigateToURL" value="{!this}" action="{!c.navigateToURL}"/>
</aura:component>

({navigateToURL : function(component, event, helper) {
        // Get the record ID attribute 
        var record = component.get("v.recId"); 
        var aUrl = "/"+record;
        var urlEvent = $A.get("e.force:navigateToURL");
        urlEvent.setParams({
            "url": aUrl,
            "isredirect":true ,
        });
        urlEvent.fire();
    }})

<design:component>
    <design:attribute name="recId" label="Id of the record" />
</design:component>

Answer 1

I dont think we can use handler like this

  <aura:handler name="navigateToURL" value="{!this}" action="{!c.navigateToURL}"/>

you can use init handler though

<aura:handler name="init" value="{!this}" action="{!c.navigateToURL}"/>

Also you need to put "StringId" in input variable which is Below The Api name of the component in Flow