画布开发（9）Salesforce App中的Canvas

学习目标

完成本单元后，您将能够了解到：

• 设置Canvas应用程序位置并将其添加到导航菜单
  
• Salesforce App上下文注意事项
  
• Salesforce App Access注意事项
  
• Salesforce App自定义图标
  
• 适用于Canvas应用程序的Salesforce App导航方法

Canvas使您可以在Salesforce应用程序中公开您的画布应用程序。 Salesforce应用程序是随时随地的Salesforce。这款企业级移动应用程序可让您实时访问在办公室中看到的相同信息，但它可以帮助您在离开办公桌时完成工作。就像在完整的Salesforce站点中一样，用户可以访问发布者和Chatter订阅源项，包括Canvas应用。

开发人员可以在Salesforce应用中使用画布应用来：

• 将画布应用程序公开为动作。图标表示画布应用程序。您可以使用默认拼图图标或上传相关操作的自定义图标。
  
• 从Salesforce中的画布应用程序或Chatter API发布到Feed。
  
• 在Salesforce应用程序内的Feed项目中显示画布应用程序。图标表示画布应用程序。您可以使用默认拼图图标或在Feed项中提供缩略图URL来显示自定义图标。
  
• 在导航菜单中添加画布应用程序作为选项。图标表示画布应用程序。您可以使用默认拼图图标或在画布应用程序的连接应用程序设置中提供自定义图标URL。

注意：Canvas应用程序不会出现在Salesforce for Android的应用程序导航菜单中。要在导航菜单中查看画布应用程序，请登录Salesforce移动Web。

例如，您可能拥有仓库员工用于处理移动设备上的订单的画布应用程序。您可以创建一个从设备图标访问应用程序的操作，允许员工提取客户订单列表。处理订单后，应用程序会在Salesforce中设置订单状态，并将Feed项目发布到关联的客户帐户。

用户仍然可以在台式机上的Salesforce中访问您的画布应用程序。 Salesforce提供的移动设备的附加功能不会影响或限制现有功能。

设置Canvas应用程序位置并将其添加到导航菜单

要添加要在Salesforce应用程序导航菜单中显示的画布应用程序，您必须设置位置并将其添加到移动导航。

1. 在Salesforce中，从“设置”中，在“快速查找”框中输入“应用”，然后选择“Apps”。
   
2. 在“已连接的应用程序”相关列表中，单击导航窗格中要提供的应用程序，然后单击“Edit”。
   
3. 在“Canvas应用程序设置”部分中，选择“Canvas”。
   
4. 在“位置”字段中，选择“Mobile Nav”，然后单击“Add”。
   
5. 单击“Save”。
   
6. 要使画布应用程序显示在导航菜单中，您必须将其添加到移动导航中。从设置中，输入导航在“快速查找”框中，选择“Salesforce Navigation”。
   
7. 从可用的菜单项中，选择您的应用，然后单击“Add”。
   
8. 单击“Save”。

Salesforce App上下文注意事项

在Salesforce应用程序内显示画布应用程序时，请记住这些注意事项。

在Feed或发布者中显示画布应用程序时，您收到的画布上下文（来自签名请求或来自getContext调用）包含特定于Salesforce应用程序发布者的信息。

• 您可以通过查看环境部分中的displayLocation值来验证您是在Feed还是发布者上。对于发布者，displayLocation设置为Publisher。对于Feed，displayLocation设置为ChatterFeed。
  
• 创建Canvas订阅源项时，可以将JSON字符串指定为参数的值。发送上下文时，feed项的参数字段中的任何值都将在上下文的environment部分的参数中发送。
  
• 与任何画布应用程序一样，上下文包含有关应用程序维度的信息。由于Salesforce是专为移动设备设计的，因此我们为其提供的尺寸与我们为完整Salesforce网站提供的尺寸不同。
  
• 要创建单指触摸滚动体验：
  
  1. 确保最外面的div元素包含以下属性。
     
     • 最小高度：250px;
       
     • 溢出：滚动;
       
     • 宽度：100％;
       
     • -webkit-overflow-scrolling：touch;
       
     • -webkit-transform：translated（0％，0px，0px）;
       
  2. 将height属性设置为签名请求中提供的clientHeight值。例如：
     // Where sr is a parsed signed request object.
     var h = parseInt(sr.context.environment.dimensions.clientHeight, 10);
     Sfdc.canvas.byId(‘divElementId’).style.height = h;
     
  3. clientHeight值可能非常小，特别是在手机的横向模式下，用户可能无法看到任何内容。将min-height设置为所需的高度（以像素为单位），以确保良好的用户体验。
     
  4. 在导航菜单中，默认拼图图标大小为60像素乘60像素。

Salesforce App Access注意事项

修改Salesforce应用程序中显示的画布应用程序时，请记住这些注意事项。

必要时，Salesforce应用程序布局与您习惯使用的完整Salesforce站点布局不同。在创建用于Salesforce应用程序的画布应用程序时，请记住以下内容。

• 由于画布应用程序旨在在Salesforce中显示第三方应用程序，因此设备必须能够访问画布应用程序URL。如果您的应用只能在防火墙后面访问，那么移动设备也必须位于防火墙后面。如果用户无权访问画布URL，则会收到错误 – 可能是404或500错误。
  
• 当您将画布应用程序作为操作访问时，如果画布应用程序使用“您在做什么”标题，则标题将固定在页面顶部，并且画布应用程序滚动区域将位于标题文本框下方。
  
• Feed中的画布应用程序链接和说明可能显示的字符数少于完整Salesforce站点中显示的字符数。
  
• 根据您使用的设备，如果旋转设备，进纸屏幕可能会发生变化。如果可能，您的画布应用应支持旋转。使用orientation事件处理设备方向的更改。
  
• Salesforce应用程序和完整Salesforce站点中使用的高度不同。使用签名请求中的Dimensions对象在发布者中正确呈现您的操作。
  
• 在操作菜单中，可能会截断长动作标签。
  
• Feed布局与完整Salesforce站点的布局不同。而不是在Feed中打开应用程序，将打开一个页面，在整个屏幕上显示画布应用程序。要返回Salesforce应用，请点按。
  
• 当您查看操作栏或Feed时，将显示画布应用程序的默认Canvas拼图图标。您可以使用您提供的图像覆盖此默认操作图标。
  
• 当画布应用程序在导航菜单中显示为选项时，将使用默认的Canvas拼图图标。您可以在画布应用程序的连接应用程序设置中自定义图标。
  
• 当用户脱机访问Salesforce时，Canvas应用程序不可用。

Salesforce应用程序自定义图标

自定义图标有助于区分Salesforce应用中的应用。如果您没有自定义应用程序的图标，您将获得默认的拼图图标。

您可以自定义Salesforce导航菜单中使用的图标。您可以在画布应用程序的连接应用程序设置的“基本信息”部分的“图标URL”条目中设置此图标。在“设置”中，在“快速查找”框中输入“应用”，然后选择“应用”并单击“编辑”以连接应用。图标URL必须是指向图标图像文件的安全HTTPS URL。图像文件必须是GIF，JPG或PNG文件格式。对于Salesforce导航菜单，图标不能大于60像素高，60像素宽。

Salesforce导航菜单中使用的自定义图标也用于Chatter选项卡和Canvas App Previewer。如果您的画布应用程序将显示在导航菜单中，我们建议您使用60×60像素大小的图标，让Salesforce自动将图标调整为Chatter选项卡和Canvas App Previewer所需的较小尺寸。

您还可以自定义画布应用程序的Salesforce操作栏和操作菜单中使用的图标。操作栏使用为访问画布应用程序的操作设置的自定义图标，而不是与连接的应用程序关联的自定义图标。您可以通过上载自定义图标的静态资源文件然后使用此静态资源作为全局操作的图标来设置操作图标。静态资源图标文件应为PNG格式，大小为120像素高，120像素宽。有关自定义操作图标的更多指南，请参阅“Salesforce App开发人员指南”中的“自定义图标指南和最佳实践”。

用于Canvas应用程序的Salesforce App导航方法

Canvas框架包含可用于在canvas应用程序和Salesforce应用程序之间平滑集成导航的方法，而无需使用Visualforce。

以前，绕过包含画布应用程序的iframe的导航限制的唯一方法是使用Visualforce页面。这些Canvas方法提供了一种更简单的替代方法，用于控制Salesforce应用程序中的画布应用程序的导航。

例如，您的画布应用程序代码可以调用Salesforce“创建记录”逻辑以导航到“Create Account”按钮所在的页面。单击该按钮会触发导航方法以转到创建页面，该页面位于画布应用程序之外。

Canvas框架中的这些方法是驻留在JavaScript库中的事件。从画布代码调用其中一种导航方法时，会向Salesforce发送一个事件，该事件将读取有效内容并将用户定向到指定的目标。

从画布应用程序调用方法与从Visualforce页面调用函数略有不同，因为这些方法通过Canvas跨域API代理到Salesforce容器。

将导航方法引用为具有名称和有效负载的事件变量。例如：

var event = {name:”s1.createRecord”, payload: {entityName: “Account”, recordTypeId: “00h300000001234”}};

下表显示了Salesforce中导航方法的名称，有效负载和用途。

Function	Description
back([refresh])	导航到sforce.one历史记录中保存的先前状态。它相当于单击浏览器的“后退”按钮。 刷新是可选的。默认情况下，页面不刷新。如果可能，传递true以刷新页面。
navigateToSObject(recordId [, view])	导航到由recordId指定的sObject记录。此记录“主页”有多个视图，Salesforce应用程序中的视图可用作用户可以在其间滑动的幻灯片。 view是可选的，默认为detail。 view指定记录主页中最初显示的幻灯片。 注意：不支持与ContentNote SObject对应的记录ID。可能的值如下。 •detail：记录详细信息幻灯片 •chatter：Chatter幻灯片 •related：相关幻灯片的视图
navigateToURL(url[, isredirect])	导航到指定的URL。 支持相对和绝对URL。相对URL相对于Lightning域，并保留导航历史记录。外部URL – 即Lightning域外的URL – 在单独的浏览器窗口中打开。 注意：根据用户的设备平台，设备设置，Salesforce版本以及要打开的外部URL的身份验证要求，单独的浏览器窗口可能需要身份验证或重新身份验证。 使用相对网址导航到应用内的不同屏幕。使用外部URL允许用户访问其他站点或应用程序，他们可以在其中执行不需要在应用程序中保留的操作。要返回到您的应用，必须在用户完成其他应用时关闭由外部URL打开的单独窗口。新窗口与您的应用程序具有单独的历史记录，并且在关闭窗口时将丢弃此历史记录。这也意味着用户无法单击“后退”按钮返回到您的应用程序;用户必须关闭新窗口。 mailto:, tel:, geo:, 和其他URL方案支持启动外部应用程序并尝试“做正确的事情。”但是，支持因移动平台和设备而异。 mailto：和tel：是可靠的，但我们建议您测试一系列预期设备上的任何其他URL。 isredirect 是可选的，默认为false。将其设置为true以指示新URL应替换导航历史记录中的当前URL。 注意：在 <apex:commandButton>或任何 <button type=”submit”> or<input type=”submit”>的onClick处理程序中使用navigateToURL时要小心. 即使isredirect = true，命令按钮的默认单击操作也是表单帖子。 在此方案中，命令按钮执行表单发布和navigateToURL操作，要求用户单击后退按钮两次以导航到上一页。 要阻止默认单击操作，请将onClick处理程序配置为调用 event.preventDefault（）或返回false。 注意：不支持与ContentNote SObject对应的URL。
navigateToFeed(subjectId, type)	导航到指定类型的Feed，作用域为subjectId。对于某些Feed类型，subjectId是必需的但是被忽略。对于这些Feed类型，将当前用户的ID作为subjectId传递。 type是Feed类型。可能的值如下。 •BOOKMARKS：包含上下文用户保存为书签的所有Feed项。将当前用户的ID作为subjectId传递。 •COMPANY：包含除TrackedChange类型的Feed项目之外的所有Feed项目。要查看订阅源项，用户必须具有对其父项的共享访问权限。将当前用户的ID作为subjectId传递。 •文件：包含所有包含上下文用户遵循的人员或组发布的文件的源项目。将当前用户的ID作为subjectId传递。 •GROUPS：包含上下文用户拥有或属于其成员的所有组中的所有Feed项。将当前用户的ID作为subjectId传递。 •新闻：包含上下文用户遵循的所有更新，用户所属的组以及用户所关注的文件和记录。包含父级为上下文用户的记录的所有更新。包含提及上下文用户或提及上下文用户所属的组的每个提要项和注释。将当前用户的ID作为subjectId传递。 •PEOPLE：包含上下文用户遵循的所有人发布的所有Feed项。将当前用户的ID作为subjectId传递。 •RECORD：包含父级为指定记录的所有订阅源项，可以是组，用户，对象，文件或任何其他标准或自定义对象。当记录是一个组时，该提要还包含提及该组的提要项。当记录是用户时，该Feed仅包含该用户的Feed项。您可以获取其他用户的记录Feed。将记录的ID作为subjectId传递。 •TO：包含上下文用户提及的所有Feed项。包含上下文用户注释的订阅源项以及由评论的上下文用户创建的订阅源项。将当前用户的ID作为subjectId传递。 •TOPICS：包含包含指定主题的所有Feed项。将主题的ID作为subjectId传递。仅Salesforce for Mobile Web支持此值。 Salesforce for iOS或Salesforce for Android中不提供主题
navigateToFeedItemDetail( feedItemId)	导航到特定的源项，feedItemId和任何关联的注释。
navigateToRelatedList( relatedListId, parentRecordId)	导航到parentRecordId的相关列表。 例如，要显示Warehouse对象的相关列表，parentRecordId是Warehouse c.Id. relatedListId是要显示的相关列表的API名称或ID。
navigateToList(listViewId , listViewName, scope)	导航到listViewId指定的列表视图，该列表视图是要显示的列表视图的ID。 listViewName设置列表视图的标题。 它不需要匹配为列表视图保存的实际名称。 要使用保存的名称，请将listViewName设置为null。 将范围设置为视图中sObject的名称，例如“Account”或“MyObject c”。
createRecord(entityName[, recordTypeId][, defaultFieldValues])	打开页面以为指定的entityName创建记录，例如“Account”或“MyObject c”。 recordTypeId是可选的，它指定创建的对象的记录类型。调用 createRecord而不提供recordTypeId可能会导致错误。 defaultFieldValues是可选的，如果提供，则预填充记录创建面板上的字段，包括面板上未显示的字段。 用户必须具有对具有预填充值的字段的创建访问权限。 保存期间由字段访问限制引起的错误不会显示错误消息。
editRecord(recordId)	打开页面以编辑recordId指定的记录。

有关与Visualforce一起使用的导航方法的信息，请参阅Salesforce App Developer’s Guide。