Let's make a shopping site using stripe! (Purchase)

Petit promotion

https://www.code-sell.net/ We have created a service that allows you to sell your code! If you have code you don't need, please use it. By the way, I am using the stripe described in this article.

at first

Hello! Is it easy to use rails and stripe this time? I will make an EC site. A while ago, I made a site that sells code with rails and stripe, but I had a lot of trouble because there was too little information on stripe. To be precise, there is a lot of information itself, but there is little practical information, and it was just like arranging the code and explaining it a little like the official document. This time we will actually create the site.

Technology to use / what to make

Things you can buy articles like note

rails ruby stripe

What is stripe in the first place?

It is a payment system. Compared to payjp, the fee is cheaper and there is a remittance function.

Overall picture

Customer: A buyer and payer. Green in the figure above. Platform: An EC site to be created from now on. Where to provide the service. Connected accounts: Those who provide services using the platform and receive deposits / sellers (also called child accounts). Pink in the figure above.

Account type

Stripe has child account (seller) types called Standard and Custom. The features and registration method are different, so let's take a look.

Standard Development cost (labor): Easy User perspective: Subtle Responsibility when something happens: Seller (child account) Recommendation: Medium

This is a very easy type to implement. As I will write later, most of the registration form and system are handled by the stripe side. We just paste the link on the registration form and copy and paste it into the controller. If something happens (negative balance, etc.), it is the responsibility of the user, not us. However, this method clearly tells the user that they are using stripe. The registration form is entirely created by Stripe and will give the seller access to Stripe's admin screen (dashboard). The design cannot be changed either.

Custom Development cost (labor): Difficult User perspective: Good Responsibility when something happens: Platform (developer) Recommendation: High

This is a difficult type to implement. Create your own registration form, system to send to stripe, and dashboard. It is my responsibility when something happens. However, everything from registration to management screen is completed on your own site. Of course, the design is also free.

Preparation

As I explained, let's make and remember the details for the time being. This time we will create a one-off purchase site. You can also make regular payments, but that was done in another article ...

install gem

`gemfile`


gem "stripe"
gem 'dotenv-rails'

Don't forget the bundle. Then create a file called .env directly under the app folder

PUBLISHABLE_KEY="pk_test_xxx"
SECRET_KEY="sk_test_xxx"
CLIENT_ID="ca_xxx"

Please describe. CLIENT_ID is Get from here

`config/initializers/stripe.rb`


Rails.configuration.stripe = {
  publishable_key: ENV["PUBLISHABLE_KEY"],
  secret_key: ENV["SECRET_KEY"],
}
Stripe.api_key = Rails.configuration.stripe[:secret_key]

Create an application

Since it is troublesome to make from the beginning, I will make it scaffold. As I wrote at the beginning, this time I will create a service that allows you to purchase articles like note. Actually, it is better to have an image upload function, but this time we will focus on stripe, so we will minimize the function of the application.

rails g scaffold post title:string content:text price:integer

content ... content, product price ... price

rails db:migrate

I think you have scaffolded.

Purchase function

The purchase function is surprisingly easy. Let's make it first for the time being.

`routes.rb`


post "posts/:id/charge", to: "charge#create", as: "charge"

views

↓ erb version

`erb:show.html.erb`


<%= form_tag charge_path(@post) do %>
  <script src="https://checkout.stripe.com/checkout.js" class="stripe-button"
    data-key="#{ENV["PUBLISHABLE_KEY"]}"
    data-amount="<%= @post.price %>"
    data-currency="jpy"
    data-description="Credit settlement"
    data-name=<%= "#{@post.title}Buy" %>
    data-email=<%= "#{current_user.email}" %>
    data-label="To buy"
    data-image="https://stripe.com/img/documentation/checkout/marketplace.png "
    data-locale="auto"
    data-allow-remember-me="false">
  </script>
<% end %>

↓ slim version

`slim:show.html.slim`


= form_tag charge_path(@post) do
  script.stripe-button data-amount="#{@post.price}\
  " data-currency="jpy" data-description="Credit settlement\
  " data-key="#{ENV["PUBLISHABLE_KEY"]}" data-locale="auto" data-name="#{@post.title}Buy\
  " data-email="#{current_user.email}" data-label="To buy\
  " data-allow-remember-me="false" src="https://checkout.stripe.com/checkout.js"

If you write views charges_controller.rb Please make a controller called.

`charges_controller.rb`


class ChargesController < ApplicationController
  def create
    @post = Post.find(params[:id])
    customer = Stripe::Customer.create({
      email: params[:stripeEmail],
      source: params[:stripeToken],
    })
    charge = Stripe::Charge.create({
      customer: customer.id,
      amount: @post.price,
      description: "Product ID:#{@post.id}Product name:#{@post.title}",
      currency: "jpy",
    })
  rescue Stripe::CardError => e
    flash[:error] = e.message
    redirect_to new_charge_path
  end
end

To briefly explain, the customer is created on the 4th line. charge creates payment information. customer remains as it is amount sets the price of the item Set product information in description (whatever the content is) Set the currency to be handled by currency (USD, JPY, etc.)

I think you can buy it now. The card number when testing 4242 4242 4242 4242 is. cvc can be anything. The expiration date of the card can be any time in the future. There are several others. Test card list

At the end

That's all for this time. Next time, I will introduce devise, create my page, and explain how to create a standard account or custom account. It's hard, so it may be quite a destination.

Click here for more! ↓ ↓ https://qiita.com/UTOG/items/4d87595890cbfbed2e9f