Refreshing pages - UniTrento
Transcript of Refreshing pages - UniTrento
![Page 1: Refreshing pages - UniTrento](https://reader031.fdocuments.net/reader031/viewer/2022022217/6214085dbf46e6146f3a645c/html5/thumbnails/1.jpg)
Refreshing pages
![Page 2: Refreshing pages - UniTrento](https://reader031.fdocuments.net/reader031/viewer/2022022217/6214085dbf46e6146f3a645c/html5/thumbnails/2.jpg)
QHow do I refresh on a periodic base the content of a page?
Introduzione alla programmazione web – Marco Ronchetti 2020 – Università di Trento2
![Page 3: Refreshing pages - UniTrento](https://reader031.fdocuments.net/reader031/viewer/2022022217/6214085dbf46e6146f3a645c/html5/thumbnails/3.jpg)
Pull vs. Push
HTTP has no "natural" way to support Push
http
d
Internet
HTTP Request
Client
browser
ServerHTTP Response
http
d
Internetbrowser
PULL
PUSH
![Page 4: Refreshing pages - UniTrento](https://reader031.fdocuments.net/reader031/viewer/2022022217/6214085dbf46e6146f3a645c/html5/thumbnails/4.jpg)
Refreshing pages1) You can (fully) reload a page without using JavaScript, just using a HTTP header
<meta http-equiv="refresh" content="30">
2) You can use Javascript in two ways:
setInterval and setTimeout. setTimeout inherently triggers only oncesetInterval continues indefinitely.
https://www.w3schools.com/jsref/met_win_setinterval.asphttps://www.w3schools.com/jsref/met_win_settimeout.asp
https://www.w3schools.com/tags/att_meta_http_equiv.asp
![Page 5: Refreshing pages - UniTrento](https://reader031.fdocuments.net/reader031/viewer/2022022217/6214085dbf46e6146f3a645c/html5/thumbnails/5.jpg)
A newsfeeder• PublisherPage
• add news to newslist
• Welcome page:• ask user name• create session• set lastNewsID to 0• load readerPage
• ReaderPage• if lastNewsID!=ID
• load all news from lastNewsID to ID• update lastNewsID
• SetTimeout
News• lastNewsID
NewsList:• ID• content
Session• username• lastNewsID
Global
Per User
Data structure
![Page 6: Refreshing pages - UniTrento](https://reader031.fdocuments.net/reader031/viewer/2022022217/6214085dbf46e6146f3a645c/html5/thumbnails/6.jpg)
A two-player game• Welcome page:
• ask user name• create entry in UserList• create session• check if anyone is in waiting list
• if yes, pair the two players and assign turn • if no, put user in waiting list
• prepare and deliver response page (waiting page or playing page)• WaitingPage
• use SetTimeout to check if IsWaiting• if yes, set Timeout again• if no, load PlayingPage
• PlayingPage• use SetTimeout to check if canPlay
• if no, update page with a message (e.g. counter)• if yes, ask user to perform action
• update (user)gameState• update (global)gameState• update turn
GameList:• Game<->gameID
• user[2]• turn• (global) game state
Waiting list• waiting user
User list• User <-> sessionID
Session• username• isWaiting• gameID• (user)gameState
![Page 7: Refreshing pages - UniTrento](https://reader031.fdocuments.net/reader031/viewer/2022022217/6214085dbf46e6146f3a645c/html5/thumbnails/7.jpg)
Web Server Sent Events
The client initiates the SSE connection and the server uses the event source protocol to send updates to the client.
The client will receive updates from the server, but it can’t send any data to the server after the initial handshake.
https://developer.mozilla.org/en-US/docs/Web/API/Server-sent_events/Using_server-sent_events
![Page 8: Refreshing pages - UniTrento](https://reader031.fdocuments.net/reader031/viewer/2022022217/6214085dbf46e6146f3a645c/html5/thumbnails/8.jpg)
Notifications API
Allows web pages to control the display of system notifications to the end user.
These are outside the top-level browsing context viewport, so therefore can be displayed even when the user has switched tabs or moved to a different app.
The API is designed to be compatible with existing notification systems, across different platforms.
https://developer.mozilla.org/en-US/docs/Web/API/Notifications_API/Using_the_Notifications_API
![Page 9: Refreshing pages - UniTrento](https://reader031.fdocuments.net/reader031/viewer/2022022217/6214085dbf46e6146f3a645c/html5/thumbnails/9.jpg)
Push APIGives web applications the ability to receive messages pushed to them from a server, whether or not the web app is in the foreground, or even currently loaded, on a user agent. This lets developers deliver asynchronous notifications and updates to users that opt in, resulting in better engagement with timely new content.
This is an experimental technology, in Firefox merged with Notifications
https://developer.mozilla.org/en-US/docs/Web/API/Push_API
![Page 10: Refreshing pages - UniTrento](https://reader031.fdocuments.net/reader031/viewer/2022022217/6214085dbf46e6146f3a645c/html5/thumbnails/10.jpg)
Other themes
Introduzione alla programmazione web – Marco Ronchetti 2020 – Università di Trento10
![Page 11: Refreshing pages - UniTrento](https://reader031.fdocuments.net/reader031/viewer/2022022217/6214085dbf46e6146f3a645c/html5/thumbnails/11.jpg)
HTML5 features§Canvas - A complete drawing and animation API
§Geolocation§Local storage - Save key/value pairs to a client-side data
store implemented by browser
§WebSQL storage - A set of APIs to manipulate client-side databases using SQL
§Offline Apps - Run a web application in offline mode, disconnected from Internet
§WebSockets - Opens a persistent connection to the server
§WebWorkers - Provide “threads” for JavaScript execution
Introduzione alla programmazione web – Marco Ronchetti 2020 – Università di Trento11
![Page 12: Refreshing pages - UniTrento](https://reader031.fdocuments.net/reader031/viewer/2022022217/6214085dbf46e6146f3a645c/html5/thumbnails/12.jpg)
SEO – Search Engine Optimization
For a short intro, seehttps://www.slideshare.net/bernardcharlebois/search-engine-optimization-seo-61163208
For a full discussione, seehttps://developers.google.com/search/docs/beginner/seo-starter-guide?hl=en
Introduzione alla programmazione web – Marco Ronchetti 2020 – Università di Trento12For
![Page 13: Refreshing pages - UniTrento](https://reader031.fdocuments.net/reader031/viewer/2022022217/6214085dbf46e6146f3a645c/html5/thumbnails/13.jpg)
Server side frameworks
§ ORM (Object Relational Mapping): Hibernate, JPA (https://hibernate.org/)
§ EJB (Enterprise Java Beans) (https://www.tutorialspoint.com/ejb/index.htm)
§ Struts (https://struts.apache.org/index.html)§ Spring (https://spring.io/)§ ASP.NET (https://docs.microsoft.com/en-us/aspnet)
Introduzione alla programmazione web – Marco Ronchetti 2020 – Università di Trento13For
![Page 14: Refreshing pages - UniTrento](https://reader031.fdocuments.net/reader031/viewer/2022022217/6214085dbf46e6146f3a645c/html5/thumbnails/14.jpg)
New standards
§WebAssembly (Wasm) is an open standard that defines a portable binary-code format for executable programs, and a corresponding textual assembly language, as well as interfaces for facilitating interactions between such programs and their host environment.
Introduzione alla programmazione web – Marco Ronchetti 2020 – Università di Trento14For
![Page 15: Refreshing pages - UniTrento](https://reader031.fdocuments.net/reader031/viewer/2022022217/6214085dbf46e6146f3a645c/html5/thumbnails/15.jpg)
UX
§The user experience (UX or UE) is how a user interacts with and experiences a product, system or service. It includes a person's perceptions of utility, ease of use, and efficiency.
Introduzione alla programmazione web – Marco Ronchetti 2020 – Università di Trento15For
![Page 16: Refreshing pages - UniTrento](https://reader031.fdocuments.net/reader031/viewer/2022022217/6214085dbf46e6146f3a645c/html5/thumbnails/16.jpg)
WCAG (content accessibility guidelines)§ Guideline 1: Provide equivalent alternatives to auditory and visual
content§ Guideline 2: Don't rely on colour alone§ Guideline 3: Use markup and style sheets, and do so properly§ Guideline 4: Clarify natural language usage§ Guideline 5: Create tables that transform gracefully§ Guideline 6: Ensure that pages featuring new technologies
transform gracefully§ Guideline 7: Ensure user control of time sensitive content changes§ Guideline 8: Ensure direct accessibility of embedded user
interfaces§ Guideline 9: Design for device independence§ Guideline 10: User interim solutions§ Guideline 11: Use W3C technologies and guidelines
Introduzione alla programmazione web – Marco Ronchetti 2020 – Università di Trento16For
![Page 17: Refreshing pages - UniTrento](https://reader031.fdocuments.net/reader031/viewer/2022022217/6214085dbf46e6146f3a645c/html5/thumbnails/17.jpg)
WCAG § Guideline 12: Provide context and orientation information§ Guideline 13: Provide clear navigation mechanisms§ Guideline 14: Ensure that documents are clear and simple…Guideline 2.1: Make all functionality available from a keyboard.Guideline 2.2: Provide users enough time to read and use content.….Guideline 2.4: Provide ways to help users navigate, find content, and determine where they are.…Guideline 3.2: Make web pages appear and operate in predictable ways.https://en.wikipedia.org/wiki/Web_Content_Accessibility_Guidelines
Introduzione alla programmazione web – Marco Ronchetti 2020 – Università di Trento17For
![Page 18: Refreshing pages - UniTrento](https://reader031.fdocuments.net/reader031/viewer/2022022217/6214085dbf46e6146f3a645c/html5/thumbnails/18.jpg)
Enabling features on your web server
Introduzione alla programmazione web – Marco Ronchetti 2020 – Università di Trento18
![Page 19: Refreshing pages - UniTrento](https://reader031.fdocuments.net/reader031/viewer/2022022217/6214085dbf46e6146f3a645c/html5/thumbnails/19.jpg)
Send e-mail
Introduzione alla programmazione web – Marco Ronchetti 2020 – Università di Trento19
![Page 20: Refreshing pages - UniTrento](https://reader031.fdocuments.net/reader031/viewer/2022022217/6214085dbf46e6146f3a645c/html5/thumbnails/20.jpg)
Introduzione alla programmazione web – Marco Ronchetti 2020 – Università di Trento20
§ Install and use any SMTP server such as Postcastserver, Apache James server, cmail server etc. (or)
§ Use the SMTP server provided by the host provider e.g. my SMTP server is mail.javatpoint.com (or)
§ Use the SMTP Server provided by other companies e.g. gmail etc.
How to send e-mail
![Page 21: Refreshing pages - UniTrento](https://reader031.fdocuments.net/reader031/viewer/2022022217/6214085dbf46e6146f3a645c/html5/thumbnails/21.jpg)
Some tutorials:https://www.javatpoint.com/java-mail-api-tutorial
https://www.tutorialspoint.com/java/java_sending_email.htm
Introduzione alla programmazione web – Marco Ronchetti 2020 – Università di Trento21
![Page 22: Refreshing pages - UniTrento](https://reader031.fdocuments.net/reader031/viewer/2022022217/6214085dbf46e6146f3a645c/html5/thumbnails/22.jpg)
Enable exporting data from your site
Introduzione alla programmazione web – Marco Ronchetti 2020 – Università di Trento22
![Page 23: Refreshing pages - UniTrento](https://reader031.fdocuments.net/reader031/viewer/2022022217/6214085dbf46e6146f3a645c/html5/thumbnails/23.jpg)
Apache POI
Introduzione alla programmazione web – Marco Ronchetti 2020 – Università di Trento23
![Page 24: Refreshing pages - UniTrento](https://reader031.fdocuments.net/reader031/viewer/2022022217/6214085dbf46e6146f3a645c/html5/thumbnails/24.jpg)
https://poi.apache.org/components/
writing excel documentshttps://poi.apache.org/components/spreadsheet/quick-guide.html
text extractionhttps://poi.apache.org/text-extraction.html
Introduzione alla programmazione web – Marco Ronchetti 2020 – Università di Trento24
![Page 25: Refreshing pages - UniTrento](https://reader031.fdocuments.net/reader031/viewer/2022022217/6214085dbf46e6146f3a645c/html5/thumbnails/25.jpg)
Jasper Report
Introduzione alla programmazione web – Marco Ronchetti 2020 – Università di Trento25
![Page 26: Refreshing pages - UniTrento](https://reader031.fdocuments.net/reader031/viewer/2022022217/6214085dbf46e6146f3a645c/html5/thumbnails/26.jpg)
Jasper Report architecture
Introduzione alla programmazione web – Marco Ronchetti 2020 – Università di Trento26
![Page 27: Refreshing pages - UniTrento](https://reader031.fdocuments.net/reader031/viewer/2022022217/6214085dbf46e6146f3a645c/html5/thumbnails/27.jpg)
References:
https://community.jaspersoft.com/wiki/jasperreports-library-features-and-highlights
https://www.tutorialspoint.com/jasper_reports/index.htm
Introduzione alla programmazione web – Marco Ronchetti 2020 – Università di Trento27
![Page 28: Refreshing pages - UniTrento](https://reader031.fdocuments.net/reader031/viewer/2022022217/6214085dbf46e6146f3a645c/html5/thumbnails/28.jpg)
Enable Searchingin your site
Introduzione alla programmazione web – Marco Ronchetti 2020 – Università di Trento28
![Page 29: Refreshing pages - UniTrento](https://reader031.fdocuments.net/reader031/viewer/2022022217/6214085dbf46e6146f3a645c/html5/thumbnails/29.jpg)
Apache Lucene - SolrLucene: powerful indexing and search features, as well as spellchecking, hit highlighting and advanced analysis/tokenization capabilities.https://lucene.apache.org/
Introduzione alla programmazione web – Marco Ronchetti 2020 – Università di Trento29
![Page 30: Refreshing pages - UniTrento](https://reader031.fdocuments.net/reader031/viewer/2022022217/6214085dbf46e6146f3a645c/html5/thumbnails/30.jpg)
Lucene and Solr
Introduzione alla programmazione web – Marco Ronchetti 2020 – Università di Trento30
![Page 31: Refreshing pages - UniTrento](https://reader031.fdocuments.net/reader031/viewer/2022022217/6214085dbf46e6146f3a645c/html5/thumbnails/31.jpg)
Solr features
Introduzione alla programmazione web – Marco Ronchetti 2020 – Università di Trento31
https://lucene.apache.org/solr/features.html