OAuth application
The SDK Axios and SDK Fetch repositories include a server example: connecting a project through OAuth with PKCE, storing the token in a server session and reading project information. Choose one. These examples do not need Passport.
Preparation
You need Git, npm and Node.js compatible with the chosen SDK's engines. Create an OAuth application, enable project:read and configure http://localhost:3000/auth/streamvi/callback as the callback address. Choose a test project during connection. If you change the domain or port, update both the application settings and .env. See Settings for illustrated setup.
project:read is needed to request project information. Choose the corresponding permissions for other methods. This example exchanges the code using PKCE and does not need an application secret: the single-use code_verifier stays on the server.
Local launch
For Axios:
git clone https://github.com/StreamVi/streamvi-sdk.git
cd streamvi-sdk
npm install
cp .env.example .env
For Fetch, clone https://github.com/StreamVi/streamvi-sdk-fetch.git and enter streamvi-sdk-fetch. The remaining steps are identical. This runs the repository's demonstration server. To install only the client in your application, follow SDK Axios or SDK Fetch.
Fill in .env in the cloned SDK's root:
STREAMVI_CLIENT_ID=YOUR_CLIENT_ID
CALLBACK_URL=http://localhost:3000/auth/streamvi/callback
SESSION_SECRET=YOUR_RANDOM_SESSION_SECRET
PORT=3000
Generate a random session secret with this command and use its output as SESSION_SECRET:
node -e "console.log(require('node:crypto').randomBytes(32).toString('hex'))"
npm run example
Open the local example page and click Connect a project. Do not run both examples on the same port. Keep .env out of Git. The welcome page confirms server startup; to check the API, complete the connection and verify that the selected project appears.
Connection flow
The /auth/streamvi route creates single-use state and code_verifier values. The server saves them in the session for ten minutes and sends the browser to Cabinet with code_challenge. After project selection and consent, StreamVi returns the browser to /auth/streamvi/callback.
The handler uses the saved attempt only once: it checks expiry and state, then exchanges the code with the original code_verifier. After an error or a repeated callback, start a new connection. Starting a new attempt replaces the previous one. See OAuth for the underlying flow.
After a successful exchange, the server stores the token and internal project ID, then queries the project through the SDK. The page shows its name and ID; the token is not included in HTML or logs.
| File | Purpose |
|---|---|
example/config/oauth.ts | state, PKCE, callback validation and code exchange |
example/config/session.ts | Server session |
example/routes/index.ts | Connection routes, result storage and project request |
Adapting the example
Example sessions are stored in memory and disappear when the server restarts. For your server, configure persistent session storage, HTTPS and secure cookies, and associate connections with your application's users. The token stays on the server. The example does not refresh it automatically: reconnect if access is lost.
Passport example
The separate passport-streamvi-example demonstrates an existing Passport integration. It sends the connection result, including the token, to the response and console; remove this output before using it in your own application. It also depends on the published Passport strategy with callback validation limitations described in Passport.
The strategy fix has been merged on GitHub. When using Passport, install the fixed package and configure the session, state and PKCE using the library guide. The SDK server examples above implement this exchange directly and do not depend on Passport.