Create a Client with OAuth

After you create an OAuth app for your client site or app in your project dashboard, you can begin coding by installing the Wix JavaScript SDK, importing modules in your code, and creating an SDK client.

Prerequisites

• Create a Project
• Create an OAuth App for Visitors and Members

Install packages

Install @wix/sdk and the packages for the domain-specific APIs you wish to work with. Domain-specific packages follow the naming convention @wix/{domain}. For example:

1
npm install @wix/sdk
2
npm install @wix/bookings
3
npm install @wix/stores

or

1
yarn add @wix/sdk
2
yarn add @wix/bookings
3
yarn add @wix/stores

Import modules in your code

To use the APIs you have installed, import createClient from the @wix/sdk package along with an authentication strategy, and import functionality from the desired domain-specific packages you installed. For example:

1
import { createClient, OAuthStrategy } from '@wix/sdk';
2
import { availabilityCalendar, services } from '@wix/bookings';
3
import { products } from '@wix/stores';

Make sure to import both createClient and OAuthStrategy from @wix/sdk.

Create a client

To get started connecting to a Wix project, use the createClient() function imported from the @wix/sdk package to create a new client.

For example:

1
const myWixClient = createClient({
2
    modules: {
3
      products,
4
      services
5
    },
6
    auth: OAuthStrategy({
7
      clientId: '<YOUR_CLIENT_ID>',
8
      tokens: {
9
        accessToken: {
10
          value: '<ACCESS_TOKEN_VALUE>',
11
          expiresAt: <ACCESS_TOKEN_EXPIRY_DATE>
12

13
        },
14
        refreshToken: {
15
          value: '<REFRESH_TOKEN_VALUE>'
16
        }
17
      }
18
    })
19
  })

Pass the modules you want to use and authorization information when creating the client.

• The modules property contains key:value pairs. Each value is an imported module you wish to enable in the client, and the key defines the name to use for working with that module.
• The auth property contains the authentication method and credentials for connecting with your Wix project. To use the OAuth authentication strategy, call OAuthStrategy() with an object containing:
  • clientId: You OAuth app client ID. You can retrieve it from the Headless Settings menu in the dashboard. If you haven't created an OAuth app yet, see Create an OAuth App to set one up.
  • tokens: Optional. An object containing access and refresh tokens for a site visitor or member. If you pass tokens, every call made by the client uses these tokens to maintain a persistent session.

Call APIs with a client

After creating a client, you can use it to call APIs.

For example:

1
const { items } = await myWixClient.products.queryProducts().find();

Work with visitor or member sessions

Often, you will need to maintain a persistent session to work with site or app visitors and members. Sessions are maintained using tokens. Most of the token management is handled by the client object, but there is some work you need to do, which differs depending on your situation.

• To handle site visitor sessions, see Handle Visitors.
• To handle member sessions with a Wix-managed login, see Handle Members with Managed Login.
• To handle member sessions with a custom login, see Handle Members with Custom Login.