Tag: Aurelia

MVC

Return URL with fragment in ASP.NET Core MVC

Posted on by emadev

I am working on a web project based on Asp.Net MVC and Aurelia and I decided to structure it with part MVC and part Spa (Aurelia). The project also implements a basic authentication system (Asp.Net Core Identity) where if a non-authenticated user is trying to access a secure page it is redirected to the login page, which is standard procedure in these cases.

As you can see the return URL sent in with the query string includes a fragment, used by the Aurelia routing (or any spa framework routing you are using):

http://localhost:14500/Auth/Login?ReturnUrl=%2Fcamp%2F7#sessions

The problem is that the fragment  portion of the URL is never sent to the server and it is therefore ignored. So here is what happens:

The fragment of the URL is not being added to the action url of the form, so when you post the login form the server redirects to a URL without fragment and you are not able to get to the correct page handled by the spa router.

So, I included a little Javascript functions that picks up the return URL from the browser’s location.href and updates the form action with the correct return URL:

$(document).ready(function () {
        var form = $("form")[0];
        var hash = document.location.hash;
        if (hash) {
            if (form) {
                if (form.action) {
                    form.action = document.location.href;
                }
            }
        }
    });

Here is how the form action looks like after this code runs:

Now, when the user logs in and the server redirect to the originally requested URL, Aurelia router picks it up and renders the correct page.

0
DevQuest

JavaScript Framework Syndrome

Posted on by emadev

Learn to let go…and avoid the “fatigue”.

The other day I attended the local Elastic User Group meetup and one of the presentations was about the direction that the new Kibana UI Framework is taking.  CJ Cenizal, an excellent presenter, introduced us to the new UI framework on which all Kibana development will be based upon.  The main point was that the company will now move from AngularJS to React; reason being the idea of making the Kibana UI fully componentized.  Despite the fact that Angular 2 is the natural progression from AngularJS and it is completely component based, they still opted in favor of React.  One other important reason, CJ gave us, was that the core team of developers were very comfortable with React and somehow less comfortable with Angular2, which in my opinion made total sense.

As you can imagine, the questions from the audience kept on coming: “…why React when Angular 2 is also component based?”, “…we like React, but we think the ecosystem of Angular 2 is larger/stronger and would work better for Kibana…”, etc.  CJ did a great job in answering all those questions and more, but the more he was making the point for React the more the audience was questioning their decision.  I was getting irritated about it; I am not a particular fan of React nor Angular 2 per se, but I was respecting and understanding CJ and his team decision.  At that point it dawned on me that the guests where not trying to question the decision, they where trying to find within themselves the  answer to the ultimate question: “What JavaScript Framework should I use for my projects?”.

If you pay attention to the community and read enough blog posts you realize that the “masters” out there always respond to the above questions with something like: “…it depends.  Use the right tool for the right job…”.  But we do not like to hear that as it requires a lot of prep work before actually building something, we want a straight answer that we can apply all the time to everything (or almost everything).  I want an expert that tells me: “Considering all options, pros and cons, just use Angular 2 (or Aurelia or React or Vue or …)”.

I know that the audience was just looking for the final answer;  they were just trying to finally breath and stop evaluating all scenarios; but mostly they just want to code and PRODUCE.   They wanted a “resolve”.  Not that I am immune from this JavaScript fatigue, but somehow the above realization immensely helped me to calm down; and just trust that the framework decisions, taken at that moment, is the correct one for the time being.

I hope this “2 minutes with the shrink” will help you finding piece in this quest. Please leave a comment and let me know.

0