JVx' vaadinUI and CORS
CORS
All details about Cross-origin resource sharing.
Use-case
Embedd a vaadin application in your CMS (e.g. Joomla, Typo3). The CMS runs in an hosted environment without Java application server (standard and cheap web hosting).
Howto
There's an excellent blog post from vaadin. It's not rocket science to implement this, but you have to do it. We think this things could be done automatically and so we've added the support to our UI implementation for JVx.
It's really simple to use:
Add following parameter to your web.xml:
<param-name>cors.origin</param-name>
<param-value>http://www.hosteddomain.com</param-value>
</init-param>
<init-param>
<param-name>pushmode</param-name>
<param-value>automatic</param-value>
</init-param>
<async-supported>true</async-supported>
(be sure that async-support was enabled for all vaadin servlets/filters)
The cors.origin parameter can be a comma separated list.
And here's an example html file:
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=11;chrome=1" />
<link rel="shortcut icon" type="image/vnd.microsoft.icon"
href="./VAADIN/themes/jvx/favicon.ico" />
<link rel="icon" type="image/vnd.microsoft.icon"
href="./VAADIN/themes/jvx/favicon.ico" />
<title>Embedded Vaadin application</title>
<script type="text/javascript"
src="./VAADIN/widgetsets/com.sibvisions.rad.ui.vaadin.ext.ui.Widgetset/
com.sibvisions.rad.ui.vaadin.ext.ui.Widgetset.nocache.js?05202015200542"></script>
</head>
<body scroll="auto">
<div id="content">
<script type="text/javascript" src="./VAADIN/vaadinPush.js?v=7.4.5"></script>
<script type="text/javascript" src="./VAADIN/vaadinBootstrap.js?v=7.4.5"></script>
<div id="MyEmbeddedUI" class="v-app">
<div class="v-app-loading"></div>
<noscript>You have to enable javascript in your browser to use an application
built with Vaadin.</noscript>
</div>
<script type="text/javascript">
if (!window.vaadin)
{
alert("Failed to load the bootstrap javascript:
./VAADIN/vaadinBootstrap.js?v=7.4.5");
}
vaadin.initApplication("MyEmbeddedUI",
{"browserDetailsUrl": "ui/" + appname + params,
"serviceUrl": "ui/",
"theme":"jvx",
"versionInfo":{"vaadinVersion":"7.4.5",
"atmosphereVersion":"2.2.4.vaadin5"},
"widgetset":"com.sibvisions.rad.ui.vaadin.ext.ui.Widgetset",
"comErrMsg":{"caption":"Communication problem",
"message":"Take note of any unsaved data,
and <u>click here</u> or press ESC to
continue.",
"url":null},
"authErrMsg":{"caption":"Authentication problem",
"message":"Take note of any unsaved data,
and <u>click here</u> or press ESC to
continue.",
"url":null},
"sessExpMsg":{"caption":"Session Expired",
"message":"Take note of any unsaved data,
and <u>click here</u> or press ESC key
to continue.",
"url":null},
"vaadinDir":"./VAADIN/",
"standalone":false,
"debug":false,
"heartbeatInterval":300,
"comErrMsgDetails":true,
"authErrMsgDetails":true,
"sessExpMsgDetails":true});
</script>
</div>
</body>
</html>
And the rest of our web.xml:
<servlet-name>EmbeddedUI</servlet-name>
<servlet-class>com.sibvisions.rad.ui.vaadin.server.VaadinServlet</servlet-class>
<init-param>
<param-name>UI</param-name>
<param-value>com.sibvisions.rad.ui.vaadin.impl.VaadinUI</param-value>
</init-param>
<init-param>
<param-name>widgetset</param-name>
<param-value>com.sibvisions.rad.ui.vaadin.ext.ui.Widgetset</param-value>
</init-param>
<init-param>
<param-name>main</param-name>
<param-value>com.sibvisions.apps.MyEmbeddedApplication</param-value>
</init-param>
<init-param>
<param-name>Launcher.uifactory</param-name>
<param-value>com.sibvisions.rad.ui.vaadin.impl.VaadinFactory</param-value>
</init-param>
<init-param>
<param-name>pushmode</param-name>
<param-value>automatic</param-value>
</init-param>
<async-supported>true</async-supported> </servlet>
</servlet>
<servlet-mapping>
<servlet-name>EmbeddedUI</servlet-name>
<url-pattern>/*</url-pattern>
</servlet-mapping>
The application was deployed in ROOT context of Tomcat8.
If you have a different context, simply change the URLs: browserDetailsUrl, serviceUrl and vaadinDir (see html page).
The CORS support is not available in our latest vaadinUI release (1.2), because its a very new feature. Simply use our nightly builds for testing.
Happy embedding.
Development | rjahn | 02/06/2015
RSS-Feed