Skip to main content

Widget for connecting a self-employed person to the Bank

This widget allows you to connect self-employed people to Bank 131. Before showing it to the user, you can check whether the person is in fact self-employed and whether they are connected to Bank 131. This can be done using the check and request/status requests.

How to use the widget​

  1. The self-employed person enters their INN or phone number.

  2. The self-employed person confirms the connection and clicks the button to update the request status.

All done. Now the self-employed person is connected to the Bank.

How to add the widget to a page​

To use the widget, you need to connect our JavaScript library to the page and get a token. You can use each token only once.

  1. Link the script and basic styles to the page.
<link href="https://widget-demo.bank131.ru/self-employed.css" rel="stylesheet">
<script src="https://widget-demo.bank131.ru/self-employed.js"></script>
  1. Place the widget container in the code.
<div id="bank131-self-employed"></div>
  1. Create an instance of the widget.

To create an instance of the widget, display the Bank131SelfEmployed global object in the container using the render() method. Use the token you received to work with the widget. Also, you can specify the self-employed person's tax reference number (INN, 12 digits) or phone number (11 digits in the 70000000000 format) as the value of the taxReferenceOrPhone parameter to be displayed in the widget when connecting the self-employed—this will help to prevent them from mistyping their details.

<script>
  if (window.Bank131SelfEmployed) {
    const selfEmployed = new Bank131SelfEmployed({
      initialValues: {
        taxReferenceOrPhone: '500000000000',
      },
      stage: Bank131SelfEmployed.STAGES.bind,
      publicToken: '0eb43bd1b6f5c7ed83903d7acd774179621018a2e74fb2702e5616f1f31fe553', // token
    });

    selfEmployed.render();
  }
</script>
  1. Wait for a result from the widget.

Subscribe to the messages on the current page.

window.addEventListener('message', function (event) {
// Handler code

console.dir(event.data);
})

Message format for: event data:

{
  "meta": {
    "stage": "bind"
  },
  "payload": {
    "status": "completed" // "in_progress" or "failed"
  }
}

The status field can have the following values:

  • completed — the connection was successful
  • in_progress — the registration is in progress; waiting for the self-employed person to confirm the connection
  • failed — the connection failed




Ask AI