To make requests to a vehicle, your end user must connect their vehicle using Smartcar Connect. Smartcar Connect uses the OAuth 2.0 protocol to provide a secure and elegant authorization flow for your users.

1. Initialize the Smartcar object

Instantiate a Smartcar object in the constructor of the App component.

  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • 13
  • 14
  • 15
  • 16
  • 17
  • 18
  • 19
  • 20
  • 21
  • 22
  • 23
  • 24
  • 25
  • 26
  • 27
  • 28
  • 29
  • 30
  • 31
  • 32
  • 33
  • 34
  • 35
  • 36
  • 37
  • 38
  • 39
  • 40
  • 41
  • 42
  • 43
  • 44
  • 45
  • 46
  • 47
  • 48
  • 49
  • 50
// ./index.js

// TODO: Authorization Step 1: Initialize the Smartcar object
const client = new smartcar.AuthClient({
  clientId: process.env.CLIENT_ID,
  clientSecret: process.env.CLIENT_SECRET,
  redirectUri: process.env.REDIRECT_URI,
  scope: ['required:read_vehicle_info'],
  testMode: true,
});

2. Launch Connect

A Server-Side Rendered application will redirect to Smartcar Connect to request access to a user’s vehicle. On Connect, the user logs in with the username and password for their vehicle’s connected services account and grants the application access to their vehicle.

To launch Connect, we need to redirect the user to the appropriate url. We can make use of the getAuthUrl function in our Smartcar object and pass the generated url to our view in views/home.hbs which will redirect to the URL on a button click. views/home.hbs is a simple view that renders an HTML button.

  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • 13
  • 14
  • 15
  • 16
  • 17
  • 18
  • 19
  • 20
  • 21
  • 22
  • 23
  • 24
  • 25
  • 26
  • 27
  • 28
  • 29
  • 30
  • 31
  • 32
  • 33
  • 34
  • 35
  • 36
  • 37
  • 38
  • 39
  • 40
  • 41
  • 42
  • 43
  • 44
  • 45
  • 46
  • 47
  • 48
  • 49
  • 50
// ./index.js

app.get('/login', function(req, res) {
  // TODO: Authorization Step 2: Launch the authorization flow
  const authUrl = client.getAuthUrl();

  res.render('home', {
    url: authUrl,
  });
});

3. Receive the authorization code

Once a user has authorized the application to access their vehicle, the user is redirected to the redirect_uri with an authorization code as a query parameter.

The authorization code represents a user consenting your application access to their vehicle. It does not grant access to the vehicle itself.

In the previous section, we had set our redirect_uri as localhost:8000/exchange. Now, our server can be set up as follows to receive the authorization code.

  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • 13
  • 14
  • 15
  • 16
  • 17
  • 18
  • 19
  • 20
  • 21
  • 22
  • 23
  • 24
  • 25
  • 26
  • 27
  • 28
  • 29
  • 30
  • 31
  • 32
  • 33
  • 34
  • 35
  • 36
  • 37
  • 38
  • 39
  • 40
  • 41
  • 42
  • 43
  • 44
  • 45
  • 46
  • 47
  • 48
  • 49
  • 50
// ./index.js

app.get('/exchange', function(req, res) {
  // TODO: Authorization Step 3: Handle Smartcar response
  const code = req.query.code;

  console.log(code);

  res.sendStatus(200);
});

Try it out

Let’s try authorizing a vehicle in test mode.

In test mode, any username or password is valid for each brand.

Start the server:

  • $
  • $
  • $
  • $
  • $
  • $
  • $
  • $
  • $
  • $
  • $
  • $
  • $
  • $
  • $
  • $
  • $
  • $
  • $
  • $
  • $
  • $
  • $
  • $
  • $
  • $
  • $
  • $
  • $
  • $
  • $
  • $
  • $
  • $
  • $
  • $
  • $
  • $
  • $
  • $
  • $
  • $
  • $
  • $
  • $
  • $
  • $
  • $
  • $
  • $
node index.js

Open your browser and go to http://localhost:8000/login. Once you log in, Smartcar lists all the permissions that your application is requesting access to (in this case read_vehicle_info). To authorize their vehicle, the user needs to accept all the requested permissions.

Once you have logged in and accepted the permissions, you should see your authorization code printed to your console.


In the next section, we will cover how to exchange the authorization code for an access_token and make your first request to Smartcar API with it!