Happens often to install an external solution for an website (blog, forum, calendar), that has to integrate with the rest of content.
These things are usually sought:
1. open in same page
2. keep the look and feel, header, footer, etc.
3. SEO url frieldly (no iframes)
4. no complex programming or code rewriting
Well, recently I came to following solution, which I believe would work in some cases.
1. Install the third-party software on your server, under the public-html folder
eg …/public-html/externalApp
The application will have its own installation steps, database and administration area.
1. Create a new page in your website (this can be .html, .php, CMS created or any type)
http://my-web-site.com/external.php or
http://my-web-site.com/external SEO version
The page name has to be different than
2. Create a .htaccess file if you don’t have one and add these lines (rewrite module has to be enabled on apache server)
RewriteEngine on RewriteBase / # This will force every request sent to the application to come through your page. RewriteRule ^external/(.+)$ external.php
3. Change the URL of the installed application to http://my-web-site.com/external.
Probably the automatic URL whould be http://my-web-site.com/externalApp. This will force every request to the application to come through your page.
4. Add the following code in your new page:
5. Upload ajax.js file on your server:
if(navigator.appName == "Microsoft Internet Explorer") {
http = new ActiveXObject("Microsoft.XMLHTTP");
} else {
http = new XMLHttpRequest();
}
function loadExternal() {
// the url will contain all the params needed for both the website and third-party application (http://my-web-site.com/external/params)
var Url = document.location.href;
// get params for the external application
var Params = Url.replace('http://my-web-site.com/external/', '');
http.open("GET", "http://my-web-site.com/externalApp/"+Params, true);
http.onreadystatechange=function() {
if(http.readyState == 4) {
// load app page
document.getElementById('foo').innerHTML = http.responseText;
}
}
http.send(null);
}
// the third-party content will be included when the parent page is loaded
window.onload=loadExternal;
Recommendation: Use full URL addresses everywhere.
Add: Things will get complicated when you have password protected areas in your website and you want to access both applications with same login, but it’s not impossible. You just have to match the sessions or force the login in one application.
