Home>

We are currently deploying our original app on AWS and heroku.
If there is something missing, I will add it, so please specify.

Token payment is not possible in AWS and heroku production environment

It works locally without any problems.
I used to add a token payment function to the application I created earlier.
The app was able to process payments on heroku without any problems.
In this app, both heroku and AWS have similar errors.
Since I was able to process it with heroku last time, I think that there is no problem with the description.
If there is any code that feels unnatural around that, please let me know ...

The private key and public key of payjp are the same as those of the previous application, and they are set in the environment variables in the same way.

error

Error on heroku

] (C57eb0caa33d3fbdfdea1dc11a8e2cd3.png)

Errors on AWS


Original (local) parameters

Rails side code
# Trading controller
class TransactionsController</pre>
<p><br />
DealTransaction uses a form object</p>
<pre><code data-language = "Ruby">class DealTransaction
  include ActiveModel :: Model
  attr_accessor: buyer_id,: seller_id,: item_id,: postal_code,: shipping_area_id,: city,: house_number,: building_name,: phone_number,: token
  VALID_POSTAL_REGIX =/\ A \ d {3} [-] \ d {4} \ z /
  VALID_PHONE_REGIX =/\ A \ d {, 11} \ z /

  with_options presence: true do
    validates: postal_code, format: {with: VALID_POSTAL_REGIX, message: "Input correctly"}
    validates: shipping_area_id
    validates: city
    validates: house_number
    validates: token
    validates: phone_number, format: {with: VALID_PHONE_REGIX, message: "can't be blank"}
  end
  def save
    deal = Deal.create (buyer_id: buyer_id, seller_id: seller_id, item_id: item_id)
    Transaction.create (deal_id: deal.id, postal_code: postal_code, shipping_area_id: shipping_area_id, city: city, house_number: house_number,
    building_name: building_name, phone_number: phone_number)
  end

end


Here is the description of javascript

const pay = () =>{
  Payjp.setPublicKey (process.env.PAYJP_PUBLIC_KEY);
  const form = document.getElementById ("charge-form");
  form.addEventListener ("submit", (e) =>{
    e.preventDefault ();
    const formResult = document.getElementById ("charge-form");
    const formData = new FormData (formResult);
    const card = {
      number: formData.get ("deal_transaction [number]"),
      exp_month: formData.get ("deal_transaction [exp_month]"),
      exp_year: `20 ${formData.get ("deal_transaction [exp_year] ")}`,
      cvc: formData.get ("deal_transaction [cvc]"),
    };
    Payjp.createToken (card, (status, response) =>{
      if (status === 200) {
        const token = response.id;
        const renderDom = document.getElementById ("charge-form");
        const tokenObj = `<input value = ${token} type =" hidden "name ='token'>`;
        renderDom.insertAdjacentHTML ("beforeend", tokenObj);
        document.getElementById ("card-number"). removeAttribute ("name");
        document.getElementById ("card-exp-month"). removeAttribute ("name");
        document.getElementById ("card-exp-year"). removeAttribute ("name");
        document.getElementById ("card-cvc"). removeAttribute ("name");
        document.getElementById ("charge-form"). submit ();
        document.getElementById ("charge-form"). reset ();
      } else {
        const token ='';
        const renderDom = document.getElementById ("charge-form");
        const tokenObj = `<input value = ${token} type =" hidden "name ='token'>`;
        renderDom.insertAdjacentHTML ("beforeend", tokenObj);
        document.getElementById ("charge-form"). submit ();
        document.getElementById ("charge-form"). reset ();
      }
    });
  });
};
window.addEventListener ("load", pay);

Is this happening because the environment variables that are being reflected are not being reflected?
Excuse me for a long time, but if anyone understands the problematic part, the description to be corrected, etc.
I would appreciate it if you could teach me.
Thanks for your cooperation.