You need to sign in to do that
Don't have an account?
Mangesh Khapre 3
Trailhead challenge error secure lightning javascript code
In this challenge I have to use securefilter library and securely encode the date. I have made the changes as follows-
<aura:component controller="LTNG_Creatures_Controller" access="global" implements="force:appHostable"> <aura:attribute name="creatures" type="string"/> <ltng:require scripts="{!$Resource.securefilters}" /> <!-- CHANGE 1 HERE--> <div class="slds-row slds-align--absolute-center"> <div class="slds-panel slds-size--4-of-6 "> <ui:outputText value="Click the button to get all Creatures" /><BR /> <ui:button label="Get All Creatures" press="{!c.getAllCreaturesAction}"/><BR /> <BR /> <aura:unescapedHTML value="{!v.creatures}" /> </div> </div> </aura:component>
({ getAllCreaturesAction : function(component, event, helper) { var getAccountsAction = component.get("c.getAllCreatures"); getAccountsAction.setCallback(this, function(response) { var state = response.getState(); if (component.isValid() && state === "SUCCESS") { var results = response.getReturnValue(); // Let's create a beautiful table with results: var outputT = "<table class=\"slds-table slds-table--bordered slds-table--cell-buffer \">"; outputT += "<thead><tr class=\"slds-text-title--caps\">"; outputT += "<th scope=\"col\"><div class=\"slds-truncate\" title=\"Id\">Id</div></th>"; outputT += "<th scope=\"col\"><div class=\"slds-truncate\" title=\"Name\">Name</div></th>"; outputT += "<th scope=\"col\"><div class=\"slds-truncate\" title=\"Description\">Description</div></th>"; outputT += "<th scope=\"col\"><div class=\"slds-truncate\" title=\"Region\">Region</div></th>"; outputT += "</tr></thead><tbody>"; for (var i=0;i<results.length;i++) { outputT += "<tr><th scope=\"row\" data-label=\"Id\"><div class=\"slds-truncate\" title=\"Id\">" + results[i].Id + "</div></th>"; outputT += "<td data-label=\"Name\"><div class=\"slds-truncate\" title=\"Name\">" + results[i].Name + "</div></td>"; outputT += "<td data-label=\"Name\"><div class=\"slds-truncate\" title=\"Description\">" + results[i].Description__c + "</div></td>"; outputT += "<td data-label=\"Company\"><div class=\"slds-truncate\" title=\"Region\">" + results[i].Creature_Region__r.Name + "</div></td></tr>"; } outputT += "</tbody></table>"; outputT = secureFilters.html(outputT); // CHANGE 2 HERE component.set("v.creatures", outputT); } }); $A.enqueueAction(getAccountsAction); } })
However it is giving me error that -
Challenge Not yet complete... here's what's wrong: The 'LTNG_SecureFilters_Challenge' controller does not appear to be using the secureFilters resource properly.
As per my understanding this is right. what might be causing this error? any help?
<aura:component controller="LTNG_Creatures_Controller" access="global" implements="force:appHostable"> <aura:attribute name="creatures" type="string"/> <ltng:require scripts="{!$Resource.securefilters}" /> <!-- CHANGE 1 HERE--> <div class="slds-row slds-align--absolute-center"> <div class="slds-panel slds-size--4-of-6 "> <ui:outputText value="Click the button to get all Creatures" /><BR /> <ui:button label="Get All Creatures" press="{!c.getAllCreaturesAction}"/><BR /> <BR /> <aura:unescapedHTML value="{!v.creatures}" /> </div> </div> </aura:component>
({ getAllCreaturesAction : function(component, event, helper) { var getAccountsAction = component.get("c.getAllCreatures"); getAccountsAction.setCallback(this, function(response) { var state = response.getState(); if (component.isValid() && state === "SUCCESS") { var results = response.getReturnValue(); // Let's create a beautiful table with results: var outputT = "<table class=\"slds-table slds-table--bordered slds-table--cell-buffer \">"; outputT += "<thead><tr class=\"slds-text-title--caps\">"; outputT += "<th scope=\"col\"><div class=\"slds-truncate\" title=\"Id\">Id</div></th>"; outputT += "<th scope=\"col\"><div class=\"slds-truncate\" title=\"Name\">Name</div></th>"; outputT += "<th scope=\"col\"><div class=\"slds-truncate\" title=\"Description\">Description</div></th>"; outputT += "<th scope=\"col\"><div class=\"slds-truncate\" title=\"Region\">Region</div></th>"; outputT += "</tr></thead><tbody>"; for (var i=0;i<results.length;i++) { outputT += "<tr><th scope=\"row\" data-label=\"Id\"><div class=\"slds-truncate\" title=\"Id\">" + results[i].Id + "</div></th>"; outputT += "<td data-label=\"Name\"><div class=\"slds-truncate\" title=\"Name\">" + results[i].Name + "</div></td>"; outputT += "<td data-label=\"Name\"><div class=\"slds-truncate\" title=\"Description\">" + results[i].Description__c + "</div></td>"; outputT += "<td data-label=\"Company\"><div class=\"slds-truncate\" title=\"Region\">" + results[i].Creature_Region__r.Name + "</div></td></tr>"; } outputT += "</tbody></table>"; outputT = secureFilters.html(outputT); // CHANGE 2 HERE component.set("v.creatures", outputT); } }); $A.enqueueAction(getAccountsAction); } })
However it is giving me error that -
Challenge Not yet complete... here's what's wrong: The 'LTNG_SecureFilters_Challenge' controller does not appear to be using the secureFilters resource properly.
As per my understanding this is right. what might be causing this error? any help?
Jeff Douglas
Trailhead Developer Advocate
All Answers
May I suggest you please double check with Apex controller which might be causing the issue. Please let us know if any further information is required.
Happy to help.
Thanks,
Nagendra
This is the controller code, which is not changed. and I can see isAccessible() is used here. However, not sure if anything needed to be addded in this as well.
public with sharing class LTNG_Creatures_Controller {
@AuraEnabled
public static List<Creature__c> searchCreatures(string creatureName) {
if(Creature__c.SObjectType.getDescribe().isAccessible()) {
string searchTerm = '%' + string.escapeSingleQuotes(creatureName) + '%';
return [SELECT Name, Id, Description__c, Type__c, Creature_Region__r.Name from Creature__c WHERE Name like: searchTerm];
}
else {
return null;
}
}
@AuraEnabled
public static List<Creature__c> getAllCreatures(){
if(Creature__c.SObjectType.getDescribe().IsAccessible()){
return [SELECT Name, Id, Description__c, Type__c, Creature_Region__r.Name from Creature__c];
} else {
return null;
}
}
}
Jeff Douglas
Trailhead Developer Advocate
That worked. Thaks.
So as to understand what I did wrong there was-
So we had to secure the value which is returning from the server.
If this is right.. would it be ok to just write -
secureFilters.html(results)PS:Your hat looks cool :)
Replace highlighted code in LTNG_SecureFilters_Challenge controller.js
for (var i=0;i<results.length;i++) {
outputT += "<tr><th scope=\"row\" data-label=\"Id\"><div class=\"slds-truncate\" title=\"Id\">" +secureFilters.html(results[i].Id)+ "</div></th>";
outputT += "<td data-label=\"Name\"><div class=\"slds-truncate\" title=\"Name\">" +secureFilters.html(results[i].Name)+ "</div></td>";
outputT += "<td data-label=\"Name\"><div class=\"slds-truncate\" title=\"Description\">" + secureFilters.html(results[i].Description__c) + "</div></td>";
outputT += "<td data-label=\"Company\"><div class=\"slds-truncate\" title=\"Region\">" +secureFilters.html(results[i].Creature_Region__r.Name) + "</div></td></tr>";
}