PHP / Javascript - Добавить способ оплаты с Stripe API - PullRequest
Новая
       5

PHP / Javascript - Добавить способ оплаты с Stripe API

0 голосов
/ 31 октября 2018

Я использую Wordpress, но я использую готовое решение, потому что мой клиент запросил его специально. У меня есть этот Javascript, который создает форму, и когда форма отправляется, он создает cookie с токеном в нем, поэтому я могу получить его из PHP, это выглядит так: 

<form action="/wp-content/themes/betheme/includes/add_payment_method.php" method="post" id="add-card-form">
      <div class="form-row">
        <label for="card-element">
          Credit or debit card
        </label>

        <div id="card-element"></div>

        <!-- Used to display Element errors. -->
        <div id="card-errors" role="alert"></div>
      </div>

      <button>Add payment method</button>
    </form>

    <script src="https://js.stripe.com/v3/"></script>

    <script>
        var style = {
          base: {
            color: '#ffffff',
            fontSize: '14px',
            fontSmoothing: 'antialiased',
            '::placeholder': {
              color: '#ccc',
            },
            iconColor: "#fff"
          },
          invalid: {
            color: '#e5424d',
            ':focus': {
              color: '#303238',
            },
          },
        };
        var stripe = Stripe('xxxxxxxxxxxxxxxxxxxxxxx');
        var elements = stripe.elements();
        var cardElement = elements.create('card', {style: style, hidePostalCode: true});

        window.mobilecheck = function() {
          var check = false;
          (function(a){if(/(android|bb\d+|meego).+mobile|avantgo|bada\/|blackberry|blazer|compal|elaine|fennec|hiptop|iemobile|ip(hone|od)|iris|kindle|lge |maemo|midp|mmp|mobile.+firefox|netfront|opera m(ob|in)i|palm( os)?|phone|p(ixi|re)\/|plucker|pocket|psp|series(4|6)0|symbian|treo|up\.(browser|link)|vodafone|wap|windows ce|xda|xiino/i.test(a)||/1207|6310|6590|3gso|4thp|50[1-6]i|770s|802s|a wa|abac|ac(er|oo|s\-)|ai(ko|rn)|al(av|ca|co)|amoi|an(ex|ny|yw)|aptu|ar(ch|go)|as(te|us)|attw|au(di|\-m|r |s )|avan|be(ck|ll|nq)|bi(lb|rd)|bl(ac|az)|br(e|v)w|bumb|bw\-(n|u)|c55\/|capi|ccwa|cdm\-|cell|chtm|cldc|cmd\-|co(mp|nd)|craw|da(it|ll|ng)|dbte|dc\-s|devi|dica|dmob|do(c|p)o|ds(12|\-d)|el(49|ai)|em(l2|ul)|er(ic|k0)|esl8|ez([4-7]0|os|wa|ze)|fetc|fly(\-|_)|g1 u|g560|gene|gf\-5|g\-mo|go(\.w|od)|gr(ad|un)|haie|hcit|hd\-(m|p|t)|hei\-|hi(pt|ta)|hp( i|ip)|hs\-c|ht(c(\-| |_|a|g|p|s|t)|tp)|hu(aw|tc)|i\-(20|go|ma)|i230|iac( |\-|\/)|ibro|idea|ig01|ikom|im1k|inno|ipaq|iris|ja(t|v)a|jbro|jemu|jigs|kddi|keji|kgt( |\/)|klon|kpt |kwc\-|kyo(c|k)|le(no|xi)|lg( g|\/(k|l|u)|50|54|\-[a-w])|libw|lynx|m1\-w|m3ga|m50\/|ma(te|ui|xo)|mc(01|21|ca)|m\-cr|me(rc|ri)|mi(o8|oa|ts)|mmef|mo(01|02|bi|de|do|t(\-| |o|v)|zz)|mt(50|p1|v )|mwbp|mywa|n10[0-2]|n20[2-3]|n30(0|2)|n50(0|2|5)|n7(0(0|1)|10)|ne((c|m)\-|on|tf|wf|wg|wt)|nok(6|i)|nzph|o2im|op(ti|wv)|oran|owg1|p800|pan(a|d|t)|pdxg|pg(13|\-([1-8]|c))|phil|pire|pl(ay|uc)|pn\-2|po(ck|rt|se)|prox|psio|pt\-g|qa\-a|qc(07|12|21|32|60|\-[2-7]|i\-)|qtek|r380|r600|raks|rim9|ro(ve|zo)|s55\/|sa(ge|ma|mm|ms|ny|va)|sc(01|h\-|oo|p\-)|sdk\/|se(c(\-|0|1)|47|mc|nd|ri)|sgh\-|shar|sie(\-|m)|sk\-0|sl(45|id)|sm(al|ar|b3|it|t5)|so(ft|ny)|sp(01|h\-|v\-|v )|sy(01|mb)|t2(18|50)|t6(00|10|18)|ta(gt|lk)|tcl\-|tdg\-|tel(i|m)|tim\-|t\-mo|to(pl|sh)|ts(70|m\-|m3|m5)|tx\-9|up(\.b|g1|si)|utst|v400|v750|veri|vi(rg|te)|vk(40|5[0-3]|\-v)|vm40|voda|vulc|vx(52|53|60|61|70|80|81|83|85|98)|w3c(\-| )|webc|whit|wi(g |nc|nw)|wmlb|wonu|x700|yas\-|your|zeto|zte\-/i.test(a.substr(0,4))) check = true;})(navigator.userAgent||navigator.vendor||window.opera);
          return check;
        };

        if(mobilecheck()) {
            cardElement.mount('#Content > div > div > div > div.section.mcb-section.hide-desktop > div > div > div > div > div > div > div > form > div.form-row >div#card-element');
        }
        else {
            cardElement.mount('#Content > div > div > div > div.section.mcb-section.hide-tablet.hide-mobile > div > div > div > div > div > div > div > form > div.form-row > div#card-element');
        }

        cardElement.addEventListener('change', function(event) {
          var displayError = document.getElementById('card-errors');
          if (event.error) {
            displayError.textContent = event.error.message;
          } else {
            displayError.textContent = '';
          }
        });

        // Create a token or display an error when the form is submitted.
        var form = document.getElementById('add-card-form');
        form.addEventListener('submit', function(event) {
          event.preventDefault();

          stripe.createToken(cardElement).then(function(result) {
            if (result.error) {
              // Inform the customer that there was an error.
              var errorElement = document.getElementById('card-errors');
              errorElement.textContent = result.error.message;
            } else {
              // Send the token to your server.
              stripeTokenHandler(result.token);
            }
          });
        });

        function createCookie(name, value, days) {
          var expires;
          if (days) {
            var date = new Date();
            date.setTime(date.getTime() + (days * 24 * 60 * 60 * 1000));
            expires = "; expires=" + date.toGMTString();
          } else {
           expires = "";
          }
          document.cookie = escape(name) + "=" + escape(value) + expires + "; path=/";
        }

        function stripeTokenHandler(token) {
            createCookie("stripe_token", token, 1);

            var form = document.getElementById('add-card-form');
            form.submit();
        }
</script>

Когда форма отправлена, она выполняет этот PHP в add_payment_method.php: 

<?php
    require_once("../../../../wp-load.php");
    submit_stripe_payment_method($_COOKIE['stripe_token']);
?>

В моем functions.php файле для моей темы есть: 

<code>require_once('stripe-php/init.php');

....

function submit_stripe_payment_method($token) {
    print_r($token);

    $current_user_id = get_current_user_id();
    echo 'Your User ID is: ' .$current_user_id;

    $customer_id = get_user_meta( $current_user_id, '_stripe_customer_id', true );
    echo "CUSTOMER_ID: ".(string)$customer_id;

    \Stripe\Stripe::setApiKey("xxxxxxxxxxxxxxxxxxxxxxx");

    echo "MADE IT HERE";

    $customer = \Stripe\Customer::retrieve((string)$customer_id);

    echo "CUSTOMER: ".$customer;

    $customer_card = $customer->sources->create(["source" => $token]);
    echo "<pre>";
    var_dump($customer_card);
    echo "
"; }

Вывод выше:

[object Object]Your User ID is: 1CUSTOMER_ID: cus_DsoF18uw1dR0ujMADE IT HERE

Как вы можете видеть, он достигает только "СДЕЛАНО ЗДЕСЬ" echo.

Я подтвердил в веб-консоли Stripe, что $customer_id, который я использую, является правильным, и у меня нет ошибок, PHP или других. Единственное, о чем я могу думать, это то, что я неправильно использую токен, но он кажется довольно простым. Как вы можете видеть, $token печатается как [объект объекта], и он делает это независимо от того, как я пытаюсь его зарегистрировать, поэтому я не могу точно увидеть, что это такое, но это имеет смысл, потому что он содержит конфиденциальную информацию, используемую проверить кредитную карту ... также, возможно, она никогда не достигнет этой точки, потому что я никогда не вижу выписку echo "CUSTOMER: ".$customer;, поэтому, возможно, она зацикливается на:

$customer = \Stripe\Customer::retrieve((string)$customer_id);

Кроме того, я сначала попробовал вышеописанное без (string), но получил тот же результат.

Итак, после всего этого я проверяю консоль Stripe, и карта не была добавлена.

UPDATE

Очевидно, что версия API, которую я использую, не является последней версией, я могу обновить ее, я просто хочу знать, считает ли кто-нибудь, что это возможное решение, прежде чем я это сделаю. Как это может изменить, как работает полоса по всему сайту (с плагином). Я использую 2018-02-28 и могу обновить до 2018-09-24 . Я также тестирую в среде localhost, поэтому я не https, но я не думаю, что это имеет значение для тестирования.

UPDATE

Я понял, что не добавил конечную точку для моей установки localhost в область администрирования консоли stripe. Для этого мне пришлось использовать ngrok (как предлагает Stripe, если вы используете localhost). Я использую localhost для порта 8888, поэтому я сделал ./ngrok http 8888, а затем попытался снова, и это не сработало. В Wordpress говорится, что конечная точка будет enable you to receive notifications on the charge statuses. Так что, возможно, это не имеет отношения к добавлению метода оплаты. Я использовал http URL для ngrok, а не https URL.

UPDATE

Я вручную установил stripe-php, поэтому попробовал с composer, но это не помогло, тот же результат.

UPDATE

Я изменил свой ключ на secret key, и это позволило мне получить $customer, но я не вижу никакого вывода для $customer_card, и когда я смотрю в приборную панель, никакая карта не была создана.

UPDATE

Я проверил панель управления Stripe и получаю сообщение об ошибке при попытке создать источник: 

{
  "error": {
    "code": "resource_missing",
    "doc_url": "https://stripe.com/docs/error-codes/resource-missing",
    "message": "No such token: [object Object]",
    "param": "source",
    "type": "invalid_request_error"
  }
}

Что я не так делаю с токеном?

UPDATE

Решение проблемы с токеном: в тестовом режиме токен - это просто строка, соответствующая номеру тестовой кредитной карты, который вы используете, мне нужно "tok_visa" для 4242424242424242. https://stripe.com/docs/testing

1 Ответ

0 голосов
/ 31 октября 2018

Проблема может быть в том, что в очереди

\ нашивки \ Stripe :: setApiKey ( "xxxxxxxxxxxxxxxxxxxxxxx");

вы используете Publishable key начинается с pk_xxx, вместо этого вы должны использовать Secret Key sk_xxxx в своей учетной записи.

Вы могли видеть ошибки от Stripe Dashboard

https://dashboard.stripe.com/test/logs?method%5B%5D=get&method%5B%5D=post&method%5B%5D=delete&direction%5B%5D=connect_in&direction%5B%5D=self

после входа в систему.

Дайте мне знать, если это поможет

EDIT

Мне также нужно было использовать тестовый токен, который представляет собой просто строку, соответствующую номеру тестовой кредитной карты, который вы используете. https://stripe.com/docs/testing. См. Вкладку Tokens.

...