Salesforce - 单击按钮调用外部 API 并根据响应更新自定义字段

Question

所以我首先要说我是一名 C# .Net/Javascript 开发人员，拥有丰富的经验，但我对 Salesforce 的经验为零。今天之前从未见过它。因此，另一个团队要求我向 Contact 对象添加自定义按钮，单击该按钮时会调用外部 API 并使用响应更新 Contact 中的自定义字段。它被宣传为“只需编写一些在单击按钮时调用 API 的 Javascript，它实际上是嵌入到页面中的，15 分钟的工作...”。

按照看起来相当过时的文档，我最终进入了对象管理器，选择了联系人对象，然后我进入了按钮、链接和操作页面。我假设在此之前使用 Execute Javascript 行为完成，在 Lightning 版本中我被建议不要使用。因此，在大量谷歌搜索之后，我阅读了有关 APEX 类、Visualforce 组件、Lightning 组件、Salesforce REST API 等的信息。这不是 15 分钟的工作。

本质上，要求是将一个按钮(或操作，或..？)嵌入到此联系人页面中，以便当销售人员单击它时，它会收集一些联系人的详细信息并使用它们来形成 API 调用外部服务。数据将用于形成响应，然后必须读取(作为 JSON，然后解析)并写入联系人的自定义字段。

开发解决方案的最佳方法是什么？在 Apex 调试环境中，我将调用 API 和解析 JSON 响应的代码放在一起，我假设我需要将其包装在 Apex 类中，并使用调用此代码并返回响应的方法。我不确定的是如何从按钮调用它，并更新联系人中的字段。我是否需要通过 Apex 类方法执行所有这些操作？传递对联系人的引用，或者是否有另一个组件需要位于两者之间并执行此操作。我假设我需要使用 Salesforce API 来更新联系人是否正确？

感谢任何指点。

Answer 1

哦，伙计。这可能是一个 15 分钟的工作，但它绝对是“当你知道怎么做时很容易”或者有一些例子;)

1. 您的用户界面是什么，Classic 还是 Lightning？他们有计划很快迁移到 Lightning 吗？如果您发现“执行 JavaScript”技巧已经过时，我假设它是 Lightning。
2. 您关心按钮/操作的位置吗？带有所有其他按钮的右上角是否正常，或者您是否希望它可以拖放到页面中的几乎任何区域？
3. API 标注是否需要用户名、密码，也许还需要证书？它将确定您是只需要将端点列入防火墙的白名单(设置 -> 远程站点设置)还是需要更高级的东西(设置 -> 命名凭据)。
4. 您是否有 SFDX 命令行 (CLI)、VSCode/是否决定安装一些工具？ Lightning Web 组件是尖端的、最时尚的等，但您不能直接在浏览器中创建它们(至少现在还不能)，您需要工具。 Visualforce 还可以，但对于这个用例来说没有什么特别之处，Aura 组件编写起来有点笨拙 - 但您可以在 Developer Console 中完成这两项操作，而无需额外的工具。
5. 解析 JSON 响应 - 取决于它的复杂程度，您可以使用 JSON.deserializeUntyped() 手工制作解析器但生命太短暂了。这是一个很好的顶点代码生成器，类似于您从解析 WSDL 中得到的:https://json2apex.herokuapp.com/

我们会尝试做 Aura 组件的方式。这很丑陋，LWC 是 future ，但嘿，它会让你开始。

---

转到设置 -> 远程站点设置并使用 https://en.wikipedia.org/ 添加新条目

创建新的 Apex 类:

public with sharing class Stack63364119 {
    static final String endpoint = 'https://en.wikipedia.org/w/api.php?action=query&format=json&list=search&srsearch=';
    @AuraEnabled
    public static String doCallout(Id contactId){
        if(contactId == null){
            throw new MyException('Missing record id');
        }
        List<Contact> contacts = [SELECT MailingCountry FROM Contact WHERE Id = :contactId];
        if(contacts.isEmpty() || String.isBlank(contacts[0].MailingCountry)){
            throw new MyException('Could not find the contact');
        }
        Contact c = contacts[0];

        HttpRequest req = new HttpRequest();
        req.setEndpoint(endpoint + c.MailingCountry);
        req.setMethod('GET');

        HTTPResponse res = new Http().send(req);
        System.debug(res.getStatus());
        System.debug(res.getBody());
        // no special parsing, just chuck it into Description field
        // no error handling
        if(res.getStatusCode() == 200){
            c.Description = res.getBody().abbreviate(32000);
            update c;
        }
        return res.getBody();
    }
    public class MyException extends Exception{}
}

在开发者控制台中制作新的“闪电组件”(它将是 Aura，而不是 LWC)。您可以勾选关于“闪电般快速行动”的最后一个复选框。名称可以与类相同，但不是必须的。

对于组件(~ html 部分)粘贴这个

<!-- Loosely based on https://developer.salesforce.com/docs/atlas.en-us.lightning.meta/lightning/controllers_server_actions_call.htm -->
<aura:component controller="Stack63364119" implements="force:hasRecordId,force:lightningQuickAction" >
    <!-- in the name of all that is holy do not name the JS function same as the Apex class function, it'll give you very cryptic errors to debug -->
    <aura:handler name="init" value="{!this}" action="{!c.runCallout}"/> 
</aura:component>

对于 Controller (~ JavaScript)粘贴这个

({
    runCallout : function(cmp) {
        let action = cmp.get('c.doCallout');
        action.setParams({contactId : cmp.get('v.recordId')});
        action.setCallback(this, function(response){
            let state = response.getState();
            if (state === "SUCCESS") {
                alert('Saved OK: ' + response.getReturnValue());
                $A.get("e.force:closeQuickAction").fire(); // if you want to self-close
            } else if (state === "ERROR") {
                var errors = response.getError();
                if (errors) {
                    if (errors[0] && errors[0].message) {
                        console.log("Error message: " + errors[0].message);
                    }
                } else {
                    console.log("Unknown error");
                }
            }
        });
        $A.enqueueAction(action);
    }
})

最后转到对象管理器 -> 联系人 -> 按钮链接和操作。创建新的快速操作。并将其添加到页面布局中!

它应该可以帮助您入门。也许你会决定稍微拆分一下，Apex 只会执行标注，将结果返回到 UI，如果用户满意 - 更新联系人可以使用以下之一完成:https://developer.salesforce.com/docs/atlas.en-us.lightning.meta/lightning/data_service_save_record.htm .关注点分离等等(但用户会对 2 次点击感到满意)。

附言如果你调整它并且它死了但是很难看到任何 JavaScript 错误 - 这将是因为默认是在 Release模式下运行，SF 稍微重写你的源代码，优化，为像 IE11 这样的“浏览器”填充 polyfills......去设置 -> Debug模式并为您的用户启用。

附言在 sandbox/dev org 中，最好转到设置 -> session 设置 -> 并取消勾选“启用安全和持久的浏览器缓存以提高性能”。您的组件将永远是新鲜的，省去了按 Ctrl+R 的狂热。不要在产品中这样做 ;)