CoCreate-api

In this section we will use cocreate-api to create a customer and send dynamic data from the frontEnt to the Websocket.

Install

npm i @cocreate/api

Or you can use cdn link:

<script>https://cdn.cocreate.app/stripe/latest/CoCreate-api.min.js</script>

Usage

According to the usage of the official documentation of stripe create_customer, we note that we can send the [description, email] fields among others, but for the purposes of this example we will only use those already named

                                
Name-file : index-connect.html

<form realtime="true" id="customer-form" array="modules">
        <input type="text" stripe="description" value="My First Test Customer (created for API docs)" >
        <input type="text" stripe="email" value="customer@cocreate.com" >
	<button class='createCustomerBtn'>Click Balance Transaction</button>
</form>
                                
                            

The code, used for the front-end custom classAs can be seen, we only edit the parameter of the class where the css selector for the trigger buttons is registered classBtns

                                
Name-file = Cocreate-stripe.js   

var CocreateStripeAPi = function() {
...........
    this.classBtns = ['.createCustomerBtn']
...........
}
                                
                            

Only, we will show the interesting parts of the code, since in the index we show the general configuration of the websocket endpoint

                                
Name-file = Cocreate-stripeWebSocket.js   

........
switch (type) {
	case '.createCustomerBtn':
	    const customer = await stripe.customers.create(data);
	    utils.send_response(that.wsManager,socket,{"test":"from_server","response":customer},send_response)
	break;
}
........
                                
                            

If you have done everything right you will have an answer similar to this

For the following example, we will use method override, and use a special class called CocreateRender

Demo