分类： 使用Lightning Web Components开放源代码访问Salesforce数据

使用Lightning Web Components开放源代码访问Salesforce数据 – 连接到Salesforce

连接到Salesforce

在此步骤中，您将通过从Salesforce获取会话和演讲者数据来更新Trailhead项目“ 使用Lightning Web Components Open Source构建您的第一个应用程序”中构建的应用程序。

为此，您设置了本地 Express服务器以连接到Trailhead Playground，并提供一个为会议管理应用程序提供数据的端点。

安装套件

第一步是安装两个Node.js程序包，这些程序包将用于本地开发以及将Express服务器连接到Trailhead Playground并对其进行身份验证。这两个软件包是JSForce和Dotenv。

JSForce

JSforce（以前称为Node-Salesforce）是利用Salesforce API的同构JavaScript库。它既可以在浏览器中运行，也可以在Node.js中运行，并且主要是通过异步JavaScript函数调用封装对Salesforce提供的各种API的访问。

多滕夫

环境变量可帮助您维护应用程序的可配置性，而无需修改基础代码。Dotenv从本地.env文件加载环境变量，以提供轻松的本地开发体验。

要安装软件包：

  1. 打开一个终端窗口。
  2. 切换到包含会议管理应用程序的目录。
  3. 运行npm install jsforce@^1.0.0 dotenv。

创建.env文件

接下来，将本地环境文件添加到会议管理应用程序项目。这将存储用于将Express服务器连接到您的Salesforce实例的身份验证信息。

  1. 下载您选择的文本编辑器。尽管Salesforce不提供Lightning Web Components Open Source的扩展，但是我们仍然建议您使用 Visual Studio Code。我们将以VS Code作为我们将来的说明。
  2. 打开 Visual Studio代码。
  3. 按文件>打开。
  4. 选择您的conference-app文件夹，然后单击“打开”。Visual Studio Code中的会议应用程序视图。
  5. 按文件>新建文件。
  6. 复制此文本并将其粘贴到文件中。
  7. SF_LOGIN_URL=https://login.salesforce.com
SF_USERNAME=YOUR_USERNAME
SF_PASSWORD=YOUR_PASSWORD
SF_TOKEN=YOUR_SECURITY_TOKEN
  8. 使用您的数据更新占位符值
  9. SF_USERNAME：您的Trailhead Playground用户名。
    SF_PASSWORD：您的Trailhead Playground密码。
    SF_TOKEN：您的Trailhead Playground安全令牌。
  10. 按文件>保存。
  11. 输入.env（以前置字符开头）作为文件名。确保文件已保存在根文件夹（conference-app）中。如果您看到一条消息，显示系统文件保留了带前导号的文件名，则可以确认。

向Salesforce进行身份验证

Salesforce支持不同类型的身份验证机制，但是为了简单起见和该项目的目的，您使用基于用户名和密码的登录名。接下来，添加用于设置Express服务器以对您的Salesforce实例进行身份验证的代码。

  1. 展开src文件夹，然后展开server文件夹。
  2. 打开api.js。
  3. 将此代码粘贴到const app = express();： 
    const jsforce = require('jsforce');
require('dotenv').config();
const { SF_USERNAME, SF_PASSWORD, SF_TOKEN, SF_LOGIN_URL } = process.env;
if (!(SF_USERNAME && SF_PASSWORD && SF_TOKEN && SF_LOGIN_URL)) {
    console.error(
        'Cannot start app: missing mandatory configuration. Check your .env file.'
    );
    process.exit(-1);
}
const conn = new jsforce.Connection({
    loginUrl: SF_LOGIN_URL
});
conn.login(SF_USERNAME, SF_PASSWORD + SF_TOKEN, err => {
    if (err) {
        console.error(err);
        process.exit(-1);
    }
});
  4. 保存文件api.js。

此代码从您的.env文件中读取环境变量，并使用它们来创建到您的Salesforce实例的经过身份验证的连接。接下来，添加一些代码以从Salesforce中获取数据。

创建端点以从Salesforce读取数据

现在，您已经对Salesforce进行了身份验证，就可以开始安全地访问Salesforce资源。如前所述，您将创建一个运行逻辑以访问数据的端点。然后，客户端组件可以使用此端点。

对于此项目，您可以通过运行SOQL查询从Salesforce提取数据。SOQL代表Salesforce对象查询语言，其语法与SQL非常相似。它是特定于Salesforce的查询语言，专门用于访问Salesforce中的数据。SOQL还具有联接功能，允许您在单个查询中获取相关数据。

  1. 展开文件夹src，然后展开文件夹server。
  2. 打开api.js文件。
  3. app.get()用以下代码替换现有功能块： 
    app.get('/api/sessions', (req, res) => {
    const soql = `SELECT Id, Name, toLabel(Room__c), Description__c, format(Date_and_Time__c) formattedDateTime,
        (SELECT Speaker__r.Id, Speaker__r.Name, Speaker__r.Description, Speaker__r.Email, Speaker__r.Picture_URL__c FROM Session_Speakers__r)
        FROM Session__c ORDER BY Date_and_Time__c LIMIT 100`;
    /* Salesforce connection */
});

    该soql属性包含SOQL语句，用于从Salesforce查询会话和发言人数据。它使用通过Session Speakers连接对象的内部查询。

  4. /* Salesforce connection */用以下代码替换注释： 
    conn.query(soql, (err, result) => {
    if (err) {
        res.sendStatus(500);
    } else if (result.records.length === 0) {
        res.status(404).send('Session not found.');
    } else {
        /* Work with result data */
    }
});

    使用jsforce查询方法，您可以使用SOQL语句使用已认证的连接来运行该查询。

  5. 更换评论/* Work with result data */与 
    const formattedData = result.records.map(sessionRecord => {
    let speakers = [];
    if(sessionRecord.Session_Speakers__r){
        speakers = sessionRecord.Session_Speakers__r.records.map(
            record => {
                return {
                    id: record.Speaker__r.Id,
                    name: record.Speaker__r.Name,
                    email: record.Speaker__r.Email,
                    bio: record.Speaker__r.Description,
                    pictureUrl: record.Speaker__r.Picture_URL__c
                };
            }
        );
    }
    return {
        id: sessionRecord.Id,
        name: sessionRecord.Name,
        dateTime: sessionRecord.formattedDateTime,
        room: sessionRecord.Room__c,
        description: sessionRecord.Description__c,
        speakers
    };
});
res.send({ data: formattedData });

    需要将返回的数据的形状映射为Express服务器预期将其提供给会议管理应用程序的API的形状。

  6. 保存api.js文件。

大！您将Express服务器设置为通过Salesforce进行身份验证，使用SOQL查询来查询数据，并使用自定义端点来提供数据。下一步是更新会议管理应用程序的“用户界面”部分以使用此新端点。

使用新端点更新数据服务
  1. 展开src/client/modules/data/sessionService文件夹。
  2. 打开sessionService.js。
  3. URL用刚创建的服务器端点在第一行中更新变量。
  4. const URL = '/api/sessions';
  5. 保存sessionService.js。

构建和测试

现在，验证您的应用程序正在运行。

  1. 打开终端。
  2. 运行npm run watch。
    终端窗口显示服务器在端口3001上成功运行。
  3. 在http：// localhost：3001上打开浏览器 。该应用现在应该显示您的Trailhead游乐场中的会话列表。
  4. （可选）要查看来自您创建的端点的JSON响应，请在http：// localhost：3001 / api / sessions上打开浏览器 。

恭喜，您已经成功创建了一个Express服务器，该服务器使用通过身份验证的连接的Salesforce API来使用数据。在此跟踪中查看下一个项目， 将Lightning Web Components Open Source转换为Salesforce，在其中进行一些调整，然后将该应用程序部署在Salesforce平台上。您无需了解Salesforce即可执行下一个项目中的步骤-我们将指导您完成整个项目。

使用Lightning Web Components开放源代码访问Salesforce数据 – 导入样本数据

导入样本数据

现在您已经建立了数据模型，是时候输入数据了。您可以手动输入数据，也可以使用“数据导入向导”将其导入。

感谢Lightning Object Creator，用于会话的数据已被加载。使用数据导入向导将扬声器数据导入到Contact对象中。

  1. 下载 此CSV文件（右键单击并选择“另存为”），其中包含扬声器列表。
  2. 在您的Trailhead游乐场中，点击，然后 设置齿轮图标。 选择设置。
  3. Data Import Wizard在“快速查找”框中输入并选择“数据导入向导”。
    设置屏幕显示“数据导入向导”节点。
  4. 查看欢迎页面上提供的信息，然后单击启动向导！
    数据导入向导欢迎屏幕。
  5. 选择要导入的数据。
    • 在您要导入哪种数据下，选择客户和联系人。
    • 在您要做什么下选择添加新记录。
    • 在您的数据位于哪里下上传您下载的CSV文件。
    • 您可以通过以下方式添加数据文件：将CSV拖动到页面的上传区域，或者单击您正在使用的CSV类别，然后导航到并选择文件。
      数据导入向导显示选择用于导入新联系人的选项。
  6. 单击下一步。
  7. 在此屏幕中，您将CSV数据字段映射到Salesforce数据字段。数据导入向导尝试将尽可能多的数据字段映射到标准Salesforce数据字段。如果Salesforce无法自动映射字段，请手动执行。在这种情况下，Salesforce无法将Bio数据字段映射到任何Salesforce字段。
  8. 要手动映射该字段，请单击Bio行中的Map。
  9. Description在搜索框中输入并选择联系人：描述。点击Map确认选择。
    数据导入向导中的一个弹出窗口，显示了映射到Contact：Description字段的Bio字段。
  10. 单击下一步。
  11. 通过单击“开始导入”查看并开始导入。导入完成后，您会收到状态电子邮件。

接下来，在每个会话中添加发言人。

  1. 在App Launcher（应用启动器图标）中，找到并选择Sessions。
  2. 在会话列表视图中选择“所有记录”。
    会话列表视图，显示所有导入的会话记录。
  3. 单击会话名称以打开详细信息视图。
  4. 单击“相关”，然后从“扬声器”磁贴中单击“新建”。
    会议发言人相关列表。
  5. 在弹出窗口中，通过在“演讲者”字段中键入内容找到演讲者，然后从显示的建议中选择一位演讲者。（您可以在上一步中用于数据导入的CSV中找到发言人姓名。）
    New Session Speaker弹出窗口。
  6. 点击保存。
  7. 重复这些步骤，以在每个会话中添加至少一位发言人。

很好！接下来，您更新会议管理应用程序以获取您在Salesforce中创建的数据。

使用Lightning Web Components开放源代码访问Salesforce数据 – 设置您的Salesforce数据模型

设置您的Salesforce数据模型

在Salesforce中，数据存储在一个对象中。您可以将对象视为项目列表或电子表格。在这里，可以存储和维护按字段分组的信息，例如每个客户的名字和姓氏。

包含两列数据的Excel电子表格的详细信息。

有两种类型的对象：标准对象和自定义对象。标准对象是Salesforce附带的对象。常见的业务对象（例如客户，联系人，潜在客户和机会）都属于该组。 

自定义对象是您创建的用于存储特定于您的公司或行业的信息的对象。在此步骤中，您将创建两个自定义对象，并将新字段添加到标准对象。这三个对象共同构成了会议管理应用程序的数据模型。

创建会话对象

Salesforce提供了一个名为Lightning Object Creator的工具，只需单击几下即可将电子表格和CSV文件转换为应用程序。使用Lightning Object Creator，您可以将电子表格的列转换为字段，定义字段类型以及导入电子表格数据。

使用闪电对象创建器创建一个保存您的会话数据的对象。

  1. 下载 此CSV文件（右键单击并选择“另存为”），其中包含会话列表。
  2. 在您的Trailhead游乐场中，点击，然后 设置齿轮图标。 选择设置。这将在新选项卡中启动安装程序。
  3. 单击对象管理器。
  4. 单击创建，然后从电子表格中选择自定义对象。
    用于从电子表格创建新的自定义对象的导航步骤。
  5. Lightning Object Creator在新选项卡中打开。单击“使用Salesforce登录”。
    “电子表格”向导中的“自定义对象”，具有用于登录到Salesforce和“使用沙箱登录”的选项。
  6. 输入您的Trailhead Playground的用户名和密码，然后点击登录。
  7. 单击允许以允许Lightning Object Creator访问您的Salesforce实例。
  8. 在下一步中，您必须选择电子表格的来源。点击上传，然后选择您下载的文件。
    显示不同数据源的Lightning Object Creator向导。
  9. 从“记录名称”字段的下拉列表中选择“名称” 。记录名称出现在页面布局，相关列表，查找和搜索结果中。
  10. 选择“选择列表”作为“房间”的Salesforce字段类型。
    映射屏幕显示电子表格各列的Salesforce字段名称和数据类型。
  11. 单击下一步。
  12. 在对象属性屏幕中输入以下详细信息：
    • 标签： Session
    • 复数标签： Sessions
    • API名称： Session
      对象属性屏幕。
  13. 点击完成。
  14. Salesforce将创建对象及其字段，并将所有电子表格数据导入到新创建的对象中。
    该屏幕显示成功的对象创建和数据导入。
  15. 关闭选项卡。

您刚刚将数据从CSV文件转换为数据模型。接下来，更改现有标准对象上的数据模型。

向联系人对象添加新字段

联系人是Salesforce中用于存储有关人的信息的标准对象，它带有一组标准字段。对于此项目，您可以使用“联系人”对象存储会议发言人的详细信息。您需要再创建一个联系人字段，用于存储演讲者个人资料图片的URL。 

  1. 在安装程序中，单击对象管理器。
  2. 从显示的对象列表中，单击“联系人”。
  3. 单击“字段和关系”，然后单击“新建”，这将启动一个向导，可用于向对象添加新字段。
  4. 从显示的数据类型列表中选择URL，然后单击Next。
  5. 如下定义字段：
    • 栏位标签： Picture URL
    • 栏位名称： Picture_URL
  6. 保留所有其他内容，依次单击“下一步”，“下一步”和“保存”。

您更改了联系人数据模型，以便可以在其中存储有关会议发言人的信息。接下来，使用结点对象完成您的数据模型。

创建会话发言人连接对象

一个会话可以有一个或多个发言人，一个发言人可以有一个或多个会话。为了在数据模型中反映这种多对多关系，请创建另一个自定义对象，该对象用作标准Contact对象和自定义Session对象之间的结合。此连接对象使您可以对会话和发言人之间的多对多关系进行建模。 

  1. 在安装程序中，单击“对象管理器”。
  2. 单击创建，然后选择自定义对象。
  3. 在“自定义对象定义”页面上，使用这些详细信息创建Session Speaker对象。（接受此处未定义的属性的默认值。）
    • 标签： Session Speaker
    • 复数标签： Session Speakers
    • 对象名称： Session_Speaker
    • 记录名称： Session Speaker Number
    • 数据类型：自动编号
    • 显示格式： SESP-{00000}
    • 起始编号：1
  4. 点击保存。
  5. 单击字段和关系，然后单击新建。
  6. 选择主从关系，然后单击下一步。
  7. 在“相关于”中，选择“会话”，然后单击“下一步”。
  8. 定义字段：
    • 栏位标签： Session
    • 栏位名称： Session
  9. 将其他所有内容保持不变，然后单击“下一步”，“下一步”，“下一步”。
  10. 将“相关列表标签”设置为“发言人”，单击“保存并新建”。
  11. 选择主从关系，然后单击下一步。
  12. 在“相关于”中，选择“联系人”，然后单击“下一步”。
  13. 定义字段：
    • 栏位标签： Speaker
    • 栏位名称： Speaker
  14. 将其他所有内容保持不变，然后单击“下一步”，“下一步”，“下一步”。
  15. 将“相关列表标签”设置为“会话”，然后单击“保存”。

很好！在下一步中，将样本数据加载到数据模型中的每个对象中。

使用Lightning Web Components开放源代码访问Salesforce数据 创建Salesforce环境

学习目标

在此项目中，您将：

  • 设置您的Salesforce环境。
  • 在Salesforce中创建具有不同字段类型和关系的数据模型。
  • 从使用Lightning Web Components Open Source构建的会议管理应用程序中验证和获取Salesforce数据。

在你开始之前

在执行此动手项目中的步骤之前，请确保已完成使用Lightning Web Components Open Source构建您的第一个应用程序项目 。您在此处所做的工作基于该项目中的概念和所做的工作。 

准备开始这个项目了吗？如果您已经创建了Trailhead Playground，请立即滚动到该页面底部并单击Launch来打开它，然后按照“获取用户名和密码”下面的步骤进行操作，然后单击“验证” 完成此步骤。 

如果尚未创建Trailhead Playground，请继续并按照此步骤中的说明进行操作。

创建您的Trailhead游乐场

要创建新的Trailhead Playground，请滚动至该页面的底部，单击Launch旁边的向下箭头，然后选择Create a Trailhead Playground。创建Trailhead游乐场后，单击“启动” 以打开游乐场。

注意

要了解有关Trailhead游乐场的更多信息，请获取 Trailhead游乐场管理徽章。 

获取您的用户名和密码

大多数时候，您不需要知道Trailhead Playground的用户名和密码。但是，对于此项目，您需要了解它们，因为您将从外部应用程序登录到Salesforce，该外部应用程序是使用Lightning Web Components Open Source在上一个项目中构建的会议管理应用程序。

如果您在组织中看到一个标签为“获取登录凭据”的标签，那就太好了！请按照以下步骤操作。 

如果没有，请单击 应用启动器  以启动App Launcher，然后单击Playground Starter并按照步骤进行操作。如果您没有看到Playground Starter应用程序，请在Trailhead帮助中签出 查找Trailhead Playground的用户名和密码。

  1. 单击获取您的登录凭据选项卡，并记下您的用户名。 

您在Trailhead Tips应用程序中的用户名。

  1. 单击重置我的密码。这会将电子邮件发送到与您的用户名关联的地址。
  2. 单击电子邮件中的链接。
  3. 输入新密码，确认，然后单击更改密码。

获取您的安全令牌

每当您尝试从公司的受信任IP范围之外的IP地址访问Salesforce API时，都需要一个安全令牌。这是生成一个的方法。

  1. 在您的Trailhead游乐场中，单击您的个人资料图片，然后从菜单中单击“设置”。
    屏幕显示设置选项。
  2. 从可用选项列表中，单击“重置我的安全令牌”，然后在显示的页面上单击“重置安全令牌”按钮。
    屏幕上显示“重置安全令牌”页面，突出显示了“重置安全令牌”按钮。
  3. 您会收到一封包含安全令牌的电子邮件。记下此令牌。

您已经成功创建并设置了一个新的Salesforce环境，并收到了用于访问Salesforce API的安全令牌。接下来，在Salesforce中创建数据模型以存储会议管理应用程序所需的会话和发言人详细信息。