#steven_api

1 messages · Page 1 of 1 (latest)

iron micaBOT
#

👋 Welcome to your new thread!

⏲️ We'll be here soon! Typically we respond in a few minutes, but sometimes we might take a bit longer if the server is busy or if you have a particularly tricky question.

⏱️ We close idle threads, which makes them read-only. Once a thread is closed it won't be reopened, but you can always start a new thread if you have another question.

🔗 This thread will always be available, even after it's closed. You can find it again using Discord's search, or you can save this link: https://discord.com/channels/841573134531821608/1422668732081111201

📝 Have more to share? Add more details, code, screenshots, videos, etc. below.

Below are links to other discussions we've had with you in the past week in case you want to review that information. If your question is related to one of these previous discussions, please provide a comprehensive summary of the current state and what you need help with now. We help many users simultaneously, so a summary allows us to resolve your issue as soon as possible.

storm dew
#

index.html

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <title>Connect embedded components</title>
    <meta
      name="description"
      content="A demo of Stripe Connect embedded components"
    />
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <link rel="stylesheet" href="index.css" />
    <script type="module" src="index.js" defer></script>
  </head>
  <body>
    <div id="container"></div>
    <div id="app-install-container"></div>

    <div id="error" hidden>Something went wrong!</div>
  </body>
</html>

index.js

import { loadConnectAndInitialize } from "@stripe/connect-js";

const fetchClientSecret = async () => {
  // Fetch the AccountSession client secret
  const response = await fetch('/account_session', { method: "POST" });
  if (!response.ok) {
    // Handle errors on the client side here
    const {error} = await response.json();
    console.log('An error occurred: ', error);
    document.querySelector('#container').setAttribute('hidden', '');
    document.querySelector('#error').removeAttribute('hidden');
    return undefined;
  } else {
    const {client_secret: clientSecret} = await response.json();
    document.querySelector('#container').removeAttribute('hidden');
    document.querySelector('#error').setAttribute('hidden', '');
    return clientSecret;
  }
}

const instance = loadConnectAndInitialize({
    // This is your test publishable API key.
    publishableKey: "pk_test_51RwuPSR***********00dHF6VSG6",
    fetchClientSecret: fetchClientSecret,
    appearance: {
      overlays: 'dialog',
      variables: {
        colorPrimary: '#625afa',
      },
    },
});

const container = document.getElementById("container");
const paymentsComponent = instance.create("payments");
container.appendChild(paymentsComponent);


const installContainer = document.getElementById('app-install-container');
const appInstall = instance.create('app-install');
appInstall.setApp('stripe.app-explorer');
 
installContainer.appendChild(appInstall);
#

server.js

const express = require("express");
const app = express();

const stripe = require("stripe")(
  // This is your test secret API key.
  'sk_test_51RwuPS******FAYbwl',
  {apiVersion: '2025-07-30.basil; embedded_connect_beta=v2;'}
);

app.use(express.static("dist"));
app.use(express.json());

app.post('/account_session', async (req, res) => {
  try {
    const accountSession = await stripe.accountSessions.create({
      account: "acct_1RwuVhDJPsRDUbIm",
      components: {
        app_install: {
          enabled: true,
          features: {
            allowed_apps: ['com.chargeblast.cbalert', 'stripe.app-explorer'],
          },
        },
        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});
  }
});

app.listen(4242, () => console.log("Node server listening on port 4242! Visit http://localhost:4242 in your browser."));
#

Web client (no console errors and the install button not appearing)

Screenshot_2025-09-30_at_3.38.58_PM.png
#

Following these Stripe docs:

real schooner
#

Hello
We can't help with beta features on discord as my team on discord only familiarizes with Publicly available (GA/Non-preview) features

If you write in via Stripe Support - We have specialized team that can help with the private/beta features

storm dew
#

Weirdly when I comment out a container append the install button does appear

real schooner
#

Sorry, not very familiar with this 🙁
Support can help put you in touch with the right team