payjp를 사용하여 구매 기능을 구현하고 있습니다! !
오늘은 비입니다.
편두통이 있는 분은 조심하십시오.
매년 우산을 10그루 없애는 내가 말하는 것은 전혀 설득력이 없다고 생각합니다만,
우산은 잊지 않도록! ! !
자, 이번에는 payjp를 사용하여 구매 기능을 구현하겠습니다.
(후리마 앱을 만드는 중)
payjp 도입 편도 있으므로 보지 않은 분은 먼저 그쪽을 체케라
payjp 도입편
신용카드 등록편
뷰 등의 보충편
1 먼저 라우팅을 결정합니다.
이 구입 기능을 어느 컨트롤러에 넣을까요.
다양한 기사를 읽는 한
・상품 컨트롤러에 넣는다
· 카드 컨트롤러에 넣기
・구입 컨트롤러를 새롭게 만든다
아타이적으로는 상품 테이블에 구입자, 구입된 시간의 컬럼을 넣고 있으므로 상품 컨트롤러 안에 넣기로 했습니다.
하지만 기존의 액션은 할 수 없어! !
그래서 이런 식으로 라우팅을 만들었습니다.
routes.rbresources :items, only: [:index, :new, :show, :create, :destroy] do
member do
get 'purchase'=> 'items#purchase', as: 'purchase'
patch 'pay'=> 'items#pay', as: 'pay'
get 'done'=> 'items#done', as: 'done'
end
왜 member로 하고 싶다고 말하면 상품의 id를 원하니까.
흐름으로는
상품 상세 페이지→상품 구입 페이지→구입 액션→구입 완료했습니다 페이지
2 다음은 컨트롤러 자이
상품 상세는 필요 없어 member로 정의한 액션만 써 갈게! !
items_controller.rbdef purchase
@item = Item.find(params[:id])
@card = Card.find_by(user_id: current_user.id)
if @card == nil
redirect_to new_card_path
flash[:noCard] = "Cardが登録されていませんので登録してください"
else
Payjp.api_key = Rails.application.credentials[:payjp][:PAYJP_PRIVATE_KEY]
customer = Payjp::Customer.retrieve(@card.customer_id)
@card_information = customer.cards.retrieve(@card.card_id)
# 購入確認ページでカード情報出したいからここで取得。
# 画像無い人はなくても良いかも。
@card_brand = @card_information.brand
case @card_brand
when "Visa"
@card_src = "if-visa-2593666_86609.svg"
when "JCB"
@card_src = "jcbcard.png"
when "MasterCard"
@card_src = "mastercard.png"
when "American Express"
@card_src = "americancard.png"
when "Diners Club"
@card_src = "diners_club.png"
when "Discover"
@card_src = "discover.png"
end
# ---------------------------------------------------------------
end
end
def pay
@item = Item.find(params[:id])
card = Card.find_by(user_id: current_user.id)
Payjp.api_key = Rails.application.credentials[:payjp][:PAYJP_PRIVATE_KEY]
Payjp::Charge.create(
amount: @item.price, # Payjpに載る金額
customer: card.customer_id, # 顧客ID
currency: 'jpy'
)
@item.update(buyer: current_user.id)
require 'date'
@item.update(bought_at: Time.now )
# アタイは購入時間を入れているからここもいらん人はなくてよし
redirect_to done_item_path(@item.id)
flash[:notice] = "購入が完了しました"
end
def done
end
이런 느낌이야.
3 일단 뷰 파일도
purchase.html.haml.purchaseBackground
= render 'layouts/global-header-simple'
%main.purchaseMain
%h2.purchaseMain__content.purchaseTitle 購入内容の確認
= form_with model: @item, local: true do |f|
.purchaseMain__content.purchaseItem
.purchaseItem__imageArea
= image_tag asset_path('curry.png'), class: 'purchaseItem__imageArea--image', alt: '購入アイテム画像'
.purchaseItem__box
%p
= @item.name
.purchaseItem__box--price
%span
= @item.price
円
%span.shipping-fee (税込) 送料込み
%section.purchaseMain__content
.purchaseMain__content__wrapper
.purchaseMain__content__wrapper__price
.purchaseMain__content__wrapper__price--label 支払い金額
.purchaseMain__content__wrapper__price--value
= @item.price
円
.purchaseMain__content__wrapper
.purchaseMain__content__wrapper__payMethod
.purchaseMain__content__wrapper__payMethod--label 支払い方法
= link_to card_path(@card.id), class: 'changeBtn' do
変更する
%p.user-card-info
クレジットカード
= "**** **** **** " + @card_information.last4
%p.user-card-info
有効期限
- exp_month = @card_information.exp_month.to_s
- exp_year = @card_information.exp_year.to_s.slice(2,3)
= exp_month + " / " + exp_year
%figure.user-card-logo
= image_tag "#{@card_src}",width:'34',height:'20', alt:'master-card'
.purchaseMain__content__wrapper
.purchaseMain__content__wrapper__delivery
.purchaseMain__content__wrapper__delivery--label 配送先
= link_to '#', class: 'changeBtn' do
変更する
%p.user-address-info
.purchaseMain__content__wrapper
%p.purchase-info
郵便局/コンビニ受取をご希望の方は、購入後に<strong>取引画面</strong>から受取場所を変更をすることが可能です。出品者が発送作業を開始した後は受取場所の変更ができませんので、早めに変更を行ってください。
.btn-enter
= link_to pay_item_path(@item.id), method: :patch do
.purchase-btn
購入する
= render 'layouts/global-footer-simple'
사진은 이런 느낌이야.
이것으로 프리마 앱으로 무제한 ZE !!!
크레디트 기능에 관해서는 이런 것입니까.
Reference
이 문제에 관하여(payjp를 사용하여 구매 기능을 구현하고 있습니다! !), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다
https://qiita.com/rockettetsu/items/f9f8625c24177906f28a
텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
우수한 개발자 콘텐츠 발견에 전념
(Collection and Share based on the CC Protocol.)
이 구입 기능을 어느 컨트롤러에 넣을까요.
다양한 기사를 읽는 한
・상품 컨트롤러에 넣는다
· 카드 컨트롤러에 넣기
・구입 컨트롤러를 새롭게 만든다
아타이적으로는 상품 테이블에 구입자, 구입된 시간의 컬럼을 넣고 있으므로 상품 컨트롤러 안에 넣기로 했습니다.
하지만 기존의 액션은 할 수 없어! !
그래서 이런 식으로 라우팅을 만들었습니다.
routes.rb
resources :items, only: [:index, :new, :show, :create, :destroy] do
member do
get 'purchase'=> 'items#purchase', as: 'purchase'
patch 'pay'=> 'items#pay', as: 'pay'
get 'done'=> 'items#done', as: 'done'
end
왜 member로 하고 싶다고 말하면 상품의 id를 원하니까.
흐름으로는
상품 상세 페이지→상품 구입 페이지→구입 액션→구입 완료했습니다 페이지
2 다음은 컨트롤러 자이
상품 상세는 필요 없어 member로 정의한 액션만 써 갈게! !
items_controller.rbdef purchase
@item = Item.find(params[:id])
@card = Card.find_by(user_id: current_user.id)
if @card == nil
redirect_to new_card_path
flash[:noCard] = "Cardが登録されていませんので登録してください"
else
Payjp.api_key = Rails.application.credentials[:payjp][:PAYJP_PRIVATE_KEY]
customer = Payjp::Customer.retrieve(@card.customer_id)
@card_information = customer.cards.retrieve(@card.card_id)
# 購入確認ページでカード情報出したいからここで取得。
# 画像無い人はなくても良いかも。
@card_brand = @card_information.brand
case @card_brand
when "Visa"
@card_src = "if-visa-2593666_86609.svg"
when "JCB"
@card_src = "jcbcard.png"
when "MasterCard"
@card_src = "mastercard.png"
when "American Express"
@card_src = "americancard.png"
when "Diners Club"
@card_src = "diners_club.png"
when "Discover"
@card_src = "discover.png"
end
# ---------------------------------------------------------------
end
end
def pay
@item = Item.find(params[:id])
card = Card.find_by(user_id: current_user.id)
Payjp.api_key = Rails.application.credentials[:payjp][:PAYJP_PRIVATE_KEY]
Payjp::Charge.create(
amount: @item.price, # Payjpに載る金額
customer: card.customer_id, # 顧客ID
currency: 'jpy'
)
@item.update(buyer: current_user.id)
require 'date'
@item.update(bought_at: Time.now )
# アタイは購入時間を入れているからここもいらん人はなくてよし
redirect_to done_item_path(@item.id)
flash[:notice] = "購入が完了しました"
end
def done
end
이런 느낌이야.
3 일단 뷰 파일도
purchase.html.haml.purchaseBackground
= render 'layouts/global-header-simple'
%main.purchaseMain
%h2.purchaseMain__content.purchaseTitle 購入内容の確認
= form_with model: @item, local: true do |f|
.purchaseMain__content.purchaseItem
.purchaseItem__imageArea
= image_tag asset_path('curry.png'), class: 'purchaseItem__imageArea--image', alt: '購入アイテム画像'
.purchaseItem__box
%p
= @item.name
.purchaseItem__box--price
%span
= @item.price
円
%span.shipping-fee (税込) 送料込み
%section.purchaseMain__content
.purchaseMain__content__wrapper
.purchaseMain__content__wrapper__price
.purchaseMain__content__wrapper__price--label 支払い金額
.purchaseMain__content__wrapper__price--value
= @item.price
円
.purchaseMain__content__wrapper
.purchaseMain__content__wrapper__payMethod
.purchaseMain__content__wrapper__payMethod--label 支払い方法
= link_to card_path(@card.id), class: 'changeBtn' do
変更する
%p.user-card-info
クレジットカード
= "**** **** **** " + @card_information.last4
%p.user-card-info
有効期限
- exp_month = @card_information.exp_month.to_s
- exp_year = @card_information.exp_year.to_s.slice(2,3)
= exp_month + " / " + exp_year
%figure.user-card-logo
= image_tag "#{@card_src}",width:'34',height:'20', alt:'master-card'
.purchaseMain__content__wrapper
.purchaseMain__content__wrapper__delivery
.purchaseMain__content__wrapper__delivery--label 配送先
= link_to '#', class: 'changeBtn' do
変更する
%p.user-address-info
.purchaseMain__content__wrapper
%p.purchase-info
郵便局/コンビニ受取をご希望の方は、購入後に<strong>取引画面</strong>から受取場所を変更をすることが可能です。出品者が発送作業を開始した後は受取場所の変更ができませんので、早めに変更を行ってください。
.btn-enter
= link_to pay_item_path(@item.id), method: :patch do
.purchase-btn
購入する
= render 'layouts/global-footer-simple'
사진은 이런 느낌이야.
이것으로 프리마 앱으로 무제한 ZE !!!
크레디트 기능에 관해서는 이런 것입니까.
Reference
이 문제에 관하여(payjp를 사용하여 구매 기능을 구현하고 있습니다! !), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다
https://qiita.com/rockettetsu/items/f9f8625c24177906f28a
텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
우수한 개발자 콘텐츠 발견에 전념
(Collection and Share based on the CC Protocol.)
def purchase
@item = Item.find(params[:id])
@card = Card.find_by(user_id: current_user.id)
if @card == nil
redirect_to new_card_path
flash[:noCard] = "Cardが登録されていませんので登録してください"
else
Payjp.api_key = Rails.application.credentials[:payjp][:PAYJP_PRIVATE_KEY]
customer = Payjp::Customer.retrieve(@card.customer_id)
@card_information = customer.cards.retrieve(@card.card_id)
# 購入確認ページでカード情報出したいからここで取得。
# 画像無い人はなくても良いかも。
@card_brand = @card_information.brand
case @card_brand
when "Visa"
@card_src = "if-visa-2593666_86609.svg"
when "JCB"
@card_src = "jcbcard.png"
when "MasterCard"
@card_src = "mastercard.png"
when "American Express"
@card_src = "americancard.png"
when "Diners Club"
@card_src = "diners_club.png"
when "Discover"
@card_src = "discover.png"
end
# ---------------------------------------------------------------
end
end
def pay
@item = Item.find(params[:id])
card = Card.find_by(user_id: current_user.id)
Payjp.api_key = Rails.application.credentials[:payjp][:PAYJP_PRIVATE_KEY]
Payjp::Charge.create(
amount: @item.price, # Payjpに載る金額
customer: card.customer_id, # 顧客ID
currency: 'jpy'
)
@item.update(buyer: current_user.id)
require 'date'
@item.update(bought_at: Time.now )
# アタイは購入時間を入れているからここもいらん人はなくてよし
redirect_to done_item_path(@item.id)
flash[:notice] = "購入が完了しました"
end
def done
end
purchase.html.haml
.purchaseBackground
= render 'layouts/global-header-simple'
%main.purchaseMain
%h2.purchaseMain__content.purchaseTitle 購入内容の確認
= form_with model: @item, local: true do |f|
.purchaseMain__content.purchaseItem
.purchaseItem__imageArea
= image_tag asset_path('curry.png'), class: 'purchaseItem__imageArea--image', alt: '購入アイテム画像'
.purchaseItem__box
%p
= @item.name
.purchaseItem__box--price
%span
= @item.price
円
%span.shipping-fee (税込) 送料込み
%section.purchaseMain__content
.purchaseMain__content__wrapper
.purchaseMain__content__wrapper__price
.purchaseMain__content__wrapper__price--label 支払い金額
.purchaseMain__content__wrapper__price--value
= @item.price
円
.purchaseMain__content__wrapper
.purchaseMain__content__wrapper__payMethod
.purchaseMain__content__wrapper__payMethod--label 支払い方法
= link_to card_path(@card.id), class: 'changeBtn' do
変更する
%p.user-card-info
クレジットカード
= "**** **** **** " + @card_information.last4
%p.user-card-info
有効期限
- exp_month = @card_information.exp_month.to_s
- exp_year = @card_information.exp_year.to_s.slice(2,3)
= exp_month + " / " + exp_year
%figure.user-card-logo
= image_tag "#{@card_src}",width:'34',height:'20', alt:'master-card'
.purchaseMain__content__wrapper
.purchaseMain__content__wrapper__delivery
.purchaseMain__content__wrapper__delivery--label 配送先
= link_to '#', class: 'changeBtn' do
変更する
%p.user-address-info
.purchaseMain__content__wrapper
%p.purchase-info
郵便局/コンビニ受取をご希望の方は、購入後に<strong>取引画面</strong>から受取場所を変更をすることが可能です。出品者が発送作業を開始した後は受取場所の変更ができませんので、早めに変更を行ってください。
.btn-enter
= link_to pay_item_path(@item.id), method: :patch do
.purchase-btn
購入する
= render 'layouts/global-footer-simple'
사진은 이런 느낌이야.
이것으로 프리마 앱으로 무제한 ZE !!!
크레디트 기능에 관해서는 이런 것입니까.
Reference
이 문제에 관하여(payjp를 사용하여 구매 기능을 구현하고 있습니다! !), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다 https://qiita.com/rockettetsu/items/f9f8625c24177906f28a텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
우수한 개발자 콘텐츠 발견에 전념 (Collection and Share based on the CC Protocol.)