开发者深度解析：利用 Visualforce 构建自定义 Salesforce UI

大家好，我是一名 Salesforce 开发人员。在 Salesforce 生态系统中，我们有多种构建用户界面的技术选择，从经典的 Visualforce 到现代的 Aura 和 Lightning Web Components (LWC)。尽管 LWC 是未来的方向，但 Visualforce 凭借其独特的优势和在特定场景下的不可替代性，至今仍在许多组织中扮演着至关重要的角色。今天，我将以开发人员的视角，与大家深入探讨 Visualforce 的核心概念、工作原理以及最佳实践，帮助您更好地利用这一强大工具。

背景与应用场景

Visualforce 是一个基于组件的 UI 框架，允许开发人员在 Salesforce 平台上构建复杂的、自定义的用户界面。它采用了一种类似于 HTML 的、基于标签的标记语言，并与 Apex (Salesforce 的后端编程语言) 紧密集成，实现了经典的模型-视图-控制器 (Model-View-Controller, MVC) 架构。

尽管 Salesforce 正在大力推广 Lightning Experience 和 LWC，但在以下场景中，Visualforce 仍然是首选或必要的解决方案：

1. PDF 文件生成

这是 Visualforce 最经典的杀手级应用。通过在 <apex:page> 标签中设置 renderAs="pdf" 属性，您可以轻松地将页面内容渲染成 PDF 格式。这对于生成报价单、合同、发票或任何需要精确格式化和打印的文档来说，都是一个非常强大且直接的功能。LWC 目前没有原生支持此功能。

2. 自定义邮件模板

Visualforce 允许您创建动态且高度个性化的 HTML 邮件模板。您可以利用 Apex 控制器来查询复杂的数据，并在邮件中展示相关列表、计算值等，这是标准邮件模板无法实现的。

3. 覆盖标准操作

您可以使用 Visualforce 页面来覆盖标准对象或自定义对象的标准按钮和链接，例如“新建(New)”、“编辑(Edit)”或“查看(View)”。这使您能够创建自定义的记录创建向导、引导式编辑流程或完全定制的记录详情页。

4. 在 Page Layout 中嵌入自定义功能

通过将 Visualforce 页面嵌入到标准的页面布局 (Page Layout) 中，您可以无缝地在标准 UI 中添加复杂的功能，例如显示来自外部系统的数据、呈现复杂的图表或提供交互式的数据输入组件。

5. 为 Salesforce Classic 提供 UI

对于仍在使用 Salesforce Classic 界面的组织，Visualforce 是构建自定义页面的主要方式。

原理说明

要真正掌握 Visualforce，理解其背后的 MVC 架构至关重要。这套架构将应用程序的逻辑清晰地分离为三个部分，使得代码更易于维护和扩展。

1. 模型 (Model)

模型代表了您的数据。在 Salesforce 中，这通常是标准对象（如 Account, Contact）和自定义对象 (Custom Objects)。它包含了所有的数据字段、关系以及数据验证规则。

2. 视图 (View)

视图是用户所看到的界面。在 Visualforce 中，视图就是 .page 文件，由一系列 Visualforce 标签组成。这些标签最终会在服务器端被渲染成 HTML。例如，<apex:pageBlock> 会被渲染成一个标准的 Salesforce 样式区块，而 <apex:inputField> 则会根据其绑定的字段类型渲染成合适的输入控件。

3. 控制器 (Controller)

控制器是连接模型和视图的桥梁，负责处理用户的输入、执行业务逻辑并准备要显示的数据。Visualforce 支持三种类型的控制器，选择哪一种取决于您的需求：

Standard Controller (标准控制器): Salesforce 为所有标准和自定义对象自动提供。它包含了对象的基本功能，如保存、编辑、删除和取消记录。当您只需要对单个记录进行标准的 CRUD (Create, Read, Update, Delete) 操作时，使用标准控制器是最快的方式。
Custom Controller (自定义控制器): 这是一个由您自己编写的 Apex 类。当您需要实现复杂的业务逻辑，比如操作多个对象、调用外部 Web 服务，或者页面的功能不与任何特定对象绑定时，就需要使用自定义控制器。自定义控制器让您拥有对页面行为的完全控制权。
Controller Extension (控制器扩展): 它也是一个 Apex 类，但它的作用是扩展或覆盖标准控制器或另一个自定义控制器的功能。您可以使用扩展来添加新的操作方法或数据，同时仍然利用基础控制器的现有功能。一个页面可以有多个控制器扩展。

当用户与 Visualforce 页面交互时（例如点击一个按钮），请求会被发送到控制器。控制器执行相应的 Apex 方法，可能会查询或更新数据库 (Model)，然后返回一个 PageReference 对象，该对象决定了用户接下来会看到哪个页面 (View)。

示例代码

让我们通过几个 Salesforce 官方文档中的示例来具体了解不同控制器的用法。

示例 1: 使用 Standard Controller 显示和编辑记录

这个例子展示了如何使用标准控制器来快速创建一个用于显示和编辑客户 (Account) 记录的页面。我们不需要编写任何 Apex 代码。

Visualforce Page (AccountEdit.page)

<!-- 
    page 标签是所有 Visualforce 页面的根元素。
    standardController="Account" 指定我们使用客户对象的标准控制器。
    这会自动为页面提供一个名为 "account" 的变量，代表当前上下文中的记录。
-->
<apex:page standardController="Account">
    <!-- form 标签是所有需要提交数据的输入组件的容器 -->
    <apex:form>
        <!-- 
            pageBlock 组件用于创建具有 Salesforce 经典外观的 UI 区块。
            mode="edit" 表示区块内的字段默认处于编辑模式。
        -->
        <apex:pageBlock title="Edit Account" mode="edit">
            <!-- 
                pageBlockButtons 定义了区块顶部的按钮区域。
                location="top" 将按钮放在顶部。
            -->
            <apex:pageBlockButtons location="top">
                <!-- commandButton 渲染一个按钮。action="{!save}" 调用标准控制器的 save 方法 -->
                <apex:commandButton value="Save" action="{!save}"/>
                <!-- action="{!cancel}" 调用标准控制器的 cancel 方法 -->
                <apex:commandButton value="Cancel" action="{!cancel}"/>
            </apex:pageBlockButtons>
            <!-- pageBlockSection 创建区块内的一个可折叠部分 -->
            <apex:pageBlockSection title="Account Information" columns="2">
                <!-- 
                    inputField 绑定到 sObject 字段。它会自动根据字段类型（文本、日期、选项列表等）
                    渲染合适的输入控件，并自带标签。
                    value="{!account.Name}" 将此输入框绑定到标准控制器提供的 account 记录的 Name 字段。
                -->
                <apex:inputField value="{!account.Name}"/>
                <apex:inputField value="{!account.Phone}"/>
                <apex:inputField value="{!account.Industry}"/>
                <apex:inputField value="{!account.AnnualRevenue}"/>
            </apex:pageBlockSection>
        </apex:pageBlock>
    </apex:form>
</apex:page>

示例 2: 使用 Custom Controller 显示数据列表

这个例子展示了如何创建一个 Apex 类作为自定义控制器，从中查询联系人 (Contact) 列表并在页面上显示。

Apex Controller (myController.cls)

// 这是一个普通的 Apex 类，用作自定义控制器
public class myController {

    // getContacts 方法将由 Visualforce 页面调用以获取数据
    // 它必须是 public 且以 "get" 开头，这样才能在页面上通过 {!contacts} 访问
    public List<Contact> getContacts() {
        // 执行 SOQL 查询以获取联系人列表
        List<Contact> results = [SELECT Id, Name FROM Contact];
        return results;
    }

    // save 方法是一个操作方法，可以由页面上的按钮调用
    public PageReference save() {
        // 在这里可以添加 DML 操作，例如 anObject.upsert()
        // PageReference 用于导航。返回 null 表示停留在当前页面
        return null;
    }
}

Visualforce Page (contactList.page)

<!-- 
    controller="myController" 属性将此页面与我们上面创建的 Apex 类关联起来。
-->
<apex:page controller="myController">
    <apex:pageBlock title="My Content">
        <!-- 
            pageBlockTable 用于显示一个记录列表。
            value="{!contacts}" 调用控制器中的 getContacts 方法来获取数据源。
            var="c" 为列表中的每一行记录定义一个循环变量。
        -->
        <apex:pageBlockTable value="{!contacts}" var="c">
            <!-- column 组件定义了表格的一列 -->
            <apex:column value="{!c.Name}"/>
        </apex:pageBlockTable>
    </apex:pageBlock>
</apex:page>

示例 3: 使用 Controller Extension 扩展功能

这个例子展示了如何为客户 (Account) 的标准控制器添加一个扩展，以实现自定义的问候语功能。

Apex Controller Extension (myControllerExtension.cls)

public class myControllerExtension {

    private final Account acct;

    // 扩展的构造函数必须接受一个 ApexPages.StandardController 对象作为参数
    public myControllerExtension(ApexPages.StandardController stdController) {
        // 通过 getRecord() 方法获取标准控制器正在处理的记录
        this.acct = (Account)stdController.getRecord();
    }

    // 自定义的 getGreeting 方法
    public String getGreeting() {
        return 'Hello ' + acct.Name + ' (' + acct.Id + ')';
    }
}

Visualforce Page (greeting.page)

<!--
    standardController="Account" 指定基础控制器。
    extensions="myControllerExtension" 添加我们的扩展类。
    可以有多个扩展，用逗号分隔。
-->
<apex:page standardController="Account" extensions="myControllerExtension">
    <!-- {!greeting} 会首先在标准控制器中查找，找不到时再到扩展类中查找 getGreeting 方法 -->
    {!greeting}
</apex:page>

注意事项

作为开发人员，在构建 Visualforce 页面时，必须注意以下几点：

1. 权限与共享 (Permissions and Sharing)

Visualforce 页面和其 Apex 控制器默认情况下是在系统模式下运行的，这意味着它会忽略用户的字段级安全 (Field-Level Security, FLS) 和对象权限。为了强制执行当前用户的共享规则，必须在控制器类上使用 with sharing 关键字。同时，对于 FLS，您应该在 SOQL 查询或 DML 操作之前使用 Schema 方法（如 SObjectType.Account.fields.Name.isAccessible()）进行显式检查。

2. 调控器限制 (Governor Limits)

Visualforce 页面的所有请求（包括页面加载和按钮点击）都在一个 Apex 事务中执行，因此受所有 Apex 调控器限制的约束。关键限制包括：SOQL 查询总数（100）、DML 语句总数（150）、总 CPU 时间等。务必编写高效的 Apex 代码，避免在循环中执行 SOQL 或 DML 操作。

3. 视图状态 (View State)

View State 是一个加密的隐藏表单字段，它包含了页面及其控制器状态所需的数据，以便在回发 (postback) 之间保持状态。View State 的大小上限为 170KB。过大的 View State 会导致页面加载缓慢并可能最终抛出错误。要减小 View State，请将不需要在请求之间保留的控制器成员变量声明为 transient。

4. 安全性 (Security)

Visualforce 框架内置了对抗跨站脚本 (Cross-Site Scripting, XSS) 的保护，大多数标准组件会自动对输出进行 HTML 编码。但是，如果使用了 <apex:outputText escape="false">，或者在 JavaScript 中使用了 Apex 变量，就需要格外小心。对于 SOQL 注入 (SOQL Injection)，永远不要直接将用户输入拼接到动态 SOQL 查询字符串中，而应始终使用静态查询和绑定变量。

总结与最佳实践

Visualforce 是一个成熟且功能强大的框架。虽然 LWC 是构建现代、高性能 UI 的首选，但 Visualforce 仍然是 Salesforce 开发人员工具箱中不可或缺的一部分。

以下是一些关键的最佳实践：

优先选择标准功能： 尽可能使用标准控制器和控制器扩展，以重用 Salesforce 的内置功能，减少代码量。
优化 View State： 谨慎管理控制器中的变量，对所有非必要的状态数据使用 transient 关键字。
异步处理： 对于耗时较长的操作（如调用外部服务或处理大量数据），使用 @future 注解、Queueable Apex 或 Batch Apex 将其异步化，以避免页面超时并改善用户体验。
利用 AJAX： 使用 <apex:actionFunction> 或 <apex:actionSupport> 实现部分页面刷新，减少数据传输，提高页面响应速度。
代码与安全： 始终在编写 Apex 控制器时考虑共享规则 (with sharing) 和 FLS，并遵循安全编码实践。
明确使用场景： 新的复杂 UI 项目应优先考虑 LWC。仅在需要 PDF 生成、邮件模板或特定 Salesforce Classic 定制时才选择 Visualforce。

希望这篇深度解析能帮助您更全面地理解 Visualforce，并在实际项目中做出更明智的技术决策。作为 Salesforce 开发人员，掌握多种工具并了解其各自的优缺点，是我们不断成长的关键。

Salesforce中文网