In traditional web application i generally write JSP which renders html code to browser and communicate to server using form submit or through Java script. This generally involves page transition from one to another using browser refresh many times.
Now with the improved HTML5 i still can use the same approach but i want to achieve more of a desktop application look and feel which means no browser refresh. But i am really confused how it can be achieved.
Do i need to write a big single html5 file which contains all the web application code and show or hide divisions using java script that we need to show at that point of time. Communicate to server using java script.
Or, Just have a minimal first html5 page where user lands for the first time. Later on create all the HTML5 content dynamically using java script and communicate to server using java script. This looks more difficult.
Or, is there a way we can move from one page to other without the effect of page loading/refresh etc.
In general using HTML5 what should be the approch?
For example of a shopping cart, the first view to the user is list of items to purchase. Then user moves to next view such as details of an item. The next view can be payment.
If you have some resource or example to explain it, it would be great.
Related
I'm currently working on a bot to automate a buying process on a NFT project.
Until now, I was using selenium in order to automate the process by loading specific pages, clicking buttons, filling passwords, etc...
Everything was working fine except that it was too long and I needed something really faster to solve my problem.
I was using headless browser and I disabled image loading, but nothing made the process fast enough.
At the begining of the project, I wanted to perform the buying process using only requests but it was not possible since I needed to provide a "signature" inside the payload of the request, including some hashes that I'm not able to create/find (blockchain stuff).
So here is my question:
Is there a way to download/get an HTML page including its javascript in order to trigger the button that performs the buying process ?
It must be fast and I need to be logged in to access the page.
Thank you ! 🙂
I don't know if this is a PHP or JavaScript code, but what do you call this technique about changing web content? For an instance, the MDC Web demo site. It has an empty content if you view the source, but completely contains all elements if you inspect the page.
Regarding PHP, I think it is done with a PHP code in MDC Web's case, but how exactly? Is this a common technique? I wanna know this method coz it's useful in some cases where there's actually no need to reload the page, but able to change the content and URL.
This is called Single Page Applications (a.k.a SPA).
A single-page application (SPA) is a web application or web site that interacts with the user by dynamically rewriting the current page rather than loading entire new pages from a server. This approach avoids interruption of the user experience between successive pages, making the application behave more like a desktop application more.
I've been learning about angularjs and have been very confused about how angular manages to change pages without refreshing and yet have a completely different view.
Are they actually changing the page URL or just hiding all the elements of on page and showing the other?
This video by CodeSchool explains it quite well.
AngularJS is just a tool that allows you to build single-page web applications with relative ease. What you are looking for is actually the definition of Single-Page Application:
Single-Page Applications (SPAs) are Web apps that load a single HTML page and dynamically update that page as the user interacts with the app. SPAs use AJAX and HTML5 to create fluid and responsive Web apps, without constant page reloads. However, this means much of the work happens on the client side, in JavaScript.
Also, from http://www.johnpapa.net/:
A SPA is fully (or close) loaded on the initial page load, it’s key
resources are preloaded, and progressively downloads features as
required.
And, more specific to your particular question:
When a user clicks on a menu item, the SPA sees that url and
translates it to a View that should be displayed. If the view has not
been seen before, the application may make an HTTP request to retrieve
the HTML template for the view. Then it will compose the view, fill in
the template, and display the view in the appropriate location within
the shell. If the view has already been viewed once, the browser may
have cached it and the router will be smart enough not to make the
request. This is one way a SPA can reduce round-tripping to and from a
server, and thus improve performance.
Keep in mind that this behavior is attained with the use of JavaScript, and does NOT require any specific library or framework (such as AngularJS), although you will probably want to learn how to use one to facilitate the process.
I also recommend you check these resources:
http://johnpapa.net/building-single-page-apps-with-knockout-jquery-and-web-api-ndash-the-story-begins/
http://www.johnpapa.net/pageinspa/
If your url's are mapped with the $routeProvider, you can reload a controller invoking $route.reload().
I am trying to scrape some data from the following web page:
College Board - Georgia Institute of Technology
But the information I need to access is only displayed after pressing the "Applying" tab on the left. Since the URL does not change, how can I simulate pressing the button in order to scrape the HTML?
I am using Python3.3 and the requests module.
According to the page source, the information you need is hidden inside a javascript code and is calculated and rendered after the click on "Applying" link.
requests simply cannot make in-browser user actions and, since there is no additional requests going after clicking "Applying", you cannot get the data without actually having a real browser to run that js code. Mechanize also wouldn't help because it cannot handle js.
Consider using selenium (FYI, you can also use a headless PhantomJS browser).
Hope that helps.
Here's the thing, I have created a mobile web-app having 6 pages only (main.html, venue.html, program.html... , aboutus.html). Ss you guys can see main.html is the main landing page. We also have native mobile apps for Blackberry and iPhone and these native apps use some of my pages in their widgets. Now the issue is I need to distinguish between the page views or hits in such a way so that I could get a clear idea about from where my page is being requested or viewed and then hide/show some stuff depending upon from where the page is being requested. One interesting thing, as mentioned above main.html is the main landing page of web-version so we never use this page in our native apps. So I need to create a cookie on main.html and wanna check that cookie value on each of 6 pages. By following this approach what I want to do is e.g.
Let us say: If I got a hit from native app for venue.html, then in this case I will not get any cookie value as this user has not visited the main.html and reverse of this if some user has used my web-app/version then he/she has to go through the main.html (user is forced by us to view the main.html page first then others).
So after exploring everything I need you guys help to: 1. How to create such kind of cookie in javascript on main.html? 2. how to check that cookie value on rest of pages to know from where that page is being accessed?
Note: I don't want to store any expiry date/time in cookie and in setcookie method I want to set some constant value instead asking user to set some dynamic stuff through some alert dialog.
Any code snippet will highly be appreciated
Doesn't sound like you are doing any pre-processing on the serving side of the equation. Meaning all your pages are static pages, you might want to look into pre-processing your pages using ASP, PHP, Perl or whatever other programming your server allows. By doing so, you open up the option of tracking movement of the user within your application.