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

# Übersicht zur JWT-Generierung

> Erzeugen Sie eine URL zur Verknüpfung sozialer Netzwerke für ein User Profile.

export const PlansAvailable = ({plans = [], maxPackRequired}) => {
  let displayPlans = plans;
  if (plans && plans.length === 1) {
    const lowerCasePlan = plans[0].toLowerCase();
    if (lowerCasePlan === "business") {
      displayPlans = ["Launch", "Business", "Enterprise"];
    } else if (lowerCasePlan === "premium") {
      displayPlans = ["Premium", "Launch", "Business", "Enterprise"];
    }
  }
  return <Note>
Available on {displayPlans.length === 1 ? "the " : ""}
{displayPlans.join(", ").replace(/\b\w/g, l => l.toUpperCase())}{" "}
{displayPlans.length > 1 ? "plans" : "plan"}.

{maxPackRequired && <span onClick={() => window.open('https://www.ayrshare.com/docs/additional/maxpack', '_self')} className="flex items-center mt-2 cursor-pointer">
 <span className="px-1.5 py-0.5 rounded text-sm" style={{
    backgroundColor: '#C264B6',
    color: 'white',
    fontSize: '12px'
  }}>
   Max Pack required
 </span>
</span>}
</Note>;
};

<PlansAvailable plans={["business"]} maxPackRequired={false} />

Der [generateJWT-Endpunkt](/apis/profiles/generate-jwt) erzeugt eine URL zur Verknüpfung sozialer Netzwerke für ein einzelnes User Profile.
Weitere Details finden Sie in der [API-Integration für Business- und Launch-Plan](/multiple-users/api-integration-business).

## Profile wechseln

Um zwischen verschiedenen Profilsitzungen zu wechseln (z. B. beim Testen mit mehreren Profilen), müssen Sie zunächst das aktuelle Profil abmelden. Anweisungen zum ordnungsgemäßen Handhaben des Profilwechsels finden Sie unter [Automatische Abmeldung einer Profilsitzung](/multiple-users/api-integration-business#automatic-logout-of-a-profile-session).

## Private Key und Profile Key

### Wo Sie den Private Key erhalten

Die Datei mit dem Private Key (private.key) sowie eine beispielhafte Postman-JSON-Datei sind Teil Ihres [Integrationspakets](/multiple-users/api-integration-business#integration-package), das Sie während des Onboardings erhalten.
Das Integrationspaket kann auch im Ayrshare-Entwickler-Dashboard auf der API-Seite -> Integration Package abgerufen werden.

### Verwendung des Private Keys

Wir empfehlen, den Private Key aus der Datei private.key zu lesen und ihn als String im Feld `privateKey` zu senden, wodurch alle Zeichen einschließlich Zeilenumbrüche erhalten bleiben.
Der Private Key muss präzise sein, d. h. alle Zeichen einschließlich Zeilenumbrüche müssen erhalten bleiben.
Wenn Sie den Schlüssel in Ihren Code einfügen, müssen Sie möglicherweise Zeilenumbrüche manuell durch das Zeichen `\n` ersetzen oder den String URL-kodieren.

Das direkte Einfügen des Schlüssels in den Code führt häufig zu Problemen.

## Ein JSON Web Token erzeugen

1-minütiges Video, das die Erzeugung eines JSON Web Tokens (JWT) erklärt:

<div class="video-container">
  <iframe width="380" height="200" src="https://www.youtube.com/embed/JI232HBWHWc" title="Generate a JSON Web Token" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" />
</div>

Die JWT-URL ist **5 Minuten** gültig. Nach 5 Minuten müssen Sie eine neue JWT-URL erzeugen.
Weitere Optionen finden Sie unter [Max Pack `expiresIn`](/apis/profiles/generate-jwt-overview#jwt-expires-in).

## Die JWT-URL öffnen

Öffnen Sie die JWT-URL in einem neuen Browser-Tab, einem neuen Browserfenster oder in einem View Controller unter iOS.

Sie können das [Schließen oder Umleiten](/multiple-users/api-integration-business#opening-and-closing-the-social-linking-url) des neuen Fensters bzw. Tabs steuern.

<Note>
  Die sozialen Netzwerke erlauben es nicht, die URL in einem iFrame zu öffnen oder die freigegebene Partner-
  Ursprungsdomain profile.ayrshare.com zu verschleiern.
</Note>

## Die JWT-URL verifizieren

Der `generateJWT`-Endpunkt validiert die zurückgegebene JWT-URL standardmäßig nicht.
Wenn beispielsweise ein fehlerhafter Private Key an `generateJWT` übergeben wird, wird trotzdem eine URL zurückgegeben, die dann zu einem 401-Fehler führt.

Sie können die zurückgegebene JWT-URL verifizieren, indem Sie `verify: true` in den Body-Parametern von `generateJWT` einbeziehen. Wenn die JWT-URL nicht validiert werden kann, wird ein Fehler zurückgegeben. Wurde beispielsweise ein Zeichen aus dem Private Key entfernt, wird Folgendes zurückgegeben:

```json JWT Error theme={"system"}
{
  "action": "JWT",
  "status": "error",
  "code": 189,
  "message": "Error generating JWT. Check the sent parameters, such as the privateKey has no extra tabs, spaces, or newlines. Also the entire private.key file including -----BEGIN RSA PRIVATE KEY----- and -----END RSA PRIVATE KEY-----. Error: secretOrPrivateKey must be an asymmetric key when using RS256"
}
```

Wir empfehlen, `verify: true` nur in einer Nicht-Produktionsumgebung zu verwenden, da die Validierung zusätzliche Verarbeitungszeit benötigt.

## Testen in Postman

Es wird **empfohlen**, die Erstellung der JWT-URL zunächst in [Postman](/testing/postman) zu testen.
Im Integrationspaket, das Sie auf der API-Key-Seite des Primary Profiles im Dashboard finden, ist eine beispielhafte Postman-Konfigurations-JSON-Datei enthalten, die alles enthält, was Sie zur Überprüfung der JWT-URL-Erstellung benötigen.
Importieren Sie einfach die Konfigurationsdatei in Postman, füllen Sie Ihren Profile Key (zu finden im Ayrshare-Entwickler-Dashboard durch Wechseln zum Profil, das Sie testen möchten) im *Body*-Feld `profileKey` ein und klicken Sie auf die blaue Schaltfläche *Send*.
Alle anderen erforderlichen Felder sind bereits ausgefüllt.

Sie können den [Code auch aus Postman generieren](/testing/postman#auto-generate-api-code-with-postman) oder die Schlüsseldatei aus einem Verzeichnis oder einer Datenbank lesen.

## Instagram-Verknüpfungsmethode

Instagram-Konten können auf [zwei Arten](/dashboard/connect-social-accounts/instagram) verknüpft werden: direkt mit **Instagram Login** oder über eine **verbundene Facebook-Seite**.
Welcher Ablauf startet, wenn ein Nutzer auf der Verknüpfungsseite auf die Instagram-Schaltfläche klickt, wird normalerweise durch die kontoweite Einstellung [Instagram Login](/multiple-users/manage-user-profiles#instagram-login) im Dashboard gesteuert.

Mit dem Body-Parameter `instagramLinkMethod` des [generateJWT-Endpunkts](/apis/profiles/generate-jwt) können Sie diese Einstellung für eine einzelne Verknüpfungs-URL überschreiben:

| Wert        | Instagram-Verknüpfungsablauf                                 |
| ----------- | ------------------------------------------------------------ |
| `instagram` | Direktes Instagram Login. Keine Facebook-Seite erforderlich. |
| `facebook`  | Verknüpfung über eine verbundene Facebook-Seite.             |

Wenn Ihr Kontostandard beispielsweise die Verknüpfung über die Facebook-Seite ist, erzwingt das folgende Beispiel das direkte Instagram Login nur für diese Verknüpfungssitzung:

```json Instagram Link Method theme={"system"}
{
  "instagramLinkMethod": "instagram"
}
```

Die generierte JWT-URL enthält die Überschreibung, und ein Klick auf die Instagram-Schaltfläche auf der Verknüpfungsseite startet den angeforderten Ablauf für die Dauer dieser Sitzung – einschließlich der Autorisierungsweiterleitung von Instagram/Facebook.

Einige Punkte, die Sie beachten sollten:

* Die Überschreibung gilt nur für die Verknüpfungsseite, die über die zurückgegebene URL geöffnet wird. Sie ändert nicht Ihre kontoweite Instagram-Login-Einstellung und beeinflusst keine anderen Verknüpfungssitzungen.
* Wenn `instagramLinkMethod` weggelassen wird, verwendet die Verknüpfungsseite Ihre kontoweite Einstellung wie zuvor.
* Wird ein ungültiger Wert gesendet, wird ein `400`-Fehler zurückgegeben, der die gültigen Werte (`instagram`, `facebook`) auflistet.
* Prüfen Sie die [Funktionsunterschiede](/multiple-users/manage-user-profiles#direct-instagram-login-vs-facebook-page-authentication) zwischen den beiden Abläufen, bevor Sie eine Überschreibung wählen – einige Instagram-Funktionen wie Hashtag-Suche und Kollaborationen sind nur mit der Facebook-Seiten-Authentifizierung verfügbar.

## JWT-Gültigkeitsdauer (Expires In)

<PlansAvailable plans={["business"]} maxPackRequired />

Wenn Sie eine längere JWT-Gültigkeit als die standardmäßigen 5 Minuten wünschen, fügen Sie das Feld `expiresIn` hinzu.

Senden Sie beispielsweise das folgende JSON, um die JWT-URL für 30 Minuten gültig zu machen:

```json JWT Expires In theme={"system"}
{
  "expiresIn": 30
}
```

Dadurch können Sie den Link Ihren Nutzern [per E-Mail zusenden](/apis/profiles/generate-jwt-overview#connect-accounts-email), anstatt dass diese Ihre App oder Plattform aufsuchen müssen.
Ein häufiger Anwendungsfall ist, wenn Ihr Nutzer ein Social-Media-Konto neu verknüpfen muss. Sie können ihm den JWT-Link per E-Mail zusenden, damit er das Social-Media-Konto direkt neu verknüpfen kann, ohne zu Ihrer Plattform navigieren zu müssen.

<Warning>
  Prüfen Sie unbedingt mit Ihrem Sicherheitsteam, wie lange Ihr Unternehmen das JWT gültig halten möchte.
  Längere Gültigkeitszeiten schaffen zusätzliche Risiken, dass unbefugte Personen auf den Link zugreifen.
</Warning>

## Integrationen

### Bubble.io JWT

Wenn Sie Bubble-Nutzer sind, lesen Sie bitte *Generate JWT Token* im Abschnitt Bubble.io für Anweisungen:

<Card title="Bubble Generate JWT" icon="link" href="/packages-guides/bubble#generate-jwt-token-in-bubble" horizontal />

### Mobile JWT

Die folgenden [Mobile-Codebeispiele](/apis/profiles/generate-jwt-overview#mobile-code-examples) für Swift, Flutter und React Native zeigen, wie die Social-Verknüpfungsseite auf einem iOS-Gerät gestartet wird.
Ersetzen Sie die String-Variable `jwtURL` durch die Rückgabe des [/generateJWT-Endpunkts](/apis/profiles/generate-jwt).

#### Swift (iOS)

Verwenden Sie in Swift einen `UIViewController` und `SFSafariViewControllerDelegate`.
Die Verwendung einer `WebView` wird nicht empfohlen, da einige soziale Netzwerke wie Facebook und Google die Authentifizierung blockieren.

#### Flutter (Dart)

In Flutter (Dart) gibt es keine direkte Entsprechung zu einem `UIViewController` oder dem `SFSafariViewController`.
Sie können jedoch eine ähnliche Funktionalität erzielen, indem Sie das Paket `url_launcher` verwenden, um Web-URLs zu öffnen.

#### React Native

Auch React Native hat keine direkte Entsprechung zu `SFSafariViewController`, aber Sie können ein ähnliches Ergebnis mit der `WebBrowser`-API von `expo-web-browser` erzielen, die eine URL in einem modalen Browserfenster öffnet, das Cookies mit dem Systembrowser teilt. Alternativ können Sie die eingebaute React-Native-Funktion `Linking` verwenden, um Safari zu öffnen: `await Linking.canOpenURL(jwtURL);`

#### Mobile-Codebeispiele

<CodeGroup>
  ```swift Swift theme={"system"}
  import UIKit
  import SafariServices

  class ViewController: UIViewController, SFSafariViewControllerDelegate {
      
      var jwtURL = "https://profile.ayrshare.com?domain=acme&jwt=eyJhbGciOiJ"

      override func viewDidLoad() {
          super.viewDidLoad()
          setupButton()
      }
      
      func setupButton() {
          let button = UIButton(type: .system)
          button.frame = CGRect(x: (view.bounds.width - 200) / 2, y: (view.bounds.height - 50) / 2, width: 200, height: 50)
          button.setTitle("Open URL", for: .normal)
          button.addTarget(self, action: #selector(buttonTapped), for: .touchUpInside)
          view.addSubview(button)
      }

      @objc func buttonTapped() {
          openURLInInAppBrowser()
      }

      func openURLInInAppBrowser() {
          if let url = URL(string: jwtURL) {
              let safariVC = SFSafariViewController(url: url)
              safariVC.delegate = self
              present(safariVC, animated: true, completion: nil)
          }
      }

      // Optional: If you want to handle when the in-app browser is closed
      func safariViewControllerDidFinish(_ controller: SFSafariViewController) {
          controller.dismiss(animated: true, completion: nil)
      }
  }
  ```

  ```dart Flutter theme={"system"}
  /** yaml dependencies
    dependencies:
      flutter:
        sdk: flutter
      url_launcher: ^6.2.1
  */

  import 'package:flutter/material.dart';
  import 'package:url_launcher/url_launcher.dart';

  void main() {
    runApp(MyApp());
  }

  class MyApp extends StatelessWidget {
    @override
    Widget build(BuildContext context) {
      return MaterialApp(
        title: 'URL Launcher Example',
        theme: ThemeData(
          primarySwatch: Colors.blue,
        ),
        home: MyHomePage(),
      );
    }
  }

  class MyHomePage extends StatelessWidget {
    final String jwtURL = "https://profile.ayrshare.com?domain=acme&jwt=eyJhbGciOiJ";

    @override
    Widget build(BuildContext context) {
      return Scaffold(
        appBar: AppBar(
          title: Text('URL Launcher Example'),
        ),
        body: Center(
          child: ElevatedButton(
            onPressed: () {
              openURLInBrowser(context);
            },
            child: Text('Open URL'),
          ),
        ),
      );
    }

    void openURLInBrowser(BuildContext context) async {
      if (await canLaunch(jwtURL)) {
        await launch(jwtURL);
      } else {
        ScaffoldMessenger.of(context).showSnackBar(
          SnackBar(
            content: Text('Could not launch $jwtURL'),
          ),
        );
      }
    }
  }
  ```

  ```jsx React Native theme={"system"}
  /**
  • Using the API provided by expo-web-browser,
  • which opens a URL in a modal browser window that shares cookies
  • with the system browser.

  • Learn more about expo: https://reactnative.dev/docs/environment-setup?guide=quickstart
  • and running the following command:
  • expo install expo-web-browser
  */

  import React from 'react';
  import { StyleSheet, Button, View } from 'react-native';
  import * as WebBrowser from 'expo-web-browser';

  export default function App() {
    const jwtURL = 'https://profile.ayrshare.com?domain=acme&jwt=eyJhbGciOiJ';

    const openURLInBrowser = async () => {
      try {
        await WebBrowser.openBrowserAsync(jwtURL);
        // Optional: WebBrowser.openBrowserAsync returns a promise that resolves with an object containing
        // 'type' that can be 'cancelled' or 'dismissed'. You can use this to handle when the browser is closed.
      } catch (error) {
        console.error(error);
      }
    };

    return (
      <View style={styles.container}>
        <Button title="Open URL" onPress={openURLInBrowser} />
      </View>
    );
  }

  const styles = StyleSheet.create({
    container: {
      flex: 1,
      justifyContent: 'center',
      alignItems: 'center',
    },
  });
  ```
</CodeGroup>

## Connect-Accounts-E-Mail

<max_pack />

Zusammen mit der Option für eine längere Gültigkeitsdauer können Sie Ayrshare Ihren Nutzern auch automatisch per E-Mail einen Link zur Social-Verknüpfungsseite zusenden lassen.

### Connect Accounts JSON

Das folgende JSON sendet beispielsweise eine E-Mail an `john@user.com` mit dem Firmennamen ACME, der Kontakt-E-Mail `support@mycompany.com` und Links zu den Nutzungsbedingungen und der Datenschutzrichtlinie:

```json Example Contact Email Request theme={"system"}
/**
  All fields are in the email object required.
  Missing fields will cause the email to fail.
*/
{
  "email": {
    "to": "john@user.com",
    "contactEmail": "support@mycompany.com",
    "company": "ACME",
    "termsUrl": "https://www.ayrshare.com/terms",
    "privacyUrl": "https://www.ayrshare.com/privacy",
    "expiresIn": 60
  }
}
```

Die Antwort enthält Folgendes, wenn E-Mail und Gültigkeitsdauer gesetzt wurden:

```json Example Contact Email Response theme={"system"}
{
  "emailSent": true,
  "expiresIn": "30m"
}
```

### Beispiel für eine JWT-Connect-Accounts-E-Mail

Hier ein Beispiel einer E-Mail mit dem Connect-Account-Link, der die Social-Verknüpfungsseite öffnet:

<img src="https://mintcdn.com/ayrshare-docs/Nmrhj2Gh7WSf62Bh/images/apis/profiles/jwt-email.webp?fit=max&auto=format&n=Nmrhj2Gh7WSf62Bh&q=85&s=fbe4ee86ca59c26a5bd5b289fda96b8b" alt="JWT Email" width="563" class="center" data-path="images/apis/profiles/jwt-email.webp" />

Die E-Mail wird von der folgenden Adresse gesendet:

`Social Connect Hub <connect@socialconnecthub.com>`
