Erfassen Sie Ihre Fortschritte
Trailhead-Startseite
Trailhead-Startseite

Zugriff auf Salesforce-Daten in hybriden Anwendungen

Lernziele

Nachdem Sie diese Lektion abgeschlossen haben, sind Sie in der Lage, die folgenden Aufgaben auszuführen:

  • Verwenden der force.js-Bibliothek für den Zugriff auf die Salesforce REST-API ausgehend von einer hybriden Anwendung
  • Verwenden von Apex-Steuerfeldern für den Zugriff auf Salesforce-Daten ausgehend von einer hybriden Remote-Anwendung

Zugriff auf die Salesforce-API mit force.js

In unserer Erkundung der ContactExplorer-Anwendung wurde die Funktionalität der force.js-Bibliothek vorgestellt. Diese Bibliothek stellt eine umfangreiche Auswahl von Funktionen für die Durchführung von Vorgängen für Salesforce-Datensätze zur Verfügung. Neben dem Erstellen, Löschen, Aktualisieren und Einfügen werden SOQL-Abfragen, SOSL-Suchen, Metadatenbeschreibungen und Dateiverwaltung unterstützt.

Sie können force.js und die anderen Mobile SDK JavaScript-Bibliotheken von den SalesforceMobileSDK-Shared/libs- und SalesforceMobileSDK-Shared/dependencies-GitHub-Repositories herunterladen.

Obwohl sich Trail hauptsächlich mit hybriden lokalen Anwendungen befasst, d. h. eigenständige hybride Anwendungen auf dem mobilen Gerät, können Sie auch hybride Remote-Anwendungen erstellen. Eine hybride Remote-Anwendung lädt Visualforce-Seiten vom Salesforce-Server, formatiert sie um und zeigt sie auf mobilen Geräten an. Der Quellcode kann auf dem Server verbleiben oder zwischen Server und Gerät aufgeteilt werden.
Hinweis

Hinweis

Wenn Sie eine hybride Remote-Anwendung erstellen, fordert Sie das forcehybrid-Skript auf, eine Startseite anzugeben. Geben Sie den relativen Pfad zu Ihrer Visualforce-Zielseite mit /apex/ davor ein. Geben Sie beispielsweise /apex/BasicVFPage ein, wenn die Adresse der Zielseite https://<Instanz>.visual.force.com/apex/BasicVFPage ist.

Erste Schritte mit force.js und dem Mobile SDK

Zuerst müssen Sie die notwendigen Anwendungsressourcen in die Salesforce-Cloud hochladen.

  1. Erstellen Sie eine Archivdatei, z. B. eine ZIP-Datei, diecordova.js, force.js sowie alle anderen statischen Ressourcen enthält, die Ihr Projekt benötigt.
  2. Laden Sie die Archivdatei in Salesforce über Ihr Name | Anwendungs-Setup | Entwickeln | Statische Ressourcen hoch.

Ein Beispiel für eine einfache Visualforce-Seite

Der folgende Code zeigt eine einfache Visualforce-Seite, die fast vollständig mit Apex- und JavaScript-Code definiert wird. Die Logik folgt derselben Gliederung wie der JavaScript-Code der ContactsApp. Sie lädt force.js, initialisiert die Sitzung und übergibt dann eine SOQL-Abfrage an die asynchrone force.query()-Methode. Bei einer erfolgreichen Abfrage zeigt die App das erste abgerufene Name-Feld in einem HTML <span>-Tag an.
<apex:page docType="html-5.0" sidebar="false" showHeader="false" 
    contentType="text/html" applyHtmlTag="false" applyBodyTag="false" 
    standardStylesheets="false" cache="true">

<html>
    <head>
      <meta charset="utf-8"></meta>
      <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no"></meta>
      <apex:includeScript value="{!URLFOR($Resource.Easy, 'cordova/cordova.js')}"  />
      <apex:includeScript value="{!URLFOR($Resource.Easy, 'libs/force.js')}"  />

      <script>
(function() {
    /* Do login */
    force.login(
        function() {
            console.log("Auth succeeded"); 
            showUsersList();
        },
        function(error) {
            console.log("Auth failed: " + error); 
        }
    );

    /* This method will render a list of users from current salesforce org */
    var showUsersList = function() {

        fetchRecords(function(data) {
            var users = data.records;

            var listItemsHtml = '';
            for (var i=0; i < users.length; i++) {
                listItemsHtml += ('<li class="table-view-cell"><div class="media-body">' + 
                    users[i].Name + '</div></li>');
            }

            document.querySelector('#users').innerHTML = listItemsHtml;
        })
    }

    /* This method will fetch a list of user records from salesforce. 
    Just change the soql query to fetch another sobject. */
    var fetchRecords = function (successHandler) {
        var soql = 'SELECT Id, Name FROM User LIMIT 10';
        force.query(soql, successHandler, function(error) {
            alert('Failed to fetch users: ' + error);
        });
    };

})();
      </script>
    </head>
    <body>

      <header>
         <h1>Hello, Visualforce!</h1>
      </header>

        <!-- Placeholder to add users list -->

      <ul id="users">
      </ul>

      <p>Welcome to Mobile SDK.</p>
    </body>
</html>
</apex:page>

Verwenden von Apex-Steuerfeldern in einer hybriden Remote-Anwendung

Bei hybriden Remote-Anwendungen erfolgt der Zugriff auf Salesforce-Daten normalerweise über eine Visualforce-Seiten und das zugehörige Apex-Steuerfeld. Wenn Ihre Visualforce-Seite JavaScript-Code verwendet, kann der betreffende Code Daten mit dem serverseitigen Apex-Steuerfeld verwenden und bearbeiten.

Apex unterstützt die beiden folgenden Möglichkeiten, um Apex-Steuerfeldmethoden in JavaScript aufzurufen: Beide Verfahren verwenden eine AJAX-Anforderung, um Apex-Steuerfeldmethoden direkt in JavaScript aufzurufen. Der JavaScript-Code muss in einer Visualforce-Seite gehostet werden.
Im Vergleich mit apex:actionFunction bietet JavaScript Remoting mehrere Vorteile.
  • Dieses Verfahren bietet größere Flexibilität und bessere Leistung als apex:actionFunction.
  • Es unterstützt Parameter und Rückgabetypen in der Apex-Steuerfeldmethode mit automatischer Zuordnung zwischen Apex- und JavaScript-Typen.
  • Es wird ein asynchrones Verarbeitungsmodell mit Rückmeldungen verwendet.
  • Im Gegensatz zu apex:actionFunction enthält die AJAX-Anforderung keinen Ansichtsstatus für die Visualforce-Seite. Dies führt zu einem schnelleren Hin- und Rückweg.
Im Vergleich mit apex:actionFunction müssen Sie bei JavaScript Remoting jedoch mehr Code erstellen.

Im folgenden Beispiel wird JavaScript-Code in ein <script>-Tag in der Visualforce-Seite eingefügt. Dieser Code ruft die invokeAction()-Methode für das Visualforce-Remoting-Verwaltungsobjekt auf. An invokeAction() werden die erforderlichen Metadaten zum Aufrufen einer Funktion namens getItemId() für das Apex-Steuerfeldobjekt objName übergeben. Da invokeAction() asynchron ausgeführt wird, definiert der Code auch eine Rückmeldungsfunktion für die Verarbeitung des Werts, der von getItemId() zurückgegeben wird. Im Apex-Steuerfeld macht die @RemoteAction-Anmerkung die getItemId()-Funktion für externen JavaScript-Code verfügbar.

//Visualforce page code
<script type="text/javascript">
     Visualforce.remoting.Manager.invokeAction(
        '{!$RemoteAction.MyController.getItemId}',
        objName,
        function(result, event){
            //process response here
        },
        {escape: true}
    );
<script>

//Apex Controller code

@RemoteAction
global static String getItemId(String objectName) { ... }

In der getItemId()-Methode können Sie beispielsweise eine Salesforce-API aufrufen und den Rückgabewert in JavaScript erfassen.