Matthew Grove Portal Developers Workshop, February 2008 Portal integration and code reuse in portlets.

Slides:



Advertisements
Similar presentations
Configuration management
Advertisements

CSS: where do we want to go? Gabriele Carcassi Contributions from: Gabriele Carcassi, Kunal Shroff – BNL Jan Hatje – DESY Kay Kasemir – ORNL.
©2009 Justin C. Klein Keane PHP Code Auditing Session 3 – Tools of the Trade & Crafting Malicious Input Justin C. Klein Keane
Getting Started with XPages Presented by Jeff Byrd.
Easy Website Creation Using WordPress Welcome and Thank You to our Sponsors.
DEV392: Extending SharePoint Products And Technologies Through Web Parts And ASP.NET Clint Covington, Program Manager Data And Developer Services - Office.
Copyright 2004 Monash University IMS5401 Web-based Systems Development Topic 2: Elements of the Web (g) Interactivity.
Matthew Grove Virtual Environments for Research in Archaeology Project, University of Reading. Recycle Bridge: an easy.
Kick start your career with WordPress
Joomla!!! Joomla! is a free and open source content management system. It compromises a model-view-controller (MVP). (WIKI) Joomla is written in PHP and.
Downloading and Installing AutoCAD Architecture 2015 This is a 4 step process 1.Register with the Autodesk Student Community 2.Downloading the software.
How to Establish a Blog. What is a Blog A blog is a collection of informational articles/ideas intended to update a viewer on new information associated.
The easy way to a nice looking website design By a total non-designer (Me!)
Introducing HTML & XHTML:. Goals  Understand hyperlinking  Understand how tags are formed and used.  Understand HTML as a markup language  Understand.
 What I hate about you things people often do that hurt their Web site’s chances with search engines.
WHAT IS PHP PHP is an HTML-embedded scripting language primarily used for dynamic Web applications.
Drupal Workshop Introduction to Drupal Part 1: Web Content Management, Advantages/Disadvantages of Drupal, Drupal terminology, Drupal technology, directories.
Create a Website Session I Key Components Hands-on HTML.
_______________________________________________________________________________________________________________ E-Commerce: Fundamentals and Applications1.
MVC New release IE8 Beta 1 Deep Zoom (sea dragon) Silver light 2.0 Beta 1 Expression Blend 2.5 Preview Instant Messaging API Enhancements to Virtual Earth.
Joel Bapaga on Web Design Strategies Technologies Commercial Value.
Technology Options. Entire Project – Technologies (over simplified) 1.Front-end 2.Database 3.Server-side scripting (front-end and database integration)
Ruby & rails by Nicholas Belotti. What is ruby Ruby is an object orientated scripting language. In Ruby...everything is an object! Ruby was released in.
DIRAC Web User Interface A.Casajus (Universitat de Barcelona) M.Sapunov (CPPM Marseille) On behalf of the LHCb DIRAC Team.
Lecture 14 – Web Security SFDV3011 – Advanced Web Development 1.
Integrating with UCSF’s Shibboleth system
Embedding CenterView and Hosting External Content.
Lecture 3 Web Design What makes a "good" website? Getting started on your website. Planning the layout. Picking a theme. Effective Design Tips.
WORDPRESS TECHNOLOGY BY AMEER. WELCOME INTRODUCTION WordPress is an Open Source software system used by millions of people around the world to create.
To get to the point were you can create an account on Wikipedia and then create and edit web pages on the site. To get to this point you must first type.
Cross Site Integration “mashups” cross site scripting.
Week seven CIT 354 Internet II. 2 Objectives Database_Driven User Authentication Using Cookies Session Basics Summary Homework and Project 2.
Top Five Web Application Vulnerabilities Vebjørn Moen Selmersenteret/NoWires.org Norsk Kryptoseminar Trondheim
1Computer Sciences Department Princess Nourah bint Abdulrahman University.
A portal interface to my Grid workflow technology Stefan Rennick Egglestone University of Nottingham
6fb52297e004844aa81be d50cc3545bc Hashing!. Hashing  Group Activity 1:  Take the message you were given, and create your own version of hashing.  You.
WEP Presentation for non-IT Steps and roles in software development 2. Skills developed in 1 st year 3. What can do a student in 1 st internship.
Chapter 4: Working with ASP.NET Server Controls OUTLINE  What ASP.NET Server Controls are  How the ASP.NET run time processes the server controls on.
PLUG INS flash, quicktime, java applets, etc. Browser Plug-ins Netscape wanted a method to extend features of the browser became an unofficial standard.
MEMBERSHIP AND IDENTITY Active server pages (ASP.NET) 1 Chapter-4.
Facebook is a social utility that connects you with the people around you. Use Facebook to…  Keep up with friends and family  Share photos and videos.
ICM – API Server & Forms Gary Ratcliffe.
November Virtual Research Environment for Archaeology (VERA) Prof Mark Baker School of Systems Engineering University of Reading.
UNDERSTANDING YOUR OPTIONS FOR CLIENT-SIDE DEVELOPMENT IN OFFICE 365 Mark Rackley
+ Publishing Your First Post USING WORDPRESS. + A CMS (content management system) is an application that allows you to publish, edit, modify, organize,
Rendering Syndicated Library Content in an Institutional Portal: Integrating MyLibrary into uPortal John Fereira: Cornell University Eric Lease Morgan:
Intro to APACHE, MySQL, and PHP & freely available (hackable) Packages Aonghus Sugrue 04 Oct 2012.
Lecture9 Page 1 CS 236 Online Operating System Security, Con’t CS 236 On-Line MS Program Networks and Systems Security Peter Reiher.
Standards and Compliance. A Brief History of HTML HTML through 1991  Hypertext enabled pages but presentation was lacking HTML 
IN THIS LESSON WE WILL REVIEW THE STRUCTURE OF THE INTERNET AND HOW BROWSERS ASSEMBLE WEBSITES BASED ON INSTRUCTIONS THEY RECEIVE FROM SERVERS. Internet.
Active X and Signed Applets Chad Bollard. Overview ActiveX  Security Features  Hidden Problems Signed Applets  Security Features  Security Problems.
CMS Showdown What Is A Content Management System (CMS)? CMS Website Content Outside Content Social Media Connections with CRM Programs Statistics and.
A S P. Outline  The introduction of ASP  Why we choose ASP  How ASP works  Basic syntax rule of ASP  ASP’S object model  Limitations of ASP  Summary.
 A Javascript library designed to simplify client-side scripting of HTML.
Expertsfromindia for Joomla Development. Introduction Joomla is an open source and free content management system (CMS) for publishing content on the.
Effective Wordpress Hosting Service By InstantAppz.
How to use Drupal Awdhesh Kumar (Team Leader) Presentation Topic.
PHP is a server scripting language, and a powerful tool for making dynamic and interactive Web pages. PHP is a widely-used, free, and efficient alternative.
● The most common website platform ● User friendly-easy to edit ● Constantly improving-updates, plugins, themes Why WordPress?
Drupal Basics May 30, 2012 By Sean Fitzpatrick. Sean Fitzpatrick | Welcome We're going to talk about Drupal We're going to keep it pretty.
Arklio Studija 2007 File: / / Page 1 Automated web application testing using Selenium
Teaching slides Chapter 6. Chapter 6 Software user interface design & construction Contents Introduction Graphical user interface – Rich window based.
Portals: Background, Development & Conversion
Wordpress Tiger Tech 2017.
Module 3 Building a web app.
How to Fix Secure Connection Error in WordPress?.
Easy Website Creation Using WordPress
JavaScript.
Wordpress test.cs.edinboro.edu.
Web Application Development Using PHP
Presentation transcript:

Matthew Grove Portal Developers Workshop, February 2008 Portal integration and code reuse in portlets.

Outline This talk describes our experiences with two approaches to integrating web applications. 1. Skinning (themes). 2. Embedding inside portals. The message is: we don’t want re-write or fork code and you don’t have to. The VRE II VERA project is used as an example throughout the talk.

What do we mean by integration? There are a huge number of well maintained web applications which have had a lot of time and money invested in them. You probably already use some of these applications (including portal containers) in your projects. By integration we mean assembling a system from several existing web applications and making the whole system look / behave the same from a users perspective. We don't want to re-write everything or fork established projects if possible. If we fork things, who is going to maintain them? Do we have the money to maintain them?

Two approaches to integration If you want to use a portal container you could integrate the portal into your existing system (make a skin for the portal). You could embed an existing application inside a portal without re-writing the application (using bridges and scrapers). In the VERA project we have tried both skinning a portal to integrate it with an existing system and embedding web applications inside a portal.

Web application skinning VERA has a web presence which is also the platform for our research environment. We used off the shelf web applications to provide the wiki and the blog. We had to skin the wiki and the blog to provide a consistent user experience (integration). The skins consisted of CSS and a bit of JavaScript. Not a lot needed writing from scratch because we already had CSS and JavaScript from the web site design itself.

The VERA website

Skinning pros Can be almost trivial to do if you have strong CSS-fu. No forking code - we can use mainstream packages supported and maintained by our Linux distribution's package management system, so security updates are essentially automatic for us and we don't have to maintain any code. This approach is language agnostic, web applications could be written in Java, PHP, Python etc.

Skinning cons No single-sign on built in. However, we have added this before in other projects like the acet.rdg.ac.uk site, where we made all of the web applications single sign-on. It relies on the web applications you choose supporting skinning.

Skinning a portal container Remember you will be skinning a portal container not a portlet. This can be just like skinning a web application like Wordpress or Drupal. We did this for Gridsphere 3 (GS).

Skinned Gridsphere

GS skinning experiences GS does support themes (skins). GS lets you include JavaScript for a portlet but not for the whole portal (this makes our little up arrow at the top of the web site break). We fixed this by hacking the GS code (forced to break our own rule - we don't want to fork the code!). JavaScript is going to be more common with Web 2.0, supporting only CSS is not sufficient for skins any more. We couldn't make some page elements do what we wanted because of the structure of the XHTML but we got the rest of the page looking identical to the rest of the VERA site. Changing the URL for the container broke everything for GS; we have heard that this is fixed now. We could have got round this by using something like Apache rewrite. The URL is another aspect of providing a consistent user experience.

Skinning summary If you have existing applications or want to use some complex web applications that are maintained by the community, maybe you should look at skinning for your integration. What it boils down to is how much effort is required to port everything to a portlet compared to writing some skins. We could adapt the authentication system we used with the acet.rdg.ac.uk site to provide single sign-on to integrate web apps outside of portals.

Embedding apps inside portals This is almost the opposite approach; the web application goes inside a portlet. The tricky bit is how to get a web application to look like a normal portlet to the user without rewriting the whole thing! There are existing tools such as the Portlet Bridge (now un-maintained) which let you embed some web applications inside portlets by using web scraping techniques.

When web scraping fails... VERA is committed to getting an application called the IADB inside a standards compliant container. The IADB is 15 thousand lines of PHP and JavaScript, we are not going to re-write it. We have worked with the web scraping tools during VRE I, and we know that the existing web scraping tools can't cope with a site like the IADB. Mainly because of the nested iframes and complex JavaScript that the IADB uses. In this kind of scenario other people have tried using iframes but you can end up with an application which does not integrate well into the portal from a users perspective. The main issue is the lack of single sign-on (you log into the portal then have to log into the embedded application again).

Vanilla IADB

Single sign-on for embedded apps The elegant part of our solution is to use the client (web browser) to link the authentication information between the portal and the embedded application being consumed. We wrote a portlet called the Recycle Bridge which sets a cookie containing the username of the user logged into the portal.

Recycle Bridge cont. The Recycle Bridge uses an iframe to display the embedded application inside the portal. You have to write an authentication plugin or patch for the application that is embedded to use the cookie (and suppress the applications log in screen). From the users perspective the application looks like part of the portal. There are settings for the Recycle Bridge to alter the appearance of the iframe to try and make the integration seamless from the users perspective.

Wordpress in the Recycle Bridge

Security for the cookie Essentially the web application needs to have a way to trust the cookie contains authentic user information. The Recycle Bridge shares a secret security token (salt) with any web application you want to embed. When you set things up you must provide a unique salt in the configuration files. The Recycle Bridge includes an MD5 hash with the cookie based on the salt and username to provide a way for the authentication plugin to check that the cookie has not been tampered with.

Writing the authentication plugins This plugin approach is language agnostic - we can support any language that can read a cookie. We have split the process into two steps: – We have a generic library which provides the functions to read the cookie and check it is valid. – You will need a plugin or patch for the specific application you want to embed.

Plugins cont. We have written the authentication library for PHP. And plugins for: – MediaWiki (runs Wikipedia). – Wordpress which is a very popular blogging app. – We also wrote a patch for IADB, we have check in access to the IADB source repo.

We want your code! We want more plugins and libraries. The Recycle Bridge SVN repo is set up to make it very easy for us to accept code from you. Even if you write a plugin for some obscure application, if you split the cookie functions out into a separate file (library) you will be helping anyone who wants to embed an application written in that language. We are happy to help you write your plugin, especially if it uses a language we don't yet have the library for.

We want your portals! The Recycle Bridge is a JSR-168 portlet. As we all know, unfortunately portal containers do not have standard XML files for portlet deployment. We want help testing Recycle Bridge in your container, we don't have the manpower to install and test every container. If you tweak anything to get the Recycle Bridge to work in a portal, we want your changes!

Summary We have tried two ways of using portals to re-reuse existing web applications. In the first we treat the portal like just another web application and integrate it into our website along side other complicated web applications using CSS and JavaScript skins. The second approach uses the Recycle Bridge to embed existing web applications into a portal.

Future work We hope the Recycle Bridge will be useful for other people who are heavily invested in applications they don't want to / can't afford to re-write as portlets or who want to use web applications which are maintained by the community (like MediaWiki). We would like your help writing adding support for more applications to the Recycle Bridge.

Links - Recycle Bridge homepage (with code). - Blog aggregating all of my research activities. - Portlet Bridge (best of the web scrapers).