When viewing a web application as a user, what are some reliable ways to determine if the app is a single page application (SPA)?
Depending on the framework used, the URL might make extensive use of hashtags. IF you click on navigation links, etc and the URL looks like http://somesite/#/some/route, then it is using hashtag-based routing and is a SPA. Angular 1.x did this for a while. However, newer routing engines use HTML5 features that make the route look like a normal URL: http://somesite/some/route. This URL would be indistinguishable from a non-SPA site. In that case, the only way to tell it is a SPA is to look at the javascript code (Does it use a SPA framework) and/or network traffic (when you click a link does it get the whole page, or just some JSON needed for the current view).
Related
A colleague showed me Lighthouse on the Chrome browser. I have a single page application (SPA), and I'm able to run it against the base URL of my application.
However, all subsequent screens are rendered by client-side JavaScript without a change to the URL in the browser.
How can I test the rest of my site?
The only way is to switch project to server side rendering, like Angular Universal
update: found this issue https://github.com/GoogleChrome/lighthouse/issues/5187
If you can't switch your project to server side rendering as Alexey Semerenko said, you can consider using another testing tool like Sitespeed.io which allows you to define user actions as a script to browse every pages of your application.
After your test you will gather the same kind of metrics.
So I've set up an HTML5 single page application, and it's working well. The page is at /App/ and when some one goes to content it looks like /App/Content/1234.
One problem: If the user refreshes the page the server can't find that URL because it doesn't actually exist. If I send them to /App/#/Content/1234, they're golden, but what is the best way to do this? I have a LOT of different styles of URL under /App.
What is the best way to globally catch any request under ~/App/(.*) and redirect it to ~/App/#/$1?
The only route registered in MVC is the standard OOTB route.
Sounds like your server is not re-writing the urls to the app's base URL.
The URL re-writing needed on the web server is server-dependent. For Apache, you'd use mod_rewrite.
Instead, switch Angular to the "Hashbang mode" (the default) so the urls will all store the local state after the # in the url.
I don't want my apps to require server configuration changes, so I recommend hashbang mode.
See AngularJS docs. See section "Hashbang and HTML5 Modes" The HTML5 mode section describes all the configuration issues needed to support HTML5 mode for the urls.
This awesome dude describes how to fix this here.
In brief:
Remove MVC nugets (unless you use MVC controllers for anything) -
you can keep the Web API nugets. Keep WebPages and Razor packages.
Also delete MVC controllers and views.
You can keep using .cshtml
files with some web.config modifications. You'll need this for
bundling.
Finally you add a rewrite rule on web.config to point all urls (excluding content, images, scripts etc) to index.html
I've been doing the html and css for a site, sending it off to a guy to implement in a web server. I get a call from the designer freaking out about the progress, saying the clients aren't happy. He wants me to personally integrate my css with what's on the site. The site is done in ASP.net, time is short, and I'm a little in over my head. I have an understanding of how php works, but have never worked extensively with it.
Looking at the stuff on the ftp, I can't even find equivalent of the index.html file (I know that when I go to the site itself, there is nothing after the base url, i.e., www.site.com/ brings me to the homepage.)
Can anyone give me a few tips or links as to what I am to do with this, or where to even being navigating this site?
EDIT: It's -not- a .Net Web Application, from the looks of it.
ASP.Net can be run in a compiled or a scripted environment. It is important to understand which environment your client has. If it is completely scripted, then you are likely looking for the default.aspx file and it's contents. If it is a compiled environment, you may be in for a ride. A compiled site may incorporate "master pages" as a templating engine, and then you'll need to apply your html/css modifications in several places.
You should start with the default.aspx page if there is one. Look for master page directives (it'll be named something like masterpage.master). If there isn't one, then you're in luck you'll just need to implement your changes on a page by page basis. The aspx page will be in a templated xml format so avoid touching tags that involve touching
If you are making changes to divs and structures of that nature, you may need to modify the CssClass attribute of the controls. I would recommend however that you make a back up, give it a shot, and under no circumstances attempt to do something that you aren't really ready to do. You will only anger the client and ruin your rep. It may actually be prudent to contact an actual ASP.Net developer to analyze the files separately and determine what you need to do.
I suggest that you read the Wikipedia article about ASP.NET to get familiarized with it as it summarizes the basic building structures.
Then, just to get you started: take a look at the more recent ASP.NET MVC (Model-View-Controller) paradigm. There's also development in what is called ASP.NET WebForms.
For example: when you go to www.site.com/ (known as friendly URLs) it may be redirecting you to an action method inside a controller. It's called routing. There's also URL rewrite.
In the MVC world a Controller can send/redirect the user to a specific View/Page.
A View (.aspx form/page) that contais HTML markup and CSS on the server side is basically an HTML page (.htm) page that'll be rendered on the client side.
I'm currently working on a concept for a reverse proxy to basically relay responses and requests between the user and an otherwise invisible website. So basically the user goes to a site, let's say www.myproxyportal.com, where it is possible to access a website (in an iframe) in the webserver's intranet which isn't made public (for example internal.myproxyportal.com).
I've been working on a solution where I translate request objects to the desired location and return that response to the website. Works great, except for stuff like CSS links, IMG's, etc. I can do the translation of course, but then the link would go to internal.myproxyportal.com/css/style.css and this will never work from the outside.
How to approach such a thing?
Are there any out of the box solutions maybe?
EDIT: I found this, which is very similar to what I have written so far, but it also lacks support for external images, css, javascript, etc.
You can change settings in IIS to route all requests through ASP.NET pipeline, not just .aspx pages. Then simply create an HttpHandler to handle those in your proxy.
By default, IIS doesn't run "static" content requests through ASP.NET engine.
Apache has a pretty slick reverse proxy built-in, I use it extensively.
See more here: http://www.apachetutor.org/admin/reverseproxies
I've noticed a lot of Microsoft sites have the *.MSPX extension. While I'm very familiar with ASP.NET, I've not seen this extension before.
Does anyone know what this identifies?
A few internet searches led me to http://www.microsoft.com/backstage/bkst_column_46.mspx, but it was a dead link. Fortunately, it was archived on the Wayback Machine and you can read it here:
http://web.archive.org/web/20040803120105/http://www.microsoft.com/backstage/bkst_column_46.mspx
The .MSPX extension is part of the "Microsoft Network Project," which according to the article above, is designed to give Microsoft's sites a consistent look-and-feel worldwide, as well as keep the design of the site seperate from the content. Here's the gist of the article:
The presentation framework includes a custom Web handler built in ASP.NET. Pages that use the presentation framework have the .mspx filename extension, which is registered in Microsoft Internet Information Services (IIS) on the Web servers. When one of the Microsoft.com Web servers receives a request for an .mspx page, this custom Web handler intercepts that call and passes it to the framework for processing.
The framework first checks to see whether the result is cached. If it is, the page is rendered immediately. If the page is not cached, the handler looks up the URL for that page in the table of contents provided by the site owner (see below) to determine where the XML content for the page is stored. The framework then checks to see if the XML is cached, and either returns the cached content or retrieves the XML from the data store identified in the table of contents file.
Within the file that holds the content for the page, XML tags identify the content template to be used. The framework retrieves the appropriate template and uses a series of XSLTs to assemble the page, including the masthead, the footer, and the primary navigational column, finally rendering the content within the content pane.
I think it's an XML based template system that outputs HTML. I think it's internal to MS only.
Well, a little googling found this:
The presentation framework includes a
custom Web handler built in ASP.NET.
Pages that use the presentation
framework have the .mspx filename
extension, which is registered in
Microsoft Internet Information
Services (IIS) on the Web servers.
When one of the Microsoft.com Web
servers receives a request for an
.mspx page, this custom Web handler
intercepts that call and passes it to
the framework for processing."
I'd like to find out more info though.
I love you guys, i was asking myself also many times, why MS uses .mspx and what it is at all?! :)
That time i couldn´t find any informations quickly and assumed it would just be something on top of asp.net or maybe not even that, because you should be able to assign the same asp.net cgi dll to .mspx also easy too ;)
But, surely, it can be anything.. also an "special" CGI itself (completely beside ASP.NET), which processes that request with much better / much more cache-use, easier editing and so on..
The end of the story was, that i came accross the view, that maybe it´s not important to know, what .mspx exactly is :)