IBM Cognos 最佳实践: 定制 IBM Cognos 10 登录

文档性质:可靠实践;产品:IBM Cognos 10.1;关注领域:基础设施,安全性

本文档补充 IBM Cognos 10 的 Security and Administration Guide,提供定制登录页面的复杂示例。

Antonio Marziano, 资深技术支持专家, IBM

Antonio Marziano 是一位资深技术支持专家,已经从事 IBM Cognos 十年了。他当前从事 IBM Cognos BI 产品的技术支持和提升工程。专业领域是基础设施和安全性。他是一位梦想家和创新者,致力于通过改进内部 IBM 系统技术实现更智能化的工作。



Andreas Weber, 资深支持分析师, IBM

Andreas Weber 是 IBM Cognos Support 的资深问题解决方案分析师,已经从事 IBM Cognos 九年了。他的特长领域是安装、配置、安全性和 IBM Cognos Software Development Kit。



Chris Shepherd, 技术分析师, IBM

Chris Shepherd 是 IBM Cognos Support 的问题解决方案分析师,已经从事 IBM Cognos 两年了。他的特长领域是 Unix 和 Linux 系统以及 IBM Blue Stack 产品。



2011 年 6 月 02 日

免费下载:IBM® Cognos® Express V9.5 或者 Cognos® 8 Business Intelligence Developer Edition V8.4 试用版
下载更多的 IBM 软件试用版,并加入 IBM 软件下载与技术交流群组,参与在线交流。

简介

目的

本文档补充 IBM Cognos 10 的 Security and Administration Guide,提供定制登录页面的复杂示例。提供的示例会帮助读者了解这个新特性提供的可能性和灵活性。

适用性

示例是使用 IBM WebServer 7 (IHS7)、Mozilla 3.0.7 和 Microsoft Internet Explorer 7.0.6001 针对 IBM Cognos 10 (build 10.1.4707.541) 构建和测试的。

IBM Cognos 10 引入了定制 IBM Cognos 登录和注销行为的特性,这个特性不适用于以前的版本。

例外与除外责任

本文档希望读者熟悉 HTML 3.0 标记、AJAX、CSS 和 web 开发。

希望读者熟悉 Administration and Security Guide 的第 35 章中的 Customizing the IBM Cognos Connection Login Page 小节。

技术概念

定制过程分为三个步骤。浏览器请求登录页面之后,IBM Cognos 10 服务器会提供准备好的基本内容(见图 1 中的 1.)。接下来,浏览器从 Cognos Gateway 获取一个 JavaScript 文件和样式表(见图 1 中的 2.)。在第三步中,浏览器使用 AJAX 请求定制的模板,然后通过 JavaScript 逻辑处理模板,最终组装出完整的定制登录页面。

图 1. 生成定制登录页面的步骤
生成定制登录页面的步骤

示例 1:使用 AJAX

这个示例中描述的示例模板使用 Asynchronous JavaScript and XML – AJAX (http://en.wikipedia.org/wiki/Ajax_%28programming%29) 从任意 URL 请求内容并在登录页面上显示它。这种技术使用 JavaScript 函数 customize(),这个函数允许在模板引擎应用 Administration and Security Guide 中描述的所有其他定制之后调用自己的 JavaScript 函数。

假定的使用场景是,由 IT 部门维护要在登录页面上显示的定制文本,从而向用户通知停机维护时间或其他重要信息。优点是文本的更新完全独立于 IBM Cognos 10 系统,不需要停止并重新启动服务器,不需要停机。

当然,这只是一个简单的使用场景。可以使用 AJAX 实现许多使用场景,应该很容易通过这个示例掌握这种技术。

在这个示例中,把模板命名为 ibm1.xhtml,在同一 web 服务器上用 AJAX 装载的文件名为 customText_en.txt。模板显示一个使用几个表的页面,通过 AJAX 从另一个文件获取要在表单元格中显示的文本。另外,通过 AJAX 在 HTML 中附加几个包含脚注的 <DIV> 元素。

XHTML 文件

下面是这个示例使用的 ibm1.xhtml 文件的内容。它包含一些 CSS、JavaScript 函数和用于登录页面布局的 HTML。

	<style type="text/css">
	img.logo {
		margin-top:50px; margin-bottom:50px; opacity:0.5; filter:alpha(opacity=50)
	}
	.footnote { font-size:60%; color:#000000; }
	body {
		background-color: #FFFFFF;
	}
</style>
<table width="100%" cellspacing="0" cellpadding="0" border="0">
	<tr><td width="100%"/><td nowrap="nowrap"><a style="color:#3399cc;
		 font-weight:bold; font-size:70%" href="#"
		 onclick="javascript:executeHelpCommand();">Help</a></td></tr>
</table>
<table width="100%" cellspacing="0" cellpadding="0" border="0">
	<tr>
		<td width="30%"/>
		<td width="40%">
			<img src="../samples/images/cover2.jpg"/ class="logo">
			<div id="customUsers"></div>
			<div id="%CL_PROMPT%"></div>
			<input type="submit" value="Login"
				 onclick="javascript:executeOKCommand();" />
			<input type="button" value="Cancel"
				 onclick="javascript:executeCancelCommand();" />
		</td>
		<td id="customTXT" width="30%"/>
	</tr>
</table>
<div id="%CL_PROMPT_namespace_label%">Namespace</div>
<div id="%CL_PROMPT_username_label%">User Name:</div>
<div id="%CL_PROMPT_password_label%">Password:</div>
<div id="%CL_PROMPT_oldPassword_label%">Old Password:</div>
<div id="%CL_PROMPT_newPassword_label%">New password:</div>
<div id="%CL_PROMPT_newPasswordConfirm_label%">Confirm old password:
	<img style="vertical-align:middle"
		 src="../ps/portal/images/state_warning_lrg.gif"/>
</div>
<div id="%CL_PROMPT_selectNamespace_caption%">
	<span style="color:gray">Please select a namespace.</span>
</div>
<div id="%CL_PROMPT_enterCredentials_caption%">
	<span style="color:gray;">Enter your credentials. </span>
</div>
<div id="%CL_PROMPT_badCredentialsEntered_caption%">
	<span style="color:red">The username or password you entered are not valid.</span>
</div>
<div id="%CL_PROMPT_passwordExpiry_caption%">
	<span style="color:red">Your password has expired.</span>
</div>
<div id="%CL_PROMPT_general_caption%">
	<span style="color:red">Authentication</span>
</div>
<script type="text/javascript">
	var xhr;
	var xhr2;
	function customize() {
		initCustom();
	}
	function initCustom(){
		xhr = loadAJAX();
		xhr.open("GET", "../ps/login/customText_en.txt", true);
		xhr.onreadystatechange = renderCustomText;
		xhr.send(null);
		var msgen = "<p>Our documentation includes user guides, getting started 
guides, new features guides, readmes, and other materials to meet the needs of our varied 
audience. The following documents contain related information and may be referred to in 
this document.</p>";
		var div = document.createElement("div");
		div.style.marginTop = "100px";
		div.innerHTML = "<span class=\"footnote\">" + msgen + "</span>";
		document.body.appendChild(div);
	}
	function loadAJAX() {
		var http;
		if (window.XMLHttpRequest) {
			http = new XMLHttpRequest();
		} else if (window.ActiveXObject) {
			try {
				http = new ActiveXObject('Msxml2.XMLHTTP');
			} catch (e) {
				try {
					http = new ActiveXObject('Microsoft.XMLHTTP');
				} catch (e) {
					alert("Cannot load XMLHttpRequest\r\n"
							 + e.description);
				}
			}
		}
		return http;
	}
	function renderCustomText(){
		if(xhr.readyState == 4){
			var ret = xhr.responseText;	
			var cstm = document.getElementById("customTXT");
			cstm.innerHTML = ret;
		}
	}
</script>

请注意 HTML 中的占位元素 <td id="customTXT" width="30%"/>。将使用它显示定制的文本。

JavaScript 包含以下函数:

customize()
当装载页面时,自动地调用这个函数。请参见 Administration and Security Guide 的第 35 章中的 Customizing the IBM Cognos Connection Login Page 小节。

InitCustom()
这个函数启动 AJAX 请求并添加一个包含文本的 DIV 块。AJAX 请求完成之后,调用 renderCustomText() 函数。

renderCustomText()
这个函数把对 AJAX 请求的文本响应读入一个变量,并通过修改 DOM 在登录页面中添加此文本。

安装示例

按以下步骤安装这个示例:

  • 把这里提供的代码保存在 IBM Cognos 10 Gateway 的 ./webcontent/ps/login 文件夹中的 ibm1.xhtml 文件中。
  • 按文档(Security and Administration Guide 的第 35 章 “Customizing the IBM Cognos Connection Login Page”)描述的步骤在 system.xml 文件中启用定制的登录,使用的 base-template-name 是 “ibm1”。
  • ./webcontent/ps/login 文件夹中创建文本文件 customText_en.txt,添加要在登录页面上显示的文本。
  • 停止并重新启动 IBM Cognos 10,访问 IBM Cognos 10 Gateway URI,就会看到新的登录页面。
图 2. 显示基于 AJAX 的定制登录页面的屏幕图
显示基于 AJAX 的定制登录页面的屏幕图

示例 2:多种语言

定制登录页面特性为地区提供内置的支持。解析模板的模板引擎会尝试装载其后缀与提交的浏览器地区对应的模板文件。在这个示例中,根据浏览器地区提供英语和法语的登录页面,从而展示此功能的非常基本的应用。

假设模板名为 login,浏览器地区是 EN。IBM Cognos 10 会首先检查定制登录页面 login_en.xhtml。如果此文件不存在,就会检查默认的 login.xhtml。默认文件包含英语文本,对于所有非法语浏览器都会返回它。如果浏览器地区是 FR,就首先装载模板 login_fr.xhtml。因为定制控制显示的整个网页,每个地区可以有自己的定制登录页面。注意,与地区相关的登录页面独立于系统地区和为 IBM Cognos 10 系统指定的地区。

这些示例很简单,它们创建与默认 IBM Cognos 10 登录页面相似的页面。

login.XHTML 文件

<style type="text/css">
.customWelcome { font-weight: bold; font-family: sans-serif; font-size: 14pt; }
</style>
<div id="loginBoxWithShadow">
<div id="loginBox" style="width:260px"> 
        <div id="loginBoxInner"> 
                <span class="customWelcome">Welcome to Cognos 10</span><br /><br />
                <div id="%CL_PROMPT%"></div><br />
                <input type="submit" value="Log In"
                 onclick="javascript:executeOKCommand();" />
                <input type="button" value="Cancel"
                 onclick="javascript:executeCancelCommand();" />
                <br />
                <br />

                <div id="%CL_PROMPT_namespace_label%">Namespace</div>
                <div id="%CL_PROMPT_username_label%">User Name: </div>
                <div id="%CL_PROMPT_password_label%">Password: </div>
                <div id="%CL_PROMPT_oldPassword_label%">Old Password:</div>
                <div id="%CL_PROMPT_newPassword_label%">New password:</div>
                <div id="%CL_PROMPT_newPasswordConfirm_label%">Confirm old password:
                <img style="vertical-align:middle"
                 src="../ps/portal/images/state_warning_lrg.gif"/>
                </div>
                <div id="%CL_PROMPT_selectNamespace_caption%">
                        <span style="color:gray">Please select a namespace.</span>
                </div>
                <div id="%CL_PROMPT_enterCredentials_caption%">
                        <span style="color:gray;">Enter your credentials.</span>
                </div>
                <div id="%CL_PROMPT_badCredentialsEntered_caption%">
                        <span style="color:red">The username or password
                                 you entered are not valid.</span>
                </div>
                <div id="%CL_PROMPT_passwordExpiry_caption%">
                        <span style="color:red">Your password has expired.</span>
                </div>
                <div id="%CL_PROMPT_general_caption%">
                        <span style="color:red">Authentication</span>
                </div>
        </div>
</div></div>

login_fr.XHTML 文件

<style type="text/css">
.customWelcome { font-weight: bold; font-family: sans-serif; font-size: 14pt; }
</style>

<div id="loginBoxWithShadow">
<div id="loginBox" style="width:260px"> 
    <div id="loginBoxInner"> 
    <span class="customWelcome">Bienvenue a Cognos 10</span><br /><br />
    <div id="%CL_PROMPT%"></div><br />
        <input type="submit" value="Log In"
                 onclick="javascript:executeOKCommand();" />
        <input type="button" value="Cancel" 
                 onclick="javascript:executeCancelCommand();" />
        <br />
        <br />

        <div id="%CL_PROMPT_namespace_label%">Espace-noms:</div>
        <div id="%CL_PROMPT_username_label%">Code d'utilisateur: </div>
        <div id="%CL_PROMPT_password_label%">Mot de passe: </div>
        <div id="%CL_PROMPT_oldPassword_label%">Mot de passe: </div>
        <div id="%CL_PROMPT_newPassword_label%">Nouveau mot de passe:</div>
        <div id="%CL_PROMPT_newPasswordConfirm_label%">Confirmer le mot de passe:
        <img style="vertical-align:middle" 
                 src="../ps/portal/images/state_warning_lrg.gif"/>
     </div>
    <div id="%CL_PROMPT_selectNamespace_caption%">
         <span style="color:gray">Please select a namespace.</span></div>
    <div id="%CL_PROMPT_enterCredentials_caption%">
         <span style="color:gray;">Enter your credentials. </span></div>
    <div id="%CL_PROMPT_badCredentialsEntered_caption%">
         <span style="color:red">The username or password 
                                 you entered are not valid.</span></div>
    <div id="%CL_PROMPT_passwordExpiry_caption%">
         <span style="color:red">Your password has expired.</span></div>
    <div id="%CL_PROMPT_general_caption%">
        <span style="color:red">Authentication</span></div>
</div></div>

安装示例

按以下步骤安装这个示例:

  • 把这里提供的代码保存在 IBM Cognos 10 Gateway 的 ./webcontent/ps/login 文件夹中的 login.xthml 和 login_fr.xhtml 文件中。
  • 按文档(Security and Administration Guide 的第 35 章 “Customizing the IBM Cognos Connection Login Page”)描述的步骤在 system.xml 文件中启用定制的登录,使用的 base-template-name 是 “login”。
  • 停止并重新启动 IBM Cognos 10,把浏览器地区设置为 EN,访问 IBM Cognos 10 Gateway URI。应该会看到登录页面的英语版本。
  • 把浏览器地区改为 FR,再次访问 IBM Cognos 10 Gateway URI。应该会看到登录页面的法语版本。

通过使用这两个简单的模板示例,在默认情况下所有法语用户都会看到登录页面的另一个版本,主要对话框文本是法语的,错误消息是英语的。

不使用法语浏览器或语言配置的用户会看到全英语的登录页面。


示例 3:IFRAME 中的滚动字幕

这个示例在登录页面中显示滚动的消息,从而警告用户或发出重要的公告。这里的登录页面向用户显示滚动字幕,通知他们由于需要重新引导系统在下午 5 点之后不可用。这是一种发送全局消息的方法,它不会增加大量的网络通信流。

下面是其显示效果,其中显示滚动字幕的方向(红色箭头)。

图 3. 显示使用滚动字幕的定制登录页面的屏幕图
显示使用滚动字幕的定制登录页面的屏幕图

定制过程如下:

  1. 在定制模板中添加以下 HTML 代码。这段 HTML 代码包含一个 <IFRAME> 元素,它显示一个静态 HTML 页面的 URL,页面包含在滚动字幕中动态显示的消息。
    <table border="0" cellpadding="3" cellspacing="0" width="100%" ><tbody><tr><td>
    <iframe src="http://<server>/<C10_ALIAS>/ps/login/alerts.html" width="100%"
       height="40%" frameborder="no" scrolling="no"></iframe>
    </td></tr></tbody></table>
    注意:必须把 <IFRAME> 使用的 URL 中的 <server> 添加到 IBM Cognos Configuration 中的可信主机和域中。<C10_ALIAS> 是用于访问 IBM Cognos 10 Gateway 的虚拟目录别名,例如 /c10
  2. 要在屏幕上滚过的消息文本放在另一个 HTML 文件中,这个文件应该包含以下 HTML 和 JavaScript 代码:
    <html>
    <head>
    <script type="text/JavaScript">
    <!--
    function timedRefresh(timeoutPeriod) {
    	setTimeout("location.reload(true);",timeoutPeriod);
    }
    //   -->
    </script>
    </head>
    <body onload="JavaScript:timedRefresh(10000);">
    <div align="center"><FONT color="#ffffff" size="+1">
    <MARQUEE bgcolor="#000080" transparency=100 direction="left" loop="20" width="75%">
    <STRONG>Announcement! System will be unavailable after 5pm due to a reboot.</STRONG>
    </MARQUEE>
    </FONT></DIV>
    </body>
    </html>

    把上面的 HTML 代码保存在 ./webcontent/ps/login 文件夹中的 alerts.html 文件中。
    <MARQUEE> 标记包含将在屏幕上滚过的消息。在这个示例中,消息是 “Announcement! System will be unavailable after 5pm due to a reboot”。另外,以下 JavaScript 代码设置 HTML 页面的刷新以及时反映消息的变动,页面会在 10 秒内刷新。
    <script type="text/JavaScript">
    <!--
    function timedRefresh(timeoutPeriod) {
    	setTimeout("location.reload(true);",timeoutPeriod);
    }
  3. 当浏览器显示 <IFRAME> 时,<body onload= 标记将指示浏览器调用刷新页面的函数,<IFRAME> 会在屏幕上显示滚动消息 “Announcement! System will be unavailable after 5pm due to a reboot.”。

附录 A

在 Microsoft IIS7 上启用定制

在使用 Microsoft IIS7 web 服务器时,装载定制模板的 AJAX 请求会失败,定制效果不会出现。用户一直会看到默认的登录页面。

这个问题的原因是,IIS7 在默认情况下不知道如何处理扩展名为 .xhtml 的文件,因此阻塞它们。纠正方法是为 .xhtml 添加 MIME 类型映射 text/xml

在 Internet Information Services Manager (IISM) 中,选择您的 IBM Cognos 10 web 别名(例如 /c10)的 Features View。

双击 MIME-Types。

图 4. IISM 中 /c10 别名的 Features View
IISM 中 /c10 别名的 Features View

接下来,单击右上角的 Add...

.xhtml 扩展名添加新的 MIME 类型 text/xml

图 5. 在 IISM 中为 xhtml 扩展名添加新的 MIME 类型
在 IISM 中为 xhtml 扩展名添加新的 MIME 类型

单击 OK 保存设置,再次访问登录页面。

参考资料

学习

获得产品和技术

讨论

  • 参与 developerWorks 博客 并加入 developerWorks 中文社区,developerWorks 社区是一个面向全球 IT 专业人员,可以提供博客、书签、wiki、群组、联系、共享和协作等社区功能的专业社交网络社区。

条评论

developerWorks: 登录

标有星(*)号的字段是必填字段。


需要一个 IBM ID?
忘记 IBM ID?


忘记密码?
更改您的密码

单击提交则表示您同意developerWorks 的条款和条件。 查看条款和条件

 


在您首次登录 developerWorks 时,会为您创建一份个人概要。您的个人概要中的信息(您的姓名、国家/地区,以及公司名称)是公开显示的,而且会随着您发布的任何内容一起显示,除非您选择隐藏您的公司名称。您可以随时更新您的 IBM 帐户。

所有提交的信息确保安全。

选择您的昵称



当您初次登录到 developerWorks 时,将会为您创建一份概要信息,您需要指定一个昵称。您的昵称将和您在 developerWorks 发布的内容显示在一起。

昵称长度在 3 至 31 个字符之间。 您的昵称在 developerWorks 社区中必须是唯一的,并且出于隐私保护的原因,不能是您的电子邮件地址。

标有星(*)号的字段是必填字段。

(昵称长度在 3 至 31 个字符之间)

单击提交则表示您同意developerWorks 的条款和条件。 查看条款和条件.

 


所有提交的信息确保安全。


static.content.url=http://www.ibm.com/developerworks/js/artrating/
SITE_ID=10
Zone=Information Management
ArticleID=677511
ArticleTitle=IBM Cognos 最佳实践: 定制 IBM Cognos 10 登录
publish-date=06022011