> ## Documentation Index
> Fetch the complete documentation index at: https://developers.hubspot.de/docs/llms.txt
> Use this file to discover all available pages before exploring further.

# Referenz für App-Objekte (BETA)

> Referenzinformationen zum Erstellen von App-Objekten, einschließlich Konfigurationsoptionen für Apps, App-Objekte und mehr.

<style>
  {`
    .github-link a div,
    .github-link a div p {
      display: inline;
      margin: 0;
      padding: 0;
    }
    .github-link {
      background-color: rgb(255, 255, 255);
      border-radius: 24px;
      box-shadow: rgba(0, 0, 0, 0.25) 0px 2px 4px 0px;
      padding: 5px;
      max-width: 247px;
      display: flex;
      align-items: center;
      margin-bottom: 20px;
    }
    .github-icon {
        display: inline;
        width: 24px;
        margin-right: 8px;
        flex-shrink: 0;
    }
    .table-key, .table-key div, .table-key p {
      margin: 0;
      font-size: 14px;
    }
    `}
</style>

<Info>
  Für diese Funktion ist allerdings die Genehmigung von HubSpot erforderlich. Wenn Sie gerne Zugriff auf App-Objekte beantragen oder mehr über die Funktionalität erfahren möchten, senden Sie bitte [dieses Formular](/apps/developer-platform/add-features/app-objects/overview) ein.
</Info>

Im Folgenden finden Sie Referenzinformationen für App-Funktionen der Entwicklerplattform mit App-Objekten, einschließlich Konfigurationsdateidefinitionen, Details zu Bereichen und mehr.

## Projektstruktur

* Alle App-Funktionen und -Komponenten müssen innerhalb des in der `hsproject.json`-Konfigurationsdatei angegebenen `src`-Verzeichnisses gespeichert werden.
* Alle App-Funktionen und -Komponenten müssen innerhalb des `app/`-Verzeichnisses gespeichert werden.
* App-Objektzuordnungen werden innerhalb des `app-object-associations/`-Verzeichnisses definiert.
* Webhook-Abonnements werden innerhalb des `webhooks/`-Verzeichnisses definiert.
* Benutzerdefinierte Workflow-Aktionen werden innerhalb des `workflow-actions/`-Verzeichnisses definiert.
* Alle Kartenfunktionen müssen im `cards/`-Verzeichnisses gespeichert werden.
* Für alle alle Komponenten- und Feature-Instanzen ist anzugeben, dass sie `*-hsmeta.json`-Dateien verwenden. Stellen Sie dem Dateinamen etwas Aussagekräftiges voran (z. B `my-app-hsmeta.json`). Diese Dateien müssen sich auf der Stammebene ihres jeweiligen Ordners befinden (z. B. `app/my-app-hsmeta.json`, `cards/my-card-hsmeta.json`).

Die folgende Beispielverzeichnisstruktur zeigt alle verfügbaren Funktionen.

```shell theme={null}
my-folder/
├── hsproject.json
├──src
│   ├── app/
│   │   └── app-hsmeta.json/
│   │   └── app-objects/
│   │     └── my-app-object-hsmeta.json
│   │   └── app-object-associations/
│   │     └── my-app-object-association-hsmeta.json
│   │   └── webhooks/
│   │     └── webhooks-hsmeta.json
│   │   └── cards/
│   │     └── my-app-card-hsmeta.json
│   │     └── MyCard.jsx
└──
```

<Card title="Beispiel auf GitHub anzeigen" href="https://github.com/robrown-hubspot/hubspot-project-components-ua-app-objects-beta/tree/main/projects/app-object-getting-started-template" icon="github" horizontal />

## App-Objekte

Um ein App-Objekt zu erstellen, fügen Sie ein `app-objects`-Komponentenverzeichnis zusammen mit einer Konfigurationsdatei in das Projekt ein.

```shell theme={null}
...
├──src
│   ├── app/
│   │   └── app-hsmeta.json
│   │   └── ...
│   │   └── app-objects/
│   │     └── my-app-object-hsmeta.json
└──
```

Nachfolgend finden Sie die Konfigurationsoptionen für `*-object-hsmeta.json`.

```json theme={null}
{
  "uid": "car-app-object",
  "type": "app-object",
  "config": {
    "name": "CAR",
    "appPrefix": "Vroom",
    "description": "An automobile in our warehouse.",
    "singularForm": "Car",
    "pluralForm": "Cars",
    "primaryDisplayLabelPropertyName": "model",
    "secondaryDisplayLabelPropertyNames": ["make"],
    "settings": {
      "hasRecordPage": true,
      "allowsUserCreatedRecords": true,
      "hasEngagements": true
    },
    "properties": [
      {
        "type": "string",
        "fieldType": "text",
        "name": "model",
        "label": "Model",
        "description": "The model of the car"
      },
      {
        "type": "enumeration",
        "fieldType": "select",
        "name": "make",
        "label": "Make",
        "description": "The manufacturer of the car.",
        "options": [
          {
            "label": "Ford",
            "value": "ford",
            "displayOrder": 0
          },
          {
            "label": "Toyota",
            "value": "toyota",
            "displayOrder": 1
          },
          {
            "label": "Chevrolet",
            "value": "chevrolet",
            "displayOrder": 2
          }
        ]
      }
    ]
  }
}
```

<Card title="Beispiel auf GitHub anzeigen" href="https://github.com/robrown-hubspot/hubspot-project-components-ua-app-objects-beta/blob/main/projects/app-object-getting-started-template/src/app/app-objects/car-object-hsmeta.json" icon="github" horizontal />

<p className="table-key">
  Mit <span style={{ color: 'red' }}>\*</span> markierte Felder sind Pflichtfelder.
</p>

| Feld                                                                      | Typ            | Beschreibung                                                                                                                                                                                                                                                                                                                                                                                                        |
| ------------------------------------------------------------------------- | -------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| `uid`<span style={{color:"red"}}>\*</span>                                | Zeichenfolge   | Eine eindeutige ID für das App-Objekt. Muss innerhalb des Projekts global eindeutig sein.                                                                                                                                                                                                                                                                                                                           |
| `type`<span style={{color:"red"}}>\*</span>                               | Zeichenfolge   | Der Typ der Komponente. Muss mit dem Namen des übergeordneten Ordners (`app-object`) übereinstimmen.                                                                                                                                                                                                                                                                                                                |
| `name`<span style={{color:"red"}}>\*</span>                               | Zeichenfolge   | Der Name Ihres App-Objekts. Verwenden Sie den genehmigten Namen, den Sie in Ihrer Bestätigung über die genehmigte App erhalten haben. Muss in Snake Case und Großbuchstaben (`MY_OBJECT_NAME`) geschrieben werden.                                                                                                                                                                                                  |
| `appPrefix`                                                               | Zeichenfolge   | Eine Zeichenfolge, die dem Singular- oder Pluralnamen des Objekts in der Benutzeroberfläche von HubSpot vorangestellt ist, um es von anderen Objekten zu unterscheiden. In diesem Beispiel würde das `appPrefix` von `Vroom` und die `singularForm` von `Car` dazu führen, dass „Vroom Car“ auf der Benutzeroberfläche angezeigt wird.                                                                              |
| `description`<span style={{color:"red"}}>\*</span>                        | String         | die Beschreibung des Objekts, das in HubSpot angezeigt wird.                                                                                                                                                                                                                                                                                                                                                        |
| `singularForm`<span style={{color:"red"}}>\*</span>                       | Zeichenfolge   | Die Singularform des Objektnamens.                                                                                                                                                                                                                                                                                                                                                                                  |
| `pluralForm`<span style={{color:"red"}}>\*</span>                         | Zeichenfolge   | Die Pluralform des Objektnamens.                                                                                                                                                                                                                                                                                                                                                                                    |
| `properties`<span style={{color:"red"}}>\*</span>                         | Array          | Eine Liste der für das Objekt definierten CRM-Eigenschaften. Eigenschaften werden mit denselben Feldern wie die [Eigenschaften-API](/api-reference/crm-properties-v3/guide) definiert. Den resultierenden Eigenschaften wird bei der Erstellung automatisch `a<appId>_` vorangestellt (z. B `a12345_make`). Sie sollten das Präfix nicht in die Konfigurationsdatei aufnehmen.                                      |
| `primaryDisplayLabelPropertyName`<span style={{color:"red"}}>\*</span>    | Zeichenfolge   | Der Name der Eigenschaft, die als [primäre Anzeige-Eigenschaft](https://knowledge.hubspot.com/object-settings/create-custom-objects#:~:text=object%27s%20singular%20name.-,Primary%20display%20property,-%3A%20the%20property%20used) verwendet werden soll. Der Wert muss mit dem in der `properties`-Liste angegebenen Namen übereinstimmen (d. h., er sollte nicht das generierte `a<appId>_`-Präfix enthalten). |
| `secondaryDisplayLabelPropertyNames`<span style={{color:"red"}}>\*</span> | Array          | Die Liste der Eigenschaften, die als [sekundäre Anzeigeeigenschaften](https://knowledge.hubspot.com/object-settings/create-custom-objects#:~:text=Secondary%20properties%3A) verwendet werden sollen. Der Wert muss mit dem in der `properties`-Liste angegebenen Namen übereinstimmen (d. h., er sollte nicht das generierte `a<appId>_`-Präfix enthalten).                                                        |
| `settings`<span style={{color:"red"}}>\*</span>                           | Objekt         | Ein Objekt, das Objekteinstellungen enthält.                                                                                                                                                                                                                                                                                                                                                                        |
| `hasRecordPage`<span style={{color:"red"}}>\*</span>                      | BoolescherWert | Bestimmt, ob Datensatzseiten für Instanzen dieses App-Objekts vorhanden sind. Bei Festlegung auf `false` ist die Indexseite weiterhin vorhanden, enthält jedoch keine Links zu den einzelnen Datensatzseiten.                                                                                                                                                                                                       |
| `allowsUserCreatedRecords`<span style={{color:"red"}}>\*</span>           | BoolescherWert | Bestimmt, ob Endbenutzer Datensätze mit dem Objekt erstellen können. Wenn diese Option auf `false` festgelegt ist, können Benutzer keine Datensätze in HubSpot erstellen.                                                                                                                                                                                                                                           |
| `hasEngagements`<span style={{color:"red"}}>\*</span>                     | BoolescherWert | Bestimmt, ob die App-Objektdatensätze Aktivitäten/Interaktionen unterstützen. Wenn diese Option auf `false` festgelegt ist, enthalten App-Datensatzseiten keine Interaktionfunktionen wie die Registerkarte „Aktivität“ oder aktivitätsbezogene Chronik-Filter.                                                                                                                                                     |

<Info>
  Der vollständig qualifizierte Name (Fully Qualified Name, FQN) für Ihr App-Objekt lautet `a<appId>_<objectName>`. Zum Beispiel: Wenn Ihr `appId` `16858319` und der Name des App-Objekts `CARS` lautet , dann wäre `a16858319_CARS`der FQN. Sie verwenden den FQN, wenn Sie Bereichswerte für Ihre App-Objekte festlegen.
</Info>

## App-Design

Um ein App-Objekt zu erstellen, fügen Sie eine `app-hsmeta.json`-Konfigurationsdatei in das `app`-Verzeichnis ein.

```shell theme={null}
...
├──src
│   ├── app/
│   │   └── app-hsmeta.json/
└──
```

Nachfolgend finden Sie die Konfigurationsoptionen für `app-hsmeta.json`.

<Accordion title="Änderungszusammenfassung">
  Beachten Sie die folgenden Änderungen für App-Kartenkonfigurationsdateien:

  * `uid`-, `type`- und `config`-Felder der obersten Ebene wurden hinzugefügt.
  * `extensions`-Feld wurde entfernt.
  * `distribution`-Feld wurde hinzugefügt.
</Accordion>

```json theme={null}
{
  "uid": "app_object_poc_app",
  "type": "app",
  "config": {
    "description": "An example to demonstrate how to build an app with an app object on developer projects.",
    "name": "my first app object app",
    "distribution": "marketplace",
    "auth": {
      "type": "oauth",
      "redirectUrls": ["http://localhost:3000/oauth-callback"],
      "requiredScopes": ["crm.objects.contacts.read", "crm.objects.contacts.write"],
      "optionalScopes": [],
      "conditionallyRequiredScopes": []
    },
    "permittedUrls": {
      "fetch": ["https://api.hubapi.com"],
      "iframe": [],
      "img": []
    },
    "support": {
      "supportEmail": "support@example.com",
      "documentationUrl": "https://example.com/docs",
      "supportUrl": "https://example.com/support",
      "supportPhone": "+18005555555"
    }
  }
}
```

<Card title="Beispiel auf GitHub anzeigen" href="https://github.com/robrown-hubspot/hubspot-project-components-ua-app-objects-beta/blob/main/projects/app-object-getting-started-template/src/app/app-hsmeta.json" icon="github" horizontal />

### \*-hsmeta.json-Felder für das App-Schema

<p className="table-key">
  Mit <span style={{ color: 'red' }}>\*</span> markierte Felder sind Pflichtfelder.
</p>

| Feld                                                | Typ          | Beschreibung                                                                                                                                                                                                                                                                                                        |
| --------------------------------------------------- | ------------ | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| `uid`<span style={{color:"red"}}>\*</span>          | Zeichenfolge | Eine interne eindeutige ID für die App. Sie muss innerhalb des Projekts global eindeutig sein und kann eine beliebige Zeichenfolge mit bis zu 64 Zeichen aufweisen. Zeichen können in Groß- oder Kleinbuchstaben geschrieben werden und Ziffern, Unterstriche (`_`), Bindestriche (`-`) und Punkte (`.`) enthalten. |
| `type`<span style={{color:"red"}}>\*</span>         | Zeichenfolge | Der Typ der Komponente. Muss mit dem Namen des übergeordneten Ordners (`app`) übereinstimmen.                                                                                                                                                                                                                       |
| `description`<span style={{color:"red"}}>\*</span>  | Zeichenfolge | Eine Beschreibung, was die App für den installierenden Benutzer tut. Kann eine beliebige Zeichenfolge mit bis zu 8.192 Zeichen sein.                                                                                                                                                                                |
| `name`<span style={{color:"red"}}>\*</span>         | Zeichenfolge | Dies ist der Name der App, der in HubSpot angezeigt wird. Kann eine beliebige Zeichenfolge mit bis zu 200 Zeichen sein. Darf nicht mit einem Leerzeichen beginnen oder enden.                                                                                                                                       |
| `distribution`<span style={{color:"red"}}>\*</span> | Zeichenfolge | Die Methode der App-Verteilung. Muss auf `marketplace` festgelegt sein, damit die App für ein App Marketplace-Listing berechtigt ist.                                                                                                                                                                               |
| `auth`<span style={{color:"red"}}>\*</span>         | Objekt       | Ein Objekt, das die Details der Authentifizierungsmethode der App enthält. Weitere Informationen finden Sie in der [Tabelle zur Authentifizierung](#auth-fields).                                                                                                                                                   |
| `permittedUrls`                                     | Objekt       | Ein Array, das die URLs enthält, die die App aufrufen darf. URLs müssen dem HTTPS-Schema folgen und eine [Autorität](https://developer.mozilla.org/en-US/docs/Learn_web_development/Howto/Web_mechanics/What_is_a_URL#authority) enthalten, ggf. gefolgt von einem optionalen Pfadpräfix.                           |
| `supportEmail`                                      | Zeichenfolge | Eine gültige E-Mail-Adresse, an die sich Benutzer wenden können, wenn sie Support benötigen.                                                                                                                                                                                                                        |
| `documentationUrl`                                  | Zeichenfolge | Die externe URL, zu der Benutzer navigieren können, um die Begleitdokumentation zu erhalten. Muss HTTPS verwenden.                                                                                                                                                                                                  |
| `supportUrl`                                        | Zeichenfolge | Die externe URL, zu der Benutzer navigieren können, um zusätzlichen Support zu erhalten. Muss HTTPS verwenden.                                                                                                                                                                                                      |
| `supportPhone`                                      | Zeichenfolge | Die Telefonnummer, die Benutzer kontaktieren können, wenn sie Support benötigen. Muss mit einem Pluszeichen (`+`) beginnen.                                                                                                                                                                                         |

### Authentifizierungsfelder

<p className="table-key">
  Mit <span style={{ color: 'red' }}>\*</span> markierte Felder sind Pflichtfelder.
</p>

| Feld                                                  | Typ          | Beschreibung                                                                                                                                                                                                                                                                                                                                                                                                              |
| ----------------------------------------------------- | ------------ | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| `type`<span style={{color:"red"}}>\*</span>           | Zeichenfolge | Die Art der Authentifizierung. Muss auf `oauth` festgelegt sein, damit die App die OAuth-Authentifizierung verwenden kann.                                                                                                                                                                                                                                                                                                |
| `redirectUrls`<span style={{color:"red"}}>\*</span>   | Array        | Eine Liste von URLs, zu denen der OAuth-Prozess zurückleiten darf. Jede App muss über mindestens eine derartige URL verfügen und HTTPS verwenden. Die einzige Ausnahme ist, dass für `http://localhost` das Testen erlaubt ist.                                                                                                                                                                                           |
| `requiredScopes`<span style={{color:"red"}}>\*</span> | Array        | Eine Liste der erforderlichen Bereiche Ihrer App. Jede App muss mindestens einen Bereich enthalten, wobei es erforderlich ist, dass der installierende Benutzer diese Bereiche zulässt, wenn die App erfolgreich installiert werden soll. [Erfahren Sie im Folgenden mehr über Bereiche](#scopes).                                                                                                                        |
| `optionalScopes`                                      | Array        | Eine Liste der optionalen Bereiche Ihrer App. Diese Bereiche können bei der Installation von der Autorisierung ausgeschlossen werden, wenn der Account oder der Benutzer, der die App installiert, nicht über entsprechende Berechtigungen verfügt. In diesem Fall wird der Bereich nicht in das resultierende Aktualisierungs- oder Zugriffs-Token aufgenommen. [Erfahren Sie im Folgenden mehr über Bereiche](#scopes). |
| `conditionallyRequiredScopes`                         | Array        | Eine Liste von Bereichen, die nur erforderlich sind, wenn sie im `scope`-Abfrageparameter der Installations-URL enthalten sind. [Erfahren Sie im Folgenden mehr über Bereiche](#scopes).                                                                                                                                                                                                                                  |

### Bereiche

Im `auth`-Feld einer App-Konfigurationsdatei können Sie drei [Arten von Bereichen](/apps/legacy-apps/public-apps/overview#scope-types) angeben: erforderliche Bereiche, bedingt erforderliche Bereiche und optionale Bereiche. Für diese Phase der Beta sollten Sie <u>nur</u> Ihre App-Objektbereiche als `conditionallyRequiredScopes`einschließen. Auf diese Weise können Sie Ihre neuen Funktionen für bestimmte Kunden isolieren, indem Sie die App-Objektbereiche in die Installations-URL aufnehmen.

App-Objektbereiche haben das folgende Format:

`crm.app.schemas.<appObjectFullyQualifiedName>.read`

Für ein App-Objekt mit dem FQN `a16858319_cars` wäre der `read`-Bereich beispielsweise:

`crm.app.schemas.a16858319_cars.read`.

Ihre App muss mindestens den oben genannten `read`-Bereich enthalten, damit Kunden auf das Objekt zugreifen können. Es wird empfohlen, alle App-Objektbereiche in Ihrer App zu berücksichtigen, wie im Folgenden angegeben.

```json theme={null}
"auth": {
      "type" : "oauth",
      "redirectUrls": ["http://localhost:3000/oauth-callback"],
      "requiredScopes": [
        "crm.objects.contacts.read",
        "crm.objects.contacts.write",
        "crm.app.objects.a12345_MY_APP_OBJECT.view",
        "crm.app.objects.a12345_MY_APP_OBJECT.create",
        "crm.app.objects.a12345_MY_APP_OBJECT.edit",
        "crm.app.schemas.a12345_MY_APP_OBJECT.read",
        "crm.app.objects.a12345_MY_APP_OBJECT.merge",
        "crm.app.objects.a12345_MY_APP_OBJECT.delete",
        "crm.app.schemas.a12345_MY_APP_OBJECT.properties.write"
      ],
      "optionalScopes": [],
      "conditionallyRequiredScopes": []
    },

```

Eine vollständige Liste der verfügbaren Bereiche finden Sie in der [Referenz zu Bereichen](/apps/legacy-apps/authentication/scopes).

## Definition von Webhooks-Komponenten

Um einen Satz von Webhook-Abonnements für Ihre App zu definieren, müssen Sie ein `webhooks`-Verzeichnis zusammen mit einer `*-hsmeta.json`-Konfigurationsdatei in das Projekt einschließen.

```shell theme={null}
├──src
│   ├── app/
│   │   └── app-hsmeta.json
│   │   └── ...
│   │   └── webhooks/
│   │     └── webhooks-hsmeta.json
└──
```

Nachfolgend finden Sie die verfügbaren Konfigurationsoptionen für die `*-hsmeta.json`-Datei.

```json theme={null}
{
  "uid": "webhooks",
  "type": "webhooks",
  "config": {
    "settings": {
      "targetUrl": "https://example.com/webhook",
      "maxConcurrentRequests": 10
    },
    "subscriptions": {
      "crmObjects": [
        {
          "subscriptionType": "object.creation",
          "objectType": "contact",
          "active": true
        },
        {
          "subscriptionType": "object.propertyChange",
          "objectType": "car_app_object",
          "propertyName": "carProperty",
          "active": true
        }
      ],
      "legacyCrmObjects": [
        {
          "subscriptionType": "contact.propertyChange",
          "propertyName": "lastname",
          "active": true
        },
        {
          "subscriptionType": "contact.deletion",
          "active": true
        }
      ],
      "hubEvents": [
        {
          "subscriptionType": "contact.privacyDeletion",
          "active": true
        }
      ]
    }
  }
}
```

### \*-hsmeta.json-Felder für Webhooks

<p className="table-key">
  Mit <span style={{ color: 'red' }}>\*</span> markierte Felder sind Pflichtfelder.
</p>

| Feld                                                 | Typ          | Beschreibung                                                                                                                                                                                                                                                                                 |
| ---------------------------------------------------- | ------------ | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| `uid`<span style={{color:"red"}}>\*</span>           | Zeichenfolge | Eine interne eindeutige ID für die Webhook-Komponente.                                                                                                                                                                                                                                       |
| `type`<span style={{color:"red"}}>\*</span>          | Zeichenfolge | Der Typ der Komponente, die in diesem Fall `webhooks` sein sollte.                                                                                                                                                                                                                           |
| `settings`<span style={{color:"red"}}>\*</span>      | Objekt       | Ein Objekt, das zwei Felder angibt: `targetUrl` ist die öffentlich verfügbare URL für HubSpot-Aufrufe, an die Event-Payloads geliefert werden, und `maxConcurrentRequests` stellt den oberen Schwellenwert von HTTP-Anfragen dar, die HubSpot in einem bestimmten Zeitraum vornimmt.         |
| `subscriptions`<span style={{color:"red"}}>\*</span> | Objekt       | Ein Objekt, das die Abonnementtypen angibt, die Ihre App abonnieren wird.                                                                                                                                                                                                                    |
| `crmObjects`                                         | Array        | Ein Array mit Definitionen für Event-Abonnements. Dies ist das aufzunehmende Standard-Array, das für alle Events im neuen Format (`object.*`) zu verwenden ist. Klassische Webhook-Abonnementtypen sollten aber je nach Event in `legacyCrmObjects`- und `hubEvents` -Arrays enthalten sein. |
| `legacyCrmObjects`                                   | Array        | Ein Arraymit klassischen Abonnementtypen wie `contact.creation` und `deal.deletion`.                                                                                                                                                                                                         |
| `hubEvents`                                          | Array        | Ein Array mit den klassischen Abonnementtypen `contact.privacyDeletion` und `conversation.*`                                                                                                                                                                                                 |

Für jedes `subscription` Objekt können die folgenden Felder angegeben werden, je nachdem, welcher Abonnementdefinitionstyp abonniert wird (d. h. `crmObjects`, `legacyCrmObjects`bzw. `hubEvents`) oder abhängig davon, ob Sie eine bestimmte Eigenschaftsänderung abonnieren (z  B `contact.propertyChange`).

| Feld               | Typ             | Beschreibung                                                                                                                                                                                                                                                     |
| ------------------ | --------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| `subscriptionType` | Zeichenfolge    | Der Typ des abonnierten Events.                                                                                                                                                                                                                                  |
| `objectType`       | Zeichenfolge    | Für Abonnements, die innerhalb des `crmObjects`-Arrays angegeben sind, gibt dies das CRM-Objekt an, das Ihre App abonniert. Um Änderungen an einem App-Objekt zu abonnieren, geben Sie den Namen Ihres App-Objekts in dieses Feld ein (z.  B. `car_app_object`). |
| `propertyName`     | Zeichenfolge    | Bei Abonnements von Eigenschaftenänderungen gibt dies an, durch welche Eigenschaft das Webhook-Event ausgelöst wird.                                                                                                                                             |
| `active`           | Boolescher Wert | Gibt an, ob Webhook-Events für dieses Abonnement ausgelöst werden.                                                                                                                                                                                               |

## Schema der App-Karte

Um eine App-Karte zu erstellen, die auf einer App-Objekt-Datensatzseite angezeigt wird, schließen Sie ein `cards`-Komponentenverzeichnis zusammen mit einer Konfigurationsdatei in das Projekt ein.

```shell theme={null}
├──src
│   ├── app/
│   │   └── app-hsmeta.json
│   │   └── ...
│   │   └── cards/
│   │     └── my-app-card-hsmeta.json
│   │     └── MyCard.jsx
└──
```

* Stellen Sie sicher, dass Sie `hs project upload` ausgeführt haben, nachdem Sie Ihre App-Objektkomponente und die zugehörigen Konfigurationsdateien erstellt haben.
* Fügen Sie in Ihrer `my-app-card-hsmeta.json`-Datei die UID Ihres App-Objekts zum `objectTypes`-Array hinzu (z. B . hier `"app_object_uid"`). Jedes der verfügbaren Felder in der `.json`-Datei ist in der folgenden [Tabelle](#app-card-*-hsmeta.json-fields) aufgeführt.

<Accordion title="Änderungszusammenfassung">
  Beachten Sie die folgenden Änderungen für App-Kartenkonfigurationsdateien:

  * `uid`-, `type`- und `config`-Felder der obersten Ebene wurden hinzugefügt.
  * Das `module`-Feld wurde in `entrypoint` umbenannt.
  * Das `title`-Feld wurde in `name` umbenannt.
  * Das `objectTypes`-Feld wurde vereinfacht, um ein Zeichenfolgen-Array zu akzeptieren.
</Accordion>

```json theme={null}
{
  "uid": "my-app-card",
  "type": "card",
  "config": {
    "name": "My app card",
    "description": "An example description of the card, which lives on contact records.",
    "previewImage": {
      "file": "./preview.png",
      "altText": "A short description of the preview image"
    },
    "entrypoint": "/app/cards/MyCard.jsx",
    "location": "crm.record.tab",
    "objectTypes": ["contacts", "app_object_uid"]
  }
}
```

* Nachdem Sie die Änderungen an Ihrer `example-card-hsmeta.json`-Datei gespeichert haben, führen Sie `hs project upload` aus.

Karten werden automatisch zur Standardansicht für App-Objekte hinzugefügt. Wenn die Karte nicht automatisch angezeigt wird, erfahren Sie hier, wie Sie [Karten zu CRM-Datensätzen hinzufügen](/apps/developer-platform/add-features/ui-extensibility/app-cards/create-an-app-card#view-the-card-in-hubspot).

<Card title="Beispiel auf GitHub anzeigen" href="https://github.com/robrown-hubspot/hubspot-project-components-ua-app-objects-beta/blob/main/projects/app-object-getting-started-template/src/app/app-hsmeta.json" icon="github" horizontal />

### Felder für \*-hsmeta.json-App-Karten

<p className="table-key">
  Mit <span style={{ color: 'red' }}>\*</span> markierte Felder sind Pflichtfelder.
</p>

| Feld                                               | Typ                                                            | Beschreibung                                                                                                                                                                                                                                                                                                                 |
| -------------------------------------------------- | -------------------------------------------------------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| `uid`<span style={{color:"red"}}>\*</span>         | Zeichenfolge                                                   | Die eindeutige ID der Karte. Sie kann eine beliebige Zeichenfolge sein, sollte aber die Karte sinnvoll identifizieren. HubSpot identifiziert die Karte anhand dieser ID, sodass Sie den Titel der Karte ändern können, ohne historische oder zustandsbehaftete Daten, wie z. B. die Position im CRM-Datensatz, zu entfernen. |
| `type`                                             | Zeichenfolge                                                   | Der Typ der Komponente, die in diesem Fall `card` sein sollte.                                                                                                                                                                                                                                                               |
| `config`                                           | Objekt                                                         | Ein Objekt, das Konfigurationsdetails enthält.                                                                                                                                                                                                                                                                               |
| `name`<span style={{color:"red"}}>\*</span>        | Zeichenfolge                                                   | Der Titel der Karte, wie auf der Benutzeroberfläche von HubSpot angezeigt.                                                                                                                                                                                                                                                   |
| `description`                                      | Zeichenfolge                                                   | Eine Beschreibung der Karte.                                                                                                                                                                                                                                                                                                 |
| `previewImage`                                     | Objekt:                                                        | Ein Objekt, das die `file`- und `altText`-Felder enthält. Das `file`-Feld ist der relative Pfad zum Vorschaubild. Gültige Dateierweiterungen sind png, jpeg, jpg oder gif. Die maximale Dateigröße beträgt 5.0 MB. Das `altText`-Feld ist eine Kurzbeschreibung des Bildes.                                                  |
| `entrypoint`<span style={{color:"red"}}>\*</span>  | Zeichenfolge                                                   | Der Dateipfad des Front-End-React-Codes der Karte.                                                                                                                                                                                                                                                                           |
| `location`<span style={{color:"red"}}>\*</span>    | `crm.record.tab` \| `crm.record.sidebar` \| `helpdesk.sidebar` | Wo die Karte auf der Benutzeroberfläche von HubSpot angezeigt wird. Erfahren Sie mehr über [den Speicherort der Erweiterung](/apps/developer-platform/add-features/ui-extensibility/app-cards/reference#extension-location).                                                                                                 |
| `objectTypes`<span style={{color:"red"}}>\*</span> | Array                                                          | Die Typen von CRM-Datensätzen, in denen die Karte angezeigt wird.                                                                                                                                                                                                                                                            |

## App-Objektzuordnungen

Um Verknüpfungen zwischen Ihrem App-Objekt und anderen CRM-Objekten zu ermöglichen, fügen Sie ein `app-object-associations`-Komponentenverzeichnis zusammen mit einer Konfigurationsdatei in das Projekt ein.

```shell theme={null}
├── src
│   ├── app/
│   │   └── app-hsmeta.json
│   │   └── ...
│   │   └── app-object-associations/
│   │     └── my-app-object-association-hsmeta.json
└──
```

Nachfolgend sind die verfügbaren Konfigurationsoptionen für App-Objekte (`*-association-hsmeta.json`) aufgeführt.

```json theme={null}
{
  "uid": "car_to_contact_association",
  "type": "app-object-association",
  "config": {
    "firstObjectType": "car-app-object",
    "secondObjectType": "CONTACT"
  }
}
```

### \*-Zuordnungs-hsmeta.json-Felder zur Zuordnung

<p className="table-key">
  Mit <span style={{ color: 'red' }}>\*</span> markierte Felder sind Pflichtfelder.
</p>

| Feld                                                    | Typ          | Beschreibung                                                                                                                                                                                                                                                                                                                                                         |
| ------------------------------------------------------- | ------------ | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| `uid`<span style={{color:"red"}}>\*</span>              | Zeichenfolge | Eine interne eindeutige ID für die App. Muss innerhalb des Projekts global eindeutig sein.                                                                                                                                                                                                                                                                           |
| `type`<span style={{color:"red"}}>\*</span>             | Zeichenfolge | Der Typ der Komponente. Muss mit dem Namen des übergeordneten Ordners (`app-object-association`) übereinstimmen.                                                                                                                                                                                                                                                     |
| `config`<span style={{color:"red"}}>\*</span>           | Objekt       | Ein Objekt, das die Konfiguration der Objekt-Zuordnung enthält.                                                                                                                                                                                                                                                                                                      |
| `firstObjectType`<span style={{color:"red"}}>\*</span>  | Zeichenfolge | Das erste Objekt in der Zuordnung. Kann entweder ein App-Objekt oder ein HubSpot-CRM-Objekt sein. App-Objekte werden mit der in ihrer Quelldatei angegebenen `uid` referenziert. Standardobjekte werden mit ihrem jeweiligen `fullyQualifiedName` referenziert. Die resultierende Zuordnung ist bidirektional, sodass die Reihenfolge der Feldwerte willkürlich ist. |
| `secondObjectType`<span style={{color:"red"}}>\*</span> | Zeichenfolge | Das zweite Objekt in der Zuordnung. Siehe `firstObjectType` für Details.                                                                                                                                                                                                                                                                                             |
