# Connect の埋め込みコンポーネントを導入する

# Connect の埋め込みコンポーネントを導入する

> アカウントセッションの作成には、Stripe ベータ SDK を使用できます。
> 
> - [Ruby](https://github.com/stripe/stripe-ruby) `>=15.4.0`
- [Python](https://github.com/stripe/stripe-python) `>=12.4.0`
- [PHP](https://github.com/stripe/stripe-php) `>=17.5.0`
- [Node](https://github.com/stripe/stripe-node) `>=18.4.0`
- [.NET](https://github.com/stripe/stripe-dotnet) `>=48.4.0`
- [Java](https://github.com/stripe/stripe-java) `>=29.4.0`
- [Go](https://github.com/stripe/stripe-go) `>=82.4.0`

[Connect の埋め込みコンポーネント](https://docs.stripe.com/connect/get-started-connect-embedded-components.md)を使用して、システム全体を構築します。Connect の埋め込みコンポーネントを使用して、連結アカウントのダッシュボード機能をウェブサイトに追加します。これらのライブラリと、サポートされている API を利用することで、コードをほとんど記述することなく運用を開始して、ユーザーがダッシュボードから Stripe プロダクトに直接アクセスできるようになります。

  // This is a placeholder - it should be replaced with your secret API key.
  // Sign in to see your own test API key embedded in code samples.
  // Don’t submit any personally identifiable information in requests made with this key.
  'sk_INSERT_YOUR_SECRET_KEY',
app.post('/account_session', async (req, res) => {
  try {
    const accountSession = await stripe.accountSessions.create({
      account: "{{CONNECTED_ACCOUNT_ID}}",
      components: {
        payments: {
          enabled: true,
          features: {
            refund_management: true,
            dispute_management: true,
            capture_payments: true,
          }
        }
      }
    });

    res.json({
      client_secret: accountSession.client_secret,
    });
  } catch (error) {
    console.error('An error occurred when calling the Stripe API to create an account session', error);
    res.status(500);
    res.send({error: error.message});
  }
});
\# This is a placeholder - it should be replaced with your API key.
# Sign in to see your own test API key embedded in code samples.
# Don't put any keys in code. We recommend using a restricted API key with access only to the account sessions resource. See https://docs.stripe.com/keys-best-practices
client = Stripe::StripeClient.new('sk_INSERT_YOUR_SECRET_KEY')
post '/account_session' do
  content_type 'application/json'

  begin
    account_session = client.v1.account_sessions.create({
      account: "{{CONNECTED_ACCOUNT_ID}}",
      components: {
        payments: {
          enabled: true,
          features: {
            refund_management: true,
            dispute_management: true,
            capture_payments: true
          }
        }
      }
    })

    {
      client_secret: account_session[:client_secret]
    }.to_json
  rescue => error
    puts "An error occurred when calling the Stripe API to create an account session: #{error.message}";
    return [500, { error: error.message }.to_json]
  end
end
\# This is a placeholder - it should be replaced with your API key
# Sign in to see your own test API key embedded in code samples
# Don't put any keys in code. We recommend using a restricted API key with access only to the account sessions resource. See https://docs.stripe.com/keys-best-practices
client = stripe.StripeClient('sk_INSERT_YOUR_SECRET_KEY')
@app.route('/account_session', methods=['POST'])
def create_account_session():
    try:
        account_session = client.v1.account_sessions.create(params={
          'account': "{{CONNECTED_ACCOUNT_ID}}",
          'components': {
            "payments": {
              "enabled": True,
              "features": {
                "refund_management": True,
                "dispute_management": True,
                "capture_payments": True
              }
            },
          },
        })

        return jsonify({
          'client_secret': account_session.client_secret,
        })
    except Exception as e:
        print('An error occurred when calling the Stripe API to create an account session: ', e)
        return jsonify(error=str(e)), 500
  // This is your test secret API key.
  "api_key" => $stripeSecretKey,
try {
  $account_session = $stripe->accountSessions->create([
    'account' => "{{CONNECTED_ACCOUNT_ID}}",
    'components' => [
      'payments' => [
        'enabled' => true,
        'features' => [
          'refund_management' => true,
          'dispute_management' => true,
          'capture_payments' => true,
        ],
      ],
    ],
  ]);

  echo json_encode(array(
    'client_secret' => $account_session->client_secret
  ));
} catch (Exception $e) {
  error_log("An error occurred when calling the Stripe API to create an account session: {$e->getMessage()}");
  http_response_code(500);
  echo json_encode(['error' => $e->getMessage()]);
}
    // This is a placeholder - it should be replaced with your secret API key.
    // Sign in to see your own test API key embedded in code samples.
    // Don’t submit any personally identifiable information in requests made with this key.
    StripeClient client = new StripeClient("sk_INSERT_YOUR_SECRET_KEY");
    post("/account_session", (request, response) -> {
      response.type("application/json");

      try {
        Map<String, Object> params = new HashMap<>();
        params.put("account", "{{CONNECTED_ACCOUNT_ID}}");
        Map<String, Object> payments = new HashMap<>();
        payments.put("enabled", true);

        Map<String, Object> features = new HashMap<>();
        features.put("refund_management", true);
        features.put("dispute_management", true);
        features.put("capture_payments", true);
        payments.put("features", features);

        Map<String, Object> components = new HashMap<>();
        components.put("payments", payments);
        params.put("components", components);
        AccountSession accountSession = client.v1().accountSessions().create(params);
        CreateAccountSessionResponse accountSessionResponse = new CreateAccountSessionResponse(accountSession.getClientSecret());
        return gson.toJson(accountSessionResponse);
      } catch(Exception e) {
        System.out.println("An error occurred when calling the Stripe API to create an account session: " + e.getMessage());
        response.status(500);
        return gson.toJson(new ErrorResponse(e.getMessage()));
      }
    });
package main

import (
  "bytes"
  "context"
  "encoding/json"
  "io"
  "log"
  "net/http"
  "github.com/stripe/stripe-go/v82"
)
    // This is a placeholder - it should be replaced with your secret API key.
    // Sign in to see your own test API key embedded in code samples.
    // Don’t submit any personally identifiable information in requests made with this key.
    sc = stripe.NewClient("sk_INSERT_YOUR_SECRET_KEY")
func CreateAccountSession(sc *stripe.Client, w http.ResponseWriter, r *http.Request) {
    if r.Method != "POST" {
      http.Error(w, http.StatusText(http.StatusMethodNotAllowed), http.StatusMethodNotAllowed)
      return
    }

    accountSession, err := sc.V1AccountSessions.Create(context.TODO(),
      &stripe.AccountSessionCreateParams{
        Account: stripe.String("{{CONNECTED_ACCOUNT_ID}}"),
        Components: &stripe.AccountSessionCreateComponentsParams{
          Payments: &stripe.AccountSessionCreateComponentsPaymentsParams{
            Enabled: stripe.Bool(true),
            Features: &stripe.AccountSessionCreateComponentsPaymentsFeaturesParams{
              RefundManagement: stripe.Bool(true),
              DisputeManagement: stripe.Bool(true),
              CapturePayments: stripe.Bool(true),
            },
          },
        },
      },
    )

    if err != nil {
      log.Printf("An error occurred when calling the Stripe API to create an account session: %v", err)
      w.WriteHeader(http.StatusInternalServerError)
      if stripeErr, ok := err.(*stripe.Error); ok {
        writeJSON(w, struct {
          Error string `json:"error"`
        }{
          Error: stripeErr.Msg,
        })
      } else {
        writeJSON(w, struct {
          Error string `json:"error"`
        }{
          Error: err.Error(),
        })
      }
      return
    }

    writeJSON(w, struct {
      ClientSecret string `json:"client_secret"`
    }{
      ClientSecret: accountSession.ClientSecret,
    })
}
            // This is a placeholder - it should be replaced with your secret API key.
            // Sign in to see your own test API key embedded in code samples.
            // Don’t submit any personally identifiable information in requests made with this key.
            // Don't put any keys in code. See https://docs.stripe.com/keys-best-practices.
            services.AddSingleton(new StripeClient("<<YOUR_SECRET_KEY>>"));
    [Route("account_session")]
    [ApiController]
    public class AccountSessionApiController : Controller
    {
        private readonly StripeClient _client;

        public AccountSessionApiController(StripeClient client)
        {
            _client = client;
        }

        [HttpPost]
        public ActionResult Post()
        {
            try
            {
                AccountSession accountSession = _client.V1.AccountSessions.Create(
                    new AccountSessionCreateOptions
                    {
                        Account = "{{CONNECTED_ACCOUNT_ID}}",
                        Components = new AccountSessionComponentsOptions
                        {
                            Payments = new AccountSessionComponentsPaymentsOptions
                            {
                                Enabled = true,
                                Features = new AccountSessionComponentsPaymentsFeaturesOptions
                                {
                                    RefundManagement = true,
                                    DisputeManagement = true,
                                    CapturePayments = true
                                }
                            }
                        }
                    }
                );

                return Json(new { client_secret = accountSession.ClientSecret });
            } catch(Exception ex) {
                Console.Write("An error occurred when calling the Stripe API to create an account session:  " + ex.Message);
                Response.StatusCode = 500;
                return Json(new { error = ex.Message });
            }
        }
    }
{
  "require": {
      "stripe/stripe-php": "17.5.0"
  }
}
certifi==2026.1.4
chardet==5.2.0
click==8.3.1
Flask==3.1.2
idna==3.11
itsdangerous==2.2.0
Jinja2==3.1.6
MarkupSafe==3.0.3
requests==2.32.5
stripe==12.4.0
toml==0.10.2
Werkzeug==3.1.5
source 'https://rubygems.org/'

gem 'sinatra'
gem 'stripe', '15.4.0'
<project>
<!-- model version - always 4.0.0 for Maven 2.x POMs -->
<modelVersion>4.0.0</modelVersion>

<!-- project coordinates - values which uniquely identify this project -->
<groupId>com.stripe.sample</groupId>
<artifactId>stripe-account-onboarding</artifactId>
<version>1.0.0-SNAPSHOT</version>

<!-- library dependencies -->
<dependencies>
    <dependency>
        <groupId>org.slf4j</groupId>
        <artifactId>slf4j-simple</artifactId>
        <version>2.0.3</version>
    </dependency>
    <dependency>
        <groupId>com.sparkjava</groupId>
        <artifactId>spark-core</artifactId>
        <version>2.9.4</version>
    </dependency>
    <dependency>
        <groupId>com.google.code.gson</groupId>
        <artifactId>gson</artifactId>
        <version>2.9.1</version>
    </dependency>
    <dependency>
        <groupId>org.projectlombok</groupId>
        <artifactId>lombok</artifactId>
        <version>1.18.20</version>
        <scope>provided</scope>
    </dependency>
    <dependency>
        <groupId>com.stripe</groupId>
        <artifactId>stripe-java</artifactId>
        <version>29.4.0</version>
    </dependency>
</dependencies>
<build>
    <finalName>sample</finalName>
    <plugins>
        <plugin>
            <groupId>org.apache.maven.plugins</groupId>
            <artifactId>maven-compiler-plugin</artifactId>
            <version>3.10.1</version>
            <configuration>
                <source>1.8</source>
                <target>1.8</target>
            </configuration>
        </plugin>
        <plugin>
            <artifactId>maven-assembly-plugin</artifactId>
            <executions>
            <execution>
                <phase>package</phase>
                <goals>
                <goal>single</goal>
                </goals>
            </execution>
            </executions>
            <configuration>
            <descriptorRefs>
                <!-- This tells Maven to include all dependencies -->
                <descriptorRef>jar-with-dependencies</descriptorRef>
            </descriptorRefs>
            <archive>
                <manifest>
                <mainClass>Server</mainClass>
                </manifest>
            </archive>
            </configuration>
        </plugin>
    </plugins>
</build>
</project>
module stripe.com/docs/connect/connect-embedded-components/quickstart

go 1.21

require github.com/stripe/stripe-go/v82 v82.4.0
<Project Sdk="Microsoft.NET.Sdk.Web">

  <PropertyGroup>
    <TargetFramework>net8.0</TargetFramework>
    <RootNamespace>StripeExample</RootNamespace>
    <RollForward>Major</RollForward>
  </PropertyGroup>

  <ItemGroup>
    <PackageReference Include="Microsoft.AspNetCore.Mvc.NewtonsoftJson" Version="5.0.11" />
    <PackageReference Include="Stripe.net" Version="48.4.0" />
  </ItemGroup>

</Project>
  // Fetch the AccountSession client secret
  const response = await fetch('/account_session', { method: "POST" });
  // Fetch the AccountSession client secret
  const response = await fetch('/account_session.php', {
    method: "POST",
    headers: {
      "Content-Type": "application/json",
    },
  });
  const stripeConnectInstance = loadConnectAndInitialize({
    // This is a placeholder - it should be replaced with your publishable API key.
    // Sign in to see your own test API key embedded in code samples.
    // Don’t submit any personally identifiable information in requests made with this key.
    publishableKey: "pk_INSERT_YOUR_PUBLISHABLE_KEY",
    fetchClientSecret: fetchClientSecret,
    appearance: {
      overlays: 'dialog',
      variables: {
        colorPrimary: '#625afa',
      },
    },
      });
      const container = document.getElementById("container");
      const paymentsComponent = stripeConnectInstance.create("payments");
      container.appendChild(paymentsComponent);
{
  "name": "stripe-sample-code",
  "version": "1.0.0",
  "description": "Build a full, working integration using Connect embedded components. Here are some basic scripts you can use to build and run the application.",
  "scripts": {
    "start": "parcel watch",
    "build": "parcel build"
  },
  "author": "",
  "license": "ISC",
  "devDependencies": {
    "parcel": "^2.8.3"
  },
  "source": "public/index.html",
  "dependencies": {
    "@stripe/connect-js": "3.3.38"
  }
}
{
  "name": "stripe-sample-code",
  "version": "1.0.0",
  "description": "Build a full, working integration using Connect embedded components. Here are some basic scripts you can use to build and run the application.",
  "scripts": {
    "start-client": "parcel watch",
    "start-server": "node server.js",
    "start": "concurrently \"yarn start-client\" \"yarn start-server\"",
    "build": "parcel build"
  },
  "author": "",
  "license": "ISC",
  "devDependencies": {
    "concurrently": "4.1.2",
    "parcel": "^2.8.3"
  },
  "source": "public/index.html",
  "dependencies": {
    "express": "^4.17.1",
    "stripe": "17.6.0",
    "@stripe/connect-js": "3.3.38"
  }
}
{
  "name": "stripe-sample",
  "version": "0.1.0",
  "dependencies": {
    "@stripe/connect-js": "3.3.38",
    "@stripe/react-connect-js": "3.3.35",
    "express": "^4.17.1",
    "react": "^18.2.0",
    "react-dom": "^18.2.0",
    "react-scripts": "^3.4.0",
    "stripe": "17.6.0"
  },
  "devDependencies": {
    "concurrently": "4.1.2",
    "parcel": "^2.8.3"
  },
  "homepage": "http://localhost:3000",
  "proxy": "http://localhost:4242",
  "source": "public/index.html",
  "scripts": {
    "start-client": "parcel watch",
    "start-server": "node server.js",
    "build": "parcel build",
    "test": "react-scripts test",
    "eject": "react-scripts eject",
    "start": "concurrently \"yarn start-client\" \"yarn start-server\""
  },
  "eslintConfig": {
    "extends": "react-app"
  },
  "browserslist": {
    "production": [
      ">0.2%",
      "not dead",
      "not op_mini all"
    ],
    "development": [
      "last 1 chrome version",
      "last 1 firefox version",
      "last 1 safari version"
    ]
  }
}
{
  "name": "client",
  "version": "0.1.0",
  "private": true,
  "dependencies": {
    "react": "^18.2.0",
    "react-dom": "^18.2.0",
    "react-scripts": "^3.4.0",
    "@stripe/connect-js": "3.3.38",
    "@stripe/react-connect-js": "3.3.35"
  },
  "homepage": "http://localhost:3000",
  "proxy": "http://localhost:4242",
  "scripts": {
    "start": "parcel watch",
    "build": "parcel build"
  },
  "source": "public/index.html",
  "eslintConfig": {
    "extends": "react-app"
  },
  "browserslist": {
    "production": [
      ">0.2%",
      "not dead",
      "not op_mini all"
    ],
    "development": [
      "last 1 chrome version",
      "last 1 firefox version",
      "last 1 safari version"
    ]
  },
  "devDependencies": {
    "parcel": "^2.8.3"
  }
}
import {
  ConnectPayments,
  ConnectComponentsProvider,
} from "@stripe/react-connect-js";
  const [stripeConnectInstance] = useState(() => {
    const fetchClientSecret = async () => {
      // Fetch the AccountSession client secret
      const response = await fetch('/account_session', { method: "POST" });
      // Fetch the AccountSession client secret
      const response = await fetch('/account_session.php', {
        method: "POST",
        headers: {
          "Content-Type": "application/json",
        },
      });
      if (!response.ok) {
        // Handle errors on the client side here
        const {error} = await response.json();
        console.log('An error occurred: ', error);
        return undefined;
      } else {
        const {client_secret: clientSecret} = await response.json();
        return clientSecret;
      }
    };
    return loadConnectAndInitialize({
        // This is a placeholder - it should be replaced with your publishable API key.
        // Sign in to see your own test API key embedded in code samples.
        // Don’t submit any personally identifiable information in requests made with this key.
        publishableKey: "pk_INSERT_YOUR_PUBLISHABLE_KEY",
        fetchClientSecret: fetchClientSecret,
        appearance: {
          overlays: 'dialog',
          variables: {
            colorPrimary: '#625afa',
          },
        },
      })
    });
        <ConnectComponentsProvider connectInstance={stripeConnectInstance}>
          <ConnectPayments />
        </ConnectComponentsProvider>
const stripe = require('stripe')(process.env.STRIPE_SECRET_KEY);
export default async function handler(req, res) {
  if (req.method === 'POST') {
    try {
      const accountSession = await stripe.accountSessions.create({
        account: "{{CONNECTED_ACCOUNT_ID}}",
        components: {
          payments: {
            enabled: true,
            features: {
              refund_management: true,
              dispute_management: true,
              capture_payments: true,
            }
          }
        }
      });

      res.json({
        client_secret: accountSession.client_secret,
      });
    } catch (error) {
      console.error('An error occurred when calling the Stripe API to create an account session', error);
      res.status(500);
      res.send({error: error.message});
    }
  }
}
import {
  ConnectPayments,
  ConnectComponentsProvider,
} from "@stripe/react-connect-js";
    return loadConnectAndInitialize({
        // This is a placeholder - it should be replaced with your publishable API key.
        // Sign in to see your own test API key embedded in code samples.
        // Don’t submit any personally identifiable information in requests made with this key.
        publishableKey: "pk_INSERT_YOUR_PUBLISHABLE_KEY",
        fetchClientSecret: fetchClientSecret,
        appearance: {
          overlays: 'dialog',
          variables: {
            colorPrimary: '#625afa',
          },
        },
      })
    });
          <ConnectComponentsProvider connectInstance={stripeConnectInstance}>
            <ConnectPayments />
          </ConnectComponentsProvider>
\# This is a public sample test API key.
# Don’t submit any personally identifiable information in requests made with this key.
# Sign in to see your own test API key embedded in code samples.
STRIPE_SECRET_KEY=sk_INSERT_YOUR_SECRET_KEY
{
  "name": "stripe-sample",
  "version": "0.1.0",
  "scripts": {
    "dev": "next dev -p 4242"
  },
  "dependencies": {
    "@stripe/connect-js": "3.3.38",
    "@stripe/react-connect-js": "3.3.35",
    "micro": "9.4.1",
    "micro-cors": "0.1.1",
    "next": "^13.0.0",
    "react": "^18.2.0",
    "react-dom": "^18.2.0",
    "stripe": "17.6.0"
  }
}
{
  "name": "stripe-sample",
  "version": "0.1.0",
  "private": true,
  "source": "public/index.html",
  "scripts": {
    "start-client": "parcel watch",
    "start-server": "node server.js",
    "build": "parcel build",
    "start": "concurrently \"yarn start-client\" \"yarn start-server\""
  },
  "dependencies": {
    "@stripe/connect-js": "3.3.38",
    "express": "^4.17.1",
    "stripe": "17.6.0",
    "vue": "^3.2.38"
  },
  "devDependencies": {
    "@parcel/transformer-vue": "^2.9.3",
    "concurrently": "4.1.2",
    "parcel": "^2.9.3"
  },
  "browserslist": {
    "production": [
      ">0.2%",
      "not dead",
      "not op_mini all"
    ],
    "development": [
      "last 1 chrome version",
      "last 1 firefox version",
      "last 1 safari version"
    ]
  }
}
{
  "name": "stripe-sample",
  "version": "0.1.0",
  "private": true,
  "scripts": {
    "start": "parcel watch",
    "build": "parcel build"
  },
  "source": "public/index.html",
  "dependencies": {
    "@stripe/connect-js": "3.3.38",
    "vue": "^3.2.38"
  },
  "devDependencies": {
    "@parcel/transformer-vue": "^2.9.3",
    "parcel": "^2.9.3"
  },
  "browserslist": {
    "production": [
      ">0.2%",
      "not dead",
      "not op_mini all"
    ],
    "development": [
      "last 1 chrome version",
      "last 1 firefox version",
      "last 1 safari version"
    ]
  }
}
      const response = await fetch('/account_session', { method: "POST" });
      const response = await fetch('/account_session.php', { method: "POST" });
    const stripeConnectInstance = loadConnectAndInitialize({
      // This is a placeholder - it should be replaced with your publishable API key.
      // Sign in to see your own test API key embedded in code samples.
      // Don’t submit any personally identifiable information in requests made with this key.
      publishableKey: "pk_INSERT_YOUR_PUBLISHABLE_KEY",
      fetchClientSecret: fetchClientSecret,
      appearance: {
        overlays: 'dialog',
        variables: {
          colorPrimary: '#625afa',
        },
      },
    });
      const container = document.getElementById("container");
      const paymentsComponent = stripeConnectInstance.create("payments");
      container.appendChild(paymentsComponent);
1. Build the server

~~~
pip3 install -r requirements.txt
~~~

2. Run the server

~~~
export FLASK_APP=server.py
python3 -m flask run --port=4242
~~~
1. Build the server

~~~
bundle install
~~~

2. Run the server

~~~
ruby server.rb -o 0.0.0.0
~~~
1. Build the server

~~~
composer install
~~~

2. Run the server

~~~
php -S 127.0.0.1:4242 --docroot=dist
~~~
1. Build the server

~~~
dotnet restore
~~~

2. Run the server

~~~
dotnet run
~~~
1. Build the server

~~~
mvn package
~~~

2. Run the server

~~~
java -cp target/sample-jar-with-dependencies.jar com.stripe.sample.Server
~~~
1. Install the dependencies

~~
go mod download github.com/stripe/stripe-go/v82
~~

2. Run the server

~~~
go run server.go
~~~

3. Build the client app

~~~
npm install
~~~

4. Run the client app

~~~
npm start
~~~

5. Go to [http://localhost:4242/index.html](http://localhost:4242/index.html)
1. Build the application

~~~
npm install
~~~

2. Run the application

~~~
npm start
~~~

3. Go to [http://localhost:4242/index.html](http://localhost:4242/index.html)
1. Build the application

~~~
npm install
~~~

2. Run the application

~~~
npm run dev
~~~

3. Go to [localhost:4242](http://localhost:4242)
### Stripe Node ライブラリをインストールする

パッケージをインストールし、それをコードにインポートします。また、まったくゼロから開始していて `package.json` ファイルが必要な場合は、コードエディターのダウンロードリンクを使用してプロジェクトファイルをダウンロードします。

#### npm

ライブラリをインストールします。

```bash
npm install --save stripe@18.4.0
```

#### GitHub

stripe-node ライブラリのソースコードを直接 [GitHub から](https://github.com/stripe/stripe-node/releases/tag/v18.4.0)ダウンロードします。

### Stripe Ruby ライブラリをインストールする

Stripe Ruby gem をインストールし、コードから要求します。また、まったくゼロから開始していて Gemfile が必要な場合は、コードエディターのリンクを使用してプロジェクトファイルをダウンロードします。

#### Terminal

gem をインストールします。

```bash
gem install stripe -v 15.4.0
```

#### Bundler

この行を Gemfile に追加します。

```bash
gem 'stripe', '15.4.0'
```

#### GitHub

stripe-ruby gem のソースコードを直接 [GitHub から](https://github.com/stripe/stripe-ruby/releases/tag/v15.4.0)ダウンロードします。

### Stripe Java ライブラリーをインストールする

ビルドに依存関係を追加し、ライブラリをインポートします。まったくゼロから開始していてサンプルの `pom.xml` ファイル (Maven 用) が必要な場合は、コードエディターのリンクを使用してプロジェクトファイルをダウンロードします。

#### Maven

POM に次の依存関係を追加します。

```bash
<dependency>\n<groupId>com.stripe</groupId>\n<artifactId>stripe-java</artifactId>\n<version>29.4.0</version>\n</dependency>
```

#### Gradle

`build.gradle` ファイルに依存関係を追加します。

```bash
implementation "com.stripe:stripe-java:29.4.0"
```

#### GitHub

JAR を直接 [GitHub から](https://github.com/stripe/stripe-java/releases/tag/v29.4.0)ダウンロードします。

### Stripe Python パッケージをインストールする

Stripe パッケージをインストールし、コードにインポートします。まったくゼロから開始していて `requirements.txt` ファイルが必要な場合は、コードエディターのリンクを使用してプロジェクトファイルをダウンロードします。

#### pip

pip を使用してパッケージをインストールします。

```bash
pip3 install stripe==12.4.0
```

#### GitHub

stripe-python ライブラリのソースコードを直接 [GitHub から](https://github.com/stripe/stripe-python/releases/tag/v12.4.0)ダウンロードします。

### Stripe PHP ライブラリをインストールする

コンポーザーを使用してライブラリをインストールし、シークレット API キーで初期化します。まったくゼロから開始していて `composer.json` ファイルが必要な場合には、コードエディターのリンクを使用してファイルをダウンロードします。

#### Composer

ライブラリをインストールします。

```bash
composer require stripe/stripe-php:17.5.0
```

#### GitHub

stripe-php ライブラリのソースコードを直接 [GitHub から](https://github.com/stripe/stripe-php/releases/tag/v17.5.0)ダウンロードします。

### Stripe Go ライブラリをインストールする

ビルドに依存関係を追加し、ライブラリをインポートします。まったくゼロから開始していて `go.mod` ファイルが必要な場合には、コードエディターのリンクを使用してプロジェクトファイルをダウンロードします。

#### Go

必ず Go モジュールを使用して初期化してください。

```bash
go get -u github.com/stripe/stripe-go/v82@v82.4.0
```

#### GitHub

stripe-go モジュールのソースコードを直接 [GitHub から](https://github.com/stripe/stripe-go/releases/tag/v82.4.0)ダウンロードします。

### Stripe.net ライブラリーをインストールする

.NET または NuGet でパッケージをインストールします。まったくゼロから開始する場合には、設定済みの `.csproj` ファイルが含まれるファイルをダウンロードします。

#### dotnet

ライブラリをインストールします。

```bash
dotnet add package Stripe.net --version 48.4.0
```

#### NuGet

ライブラリをインストールします。

```bash
Install-Package Stripe.net -Version 48.4.0
```

#### GitHub

Stripe.net ライブラリのソースコードを直接 [GitHub から](https://github.com/stripe/stripe-dotnet/releases/tag/v48.4.0)ダウンロードします。

### Stripe ライブラリをインストールする

パッケージをインストールし、コードにインポートします。まったくゼロから開始していて `package.json` ファイルが必要な場合には、コードエディターのリンクを使用してプロジェクトファイルをダウンロードします。

ライブラリをインストールします。

```bash
npm install --save stripe@18.4.0
```

### Stripe Node ライブラリをインストールする

パッケージをインストールし、それをコードにインポートします。また、まったくゼロから開始していて `package.json` ファイルが必要な場合は、コードエディターのダウンロードリンクを使用してプロジェクトファイルをダウンロードします。

#### npm

ライブラリをインストールします。

```bash
npm install --save stripe@18.4.0
```

#### GitHub

stripe-node ライブラリのソースコードを直接 [GitHub から](https://github.com/stripe/stripe-node/releases/tag/v18.4.0)ダウンロードします。

### Stripe Ruby ライブラリをインストールする

Stripe Ruby gem をインストールし、コードから要求します。また、まったくゼロから開始していて Gemfile が必要な場合は、コードエディターのリンクを使用してプロジェクトファイルをダウンロードします。

#### Terminal

gem をインストールします。

```bash
gem install stripe -v 15.4.0
```

#### Bundler

この行を Gemfile に追加します。

```bash
gem 'stripe', '15.4.0'
```

#### GitHub

stripe-ruby gem のソースコードを直接 [GitHub から](https://github.com/stripe/stripe-ruby/releases/tag/v15.4.0)ダウンロードします。

### Stripe Java ライブラリーをインストールする

ビルドに依存関係を追加し、ライブラリをインポートします。まったくゼロから開始していてサンプルの `pom.xml` ファイル (Maven 用) が必要な場合は、コードエディターのリンクを使用してプロジェクトファイルをダウンロードします。

#### Maven

POM に次の依存関係を追加します。

```bash
<dependency>\n<groupId>com.stripe</groupId>\n<artifactId>stripe-java</artifactId>\n<version>29.4.0</version>\n</dependency>
```

#### Gradle

`build.gradle` ファイルに依存関係を追加します。

```bash
implementation "com.stripe:stripe-java:29.4.0"
```

#### GitHub

JAR を直接 [GitHub から](https://github.com/stripe/stripe-java/releases/tag/v29.4.0)ダウンロードします。

### Stripe Python パッケージをインストールする

Stripe パッケージをインストールし、コードにインポートします。まったくゼロから開始していて `requirements.txt` ファイルが必要な場合は、コードエディターのリンクを使用してプロジェクトファイルをダウンロードします。

#### pip

pip を使用してパッケージをインストールします。

```bash
pip3 install stripe==12.4.0
```

#### GitHub

stripe-python ライブラリのソースコードを直接 [GitHub から](https://github.com/stripe/stripe-python/releases/tag/v12.4.0)ダウンロードします。

### Stripe PHP ライブラリをインストールする

コンポーザーを使用してライブラリをインストールし、シークレット API キーで初期化します。まったくゼロから開始していて `composer.json` ファイルが必要な場合には、コードエディターのリンクを使用してファイルをダウンロードします。

#### Composer

ライブラリをインストールします。

```bash
composer require stripe/stripe-php:17.5.0
```

#### GitHub

stripe-php ライブラリのソースコードを直接 [GitHub から](https://github.com/stripe/stripe-php/releases/tag/v17.5.0)ダウンロードします。

### Stripe Go ライブラリをインストールする

ビルドに依存関係を追加し、ライブラリをインポートします。まったくゼロから開始していて `go.mod` ファイルが必要な場合には、コードエディターのリンクを使用してプロジェクトファイルをダウンロードします。

#### Go

必ず Go モジュールを使用して初期化してください。

```bash
go get -u github.com/stripe/stripe-go/v82@v82.4.0
```

#### GitHub

stripe-go モジュールのソースコードを直接 [GitHub から](https://github.com/stripe/stripe-go/releases/tag/v82.4.0)ダウンロードします。

### Stripe.net ライブラリーをインストールする

.NET または NuGet でパッケージをインストールします。まったくゼロから開始する場合には、設定済みの `.csproj` ファイルが含まれるファイルをダウンロードします。

#### dotnet

ライブラリをインストールします。

```bash
dotnet add package Stripe.net --version 48.4.0
```

#### NuGet

ライブラリをインストールします。

```bash
Install-Package Stripe.net -Version 48.4.0
```

#### GitHub

Stripe.net ライブラリのソースコードを直接 [GitHub から](https://github.com/stripe/stripe-dotnet/releases/tag/v48.4.0)ダウンロードします。

### Stripe ライブラリをインストールする

パッケージをインストールし、コードにインポートします。まったくゼロから開始していて `package.json` ファイルが必要な場合には、コードエディターのリンクを使用してプロジェクトファイルをダウンロードします。

ライブラリをインストールします。

```bash
npm install --save stripe@18.4.0
```

### 環境変数を設定する

シークレットキーを `.env` ファイルに追加します。これは Next.js によって自動的に[環境変数](https://nextjs.org/docs/basic-features/environment-variables)としてアプリケーションに読み込まれます。

### サーバーにエンドポイントを作成する

サーバー側で、クライアントが呼び出す新しいエンドポイントを追加します。

### 連結アカウントに API アクセスを委任する

連結アカウントの代わりにリクエストを行うには、連結アカウント ID を [AccountSessions API](https://docs.stripe.com/api/account_sessions.md) に渡します。

### 連結アカウントに対して特定の埋め込みコンポーネントを有効にする

連結アカウントに対して有効にする埋め込みコンポーネントを指定します。サポートされているすべての埋め込みコンポーネントの一覧については、[Connect の埋め込みコンポーネントの使用を開始する](https://docs.stripe.com/connect/supported-embedded-components.md)をご覧ください。

### AccountSession を作成する

エンドポイントから `v1/account_sessions` API を呼び出して、新しい [AccountSession](https://docs.stripe.com/api/account_sessions.md) を作成します。

### client secret を返す

AccountSession の `client_secret` プロパティーを応答で返します。

### Connect.js スクリプトを読み込む

[@stripe/connect-js](https://github.com/stripe/connect-js) モジュールをインポートし、`loadConnectAndInitialize(initParams)` を呼び出して、クライアントから Stripe への接続に必要なコードを読み込みます。Connect.js は同期で読み込みを行い、クライアントに `StripeConnectInstance` を返します。

#### npm

ライブラリをインストールします。

```bash
npm install --save @stripe/connect-js
```

#### GitHub

@stripe/connect-js ライブラリのソースコードを直接 [GitHub から](https://github.com/stripe/connect-js)ダウンロードします。

### React Connect.js をインポートする

[@stripe/react-connect-js](https://github.com/stripe/react-connect-js) モジュールをインポートします。React Connect.js は、埋め込みコンポーネントを任意の React アプリに追加できるようにする、Connect の埋め込みコンポーネントのシンラッパーです。

#### npm

ライブラリをインストールします。

```bash
npm install --save @stripe/react-connect-js
```

#### GitHub

@stripe/react-connect-js ライブラリのソースコードを直接 [GitHub から](https://github.com/stripe/react-connect-js)ダウンロードします。

### Connect.js を初期化する

`loadConnectAndInitialize(initParams)` は、StripeConnectInstance オブジェクトを返します。このオブジェクトは StripeConnectInstance の作成に使用されます。[公開可能キー](https://docs.stripe.com/keys.md)と、client secret を取得する `fetchClientSecret` 関数を渡して、StripeConnectInstance を初期化します。

### Connect の埋め込みコンポーネントを組み込む

Connect の埋め込みコンポーネントを DOM に追加します。初期化後は、StripeConnectInstance が Stripe に対するリクエストと、ウェブコンポーネントの UI の更新を管理します。これらの要素は、いつでも DOM でマウントまたはマウント解除ができ、自社の HTML でラップして、内部の要素をページ内にシームレスに適合させることができます。

初期化が正常に終了すると、StripeConnectInstance はアプリケーション内のすべての Connect の埋め込みコンポーネントのコンテキストを管理し、その client secret と公開可能キーを使用して Stripe に接続します。

### オプション: Connect の埋め込みコンポーネントのスタイルを設定する

初期化時に `appearance` 設定を StripeConnect に渡すことで、[Connect の埋め込みコンポーネントのデザインをカスタマイズ](https://docs.stripe.com/connect/get-started-connect-embedded-components.md#customize-the-look-of-connect-embedded-components)します。Connect の埋め込みコンポーネントは、すでに親の HTML 要素のフォントファミリーを継承していますが、会社のカラースキームを渡すことで、アプリケーションの他の部分と調和させることができます。