联机提供商的 Web 身份验证代理注意事项 (HTML)
[ 本文适用于编写 Windows 运行时应用的 Windows 8.x 和 Windows Phone 8.x 开发人员。如果你要针对 Windows 10 进行开发,请参阅 最新文档 ]
作为身份验证提供商,在设置供 Windows 应用商店应用使用的身份验证服务时有特定细节要考虑。此外,你可以使用首选标记自定义展示给 Windows 应用商店应用用户的网页。
联机身份验证提供商的注意事项
Web 身份验证代理基于为 Windows 中的 Internet Explorer 提供支持的技术而构建。但是,由于此组件有非常特殊的用途,因此 Internet Explorer 的一些功能会针对特定配置禁用或锁定。 而且,Web 身份验证代理提供了一个专用的事件日志记录通道来帮助解决它所处理的页面出现的问题。
Internet Explorer 标准文档模式
Web 身份验证代理在特定 Windows 版本的 IE 标准模式中显示所有页面。例如,在 Windows 8 中,Web 身份验证代理在“IE10 标准模式”""中显示页面。 你可以使用 Internet Explorer 中的开发人员工具来查看页面在不同文档模式下的工作方式。 有关 Internet Explorer 兼容性的详细信息,请参阅 MSDN 上的 Internet Explorer 主题。
已禁用和锁定的功能
Internet Explorer 的几个功能已经针对无法在操作系统的“Internet 选项”中更改的特定值完全禁用或锁定。
功能 | 状态 |
---|---|
应用程序缓存 API(简称“AppCache”) | 禁用 |
链接历史记录 | 禁用 |
临时文件 | 启用 |
Cookie | 会话 Cookie 处于启用状态。允许 Cookie 持续存在,但是,除非 Web 身份验证代理处于 SSO 模式,否则 Cookie 会被自动清除。有关详细信息,请参阅“单一登录”部分。 |
索引数据库 | 禁用 |
DOM 存储 | 禁用 |
ActiveX | 禁用 |
文件下载 | 禁用 |
HTTPS 要求
应用将用来与联机提供商通信的第一个 URL 是成为 HTTPS 所必需的。
不同视图状态的尺寸
Windows 8 应用可以以多个不同大小的应用、纵向或横向或者在“超级按钮”(例如“共享”超级按钮)内显示。根据用来显示 Web 身份验证代理的视图,网页在工作时必须采用的尺寸可能会有所不同。 有关详细信息,请参阅窗口大小和屏幕缩放指南主题和共享内容指南主题。
网页应当使用 CSS 媒体查询来检查它在工作时必须采用的尺寸并自行进行相应的布置。但是,页面不应当基于此处记录的确切像素数进行设计,页面应当能够缩放到不同的尺寸。本文档中指定的尺寸会在将来的操作系统版本中进行更改。
如果页面不能存放所分配空间中的所有信息(例如,应用所请求的权限列表太长),则 Web 身份验证代理将提供滚动条,以便允许用户根据需要滚动页面。缩放功能还由收缩缩放手势(针对基于触控的设备)和 Ctrl + 鼠标滚轮(针对台式电脑和便携式电脑)提供。
若要测试不同的缩放系数,请使用在 Microsoft Visual Studio Professional 2012 中加载的 Web 身份验证代理 SDK 示例应用来允许模拟不同的视图大小。
示例视图
以下示例显示 Web 身份验证代理 UI,其中网页尺寸是:
- 宽度:260 像素
- 高度:屏幕高度(取决于屏幕分辨率)
注意,Web 身份验证代理 UI 仅在屏幕截图右侧。
超级按钮视图
对于超级按钮视图,网页尺寸有:
- 宽度:566 像素
- 高度:屏幕高度(取决于屏幕分辨率)
以下示例显示 Web 身份验证代理 UI 在超级按钮视图中的情况。
文件选取器视图
对于文件选取器视图,网页尺寸有:
- 宽度:566 像素
- 高度:屏幕高度(取决于屏幕分辨率)
以下示例显示 Web 身份验证代理 UI 在文件选取器视图中的情况。
默认情况下无新窗口
默认情况下,任何 URL 都不会导致打开新窗口,而是将显示在 Web 身份验证代理窗口中。这包括 window.open JavaScript 方法、超链接的 "target" 属性,或者当用户使用“Ctrl+单击”机制强制打开新窗口时。如果网页声明链接可以安全地在浏览器中导航,则此规则会出现例外,如“自定义超链接的目标”中所述。
自定义 Web 身份验证页面
可以借助于在网页上定义的元数据标记,使用标题、图标和标题颜色对网页上的用户界面 (UI) 进行自定义。Web 开发人员可以使用 HTML <meta> 标记在 Web 身份验证代理 UI 中显示提供者的个人设置和品牌。另外,开发人员可以指示更复杂的用户操作,例如,注册和恢复密码。此概念与 Windows Internet Explorer 9 和 Windows 7 的“已固定的网站”功能非常相似。
除了自定义围绕网页区域的用户界面外,网页还应当利用 Windows 8 控件的样式、启用了触控功能而且允许在适用的浏览器中打开链接。
下面是利用 Web 身份验证代理自定义模型的网页示例。
自定义图标
网页可以通过使用 mswebdialog-logo meta 标记来提供图标。
<meta name="mswebdialog-title" content="Contoso Social"/>
内容是一个 URL,该 URL 可以是相对页面,也可以是绝对页面。该 URL 的方案可以是 HTTP 或 HTTPS。该文件的格式应当是 PNG 或 JPG。 图像的大小应当为 30x30 像素。如果图像的尺寸不是 30x30 像素,则它将由操作系统进行缩放,使其能够适合 30x30 空间。图像应当设计为在放大到 140% 和 180% 时能够很好地显示,以适应分辨率更高的屏幕。 为了测试不同的缩放系数,请使用在 Visual Studio 11 中加载的 Web 身份验证代理 SDK 示例应用,该应用允许使用设计模式的设备窗口模拟不同的分辨率和缩放系数。
自定义标题文本
网页可以通过使用 mswebdialog-title meta 标记来提供标题。
<meta name="mswebdialog-title" content="Contoso Social"/>
标题应当简短而且应当反映提供者(例如 Contoso)的品牌。
自定义标题颜色
网页可以通过使用 mswebdialog-header-color meta 标记来提供代表其品牌标识的颜色,品牌标识将用于对话框的标题。
<meta name="mswebdialog-header-color" content="#1267DF"/>
颜色可以是此处指定的任何值。但是,Web 身份验证代理将忽略任何 alpha 通道值。 使用页面上的专用颜色以及页面上的通用颜色时,建议遵循提供者的 Windows 8 应用中使用的颜色,但前提是存在这样的应用。
注意 在分析 META 标记之后,每个服务器的图标和颜色会缓存到客户端上。 请在启动 UI 之前清除客户端缓存,以便所做的更改生效。为此,请修改以下注册表设置:
// Registry location under HKLM used for setting various AuthHost parameters.
#define AUTH_HOST_LOCAL_MACHINE_REGPATH \
L"SOFTWARE\\Microsoft\\Windows NT\\CurrentVersion\\Image File Execution Options\\authhost.exe"
// MaxAge to use for downloading logo images
#define AUTH_HOST_LOGO_IMAGE_MAX_AGE_SECONDS_REG_VALUE_NAME \
L"LogoImageMaxAgeSeconds"
// 24 hours
#define AUTH_HOST_LOGO_IMAGE_MAX_AGE_SECONDS_DEFAULT \
(24 * 60 * 60)
图标在下载之后 24 小时内不会被再次选取。 为了测试徽标图像,请将上面的注册表项设置为较小的值。
自定义网页
除了自定义围绕网页的 UI 外,开发人员还应当创建与整个 Windows 8 体验集成的无缝网页。这包括使用建议的样式、确保网页在支持触控的设备上正常工作以及在 Web 浏览器中打开某些网页。
样式设置
强烈建议你使用此处建议的样式来创建跨 Web 身份验证代理网页和其他 Windows 8 UI 组件的更一致的用户体验。网页应当使用白色背景,而且不应当有边框。“登录”或“取消”之类的按钮应当放在右下角,而且应当与标题使用相同的颜色。最后,由于 Web 身份验证代理提供了一个“后退”按钮,因此请考虑将“取消”按钮从网页中完全消除。
启用触控
在设计网页时,应当记住让其能够进行基于触控的用户交互。有关在 Windows 8 中进行触控设计的详细信息,请参阅触控交互设计主题。
自定义超链接的目标
Web 身份验证代理最适合提供需要单个用户操作(如登录)的网页或 OAuth 授权页面。但是,对于更复杂的、用户应当花些时间来了解和完成的用户流(如帐户创建、恢复已丢失或忘记的密码、显示隐私声明等),建议在用户的首选浏览器中启动这些页面,以便支持完整导航并到达浏览目标。 在默认情况下,Web 身份验证代理不允许从网页打开新的浏览器窗口(有关详细信息,请参阅“默认情况下无新窗口”)。但是,通过使用 meta 标记
mswebdialog-newwindowurl
,网页可以声明哪些 URL 应当在浏览器中打开。mswebdialog-newwindowurl
允许网页指定 URL 或 URL 的一部分,每当系统要求 Web 身份验证代理通过使用目标属性或 window.open() 方法在新窗口中打开 URL 时,Web 身份验证代理都会对 URL 或 URL 的一部分进行匹配(左侧字符串匹配)。如果匹配,则 URL 将在用户的默认浏览器中打开。如果不匹配,则 Web 身份验证代理将导航到 URL 本身(默认行为)。例如:<meta name="mswebdialog-newwindowurl" content="https://www.contoso.com/privacy"/>
对于此 meta 标记,Web 身份验证代理将在浏览器中打开 https://www.contoso.com/privacy/policy.html,但是将直接导航到 https://www.contoso.com/termsofuse.html。请注意,不尝试在新窗口中打开的链接(例如,不使用目标属性或 window.open() 方法的链接)不会受到此 meta 标记的影响。 内容是一个 URL,该 URL 可以是相对页面,也可以是绝对页面。该 URL 的方案可以是 HTTP 或 HTTPS。 你应当将
mswebdialog-newwindowurl
meta 标记定义为涵盖任何不属于核心用户流的链接(如隐私声明、注册表单等)。如果你支持使用第三方身份验证提供商(例如,OpenID 提供商)进行登录,请确保使这些交互保持在 Web 身份验证代理内部。 为了使页面上的所有链接可以在浏览器中安全地打开,请使用星号语法,例如:<meta name="mswebdialog-newwindowurl" content="*"/>
请注意,“*”只能单独使用,而不能与另一个 URL 结合使用,例如,"https://www.contoso.com/*" 是无效的语法。
适用于所有 meta 标记的规则
当 Web 身份验证代理处理 meta 标记时,下列规则适用:
- 除非遇到了名称相同但内容不同的 meta 标记,否则,meta 标记将作用于二级域(例如,contoso.com)下的所有页面。
- 如果在同一页面上遇到了多个同名的 meta 标记,则 Web 身份验证代理将只选择其中的一个标记而忽略其余标记。并未定义要具体选择哪个 meta 标记。注意 此规则不适用于允许同一页面上有多个实例的
mswebdialog-newwindowurl
meta 标记。