3

Scenario:

  1. Using Lightning Out I have a VF page display a Lightning Component.

  2. The VF page passes values from URL parameters to the component attributes.

  3. If specific parameters are passed the component automatically performs an action.

  4. When that action completes the component is updated with data received from a push topic notification.

Problem If the user refreshes the browser the action is performed again and this is BAD

Question: How can I indicate that the action has already been performed so on browser refresh it is not performed again?

  • I thought about adding a URL parameter so when the refresh happen the VF page sees it and passes it back to the component. But I do not see a way to add a URL parameter to the containing VF page.

Is there a way to do this? Is there another way?

If I could add a URL parameter like completed=true then when the user refreshed the VF page it would be included and I could prevent the action.

No real code needed here as I believe the concept as I laid it out is pretty straightforward...

3

Step 5: have your lightning component action callback raise an event that your VF page JavaScript can listen for and have the VF page navigate away or refresh without params, etc.

A couple examples of the VF markup to handle an event raised by a lightning component:

| improve this answer | |
  • I need to not navigate away, but this gives me an idea to try. I can use the event to add a param to the page and thus hopefully it will persist on refresh.... – Eric Jun 24 '17 at 5:28
1

So it seems that the way to do this is NOT in visual force or Lightning per say.

Again, problem is when the page is loaded an action is immediately performed. I do not want this action performed again if the page is refreshed, reloaded, etc without the user navigating away from the page first.

This question/answer seems to do exactly what I need:

https://stackoverflow.com/questions/5004978/check-if-page-gets-reloaded-or-refreshed-in-javascript

So in my VF page that uses Lightning Out I set a var as follows:

    var nonce = false;
    //https://stackoverflow.com/questions/5004978/check-if-page-gets-reloaded-or-refreshed-in-javascript
    if (window.performance) {
        if (performance.navigation.type == 1) {
            nonce = true;
        }

    } else {
        console.info("window.performance does not work on this browser");
    }

Then I pass that nonce var to a property in my lightning component that will short circuit the component if it is true (reloaded F5, CMD-R or browser refresh button).

This does not solve for browsers that do not support window.performance (works on Safari, Firefox, and Chrome. did not test IE) but it is good enough at this point.

Attempts to add a parameter after page load failed and did not carry over to a browser refresh. Debugging in Apex showed that the param was added but on refresh it was not present. Maybe because you cannot modify the URL without a redirect. Problem with that is the redirect causes it to always end up being true on initial load ugh.

| improve this answer | |

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.