Thunder Info ~さんだーいんふぉめーしょん~

アラサーになったSEの、吐き出し口。でも、みんなだってホンネはそうだよね。

非を認めず、真っすぐに謝れない人の心理について(西村大臣発言の件で思ったこと)

久しぶりの投稿ですー、雑記です。

西村大臣の発言

経済再生担当相の発言とその後の対応が話題だ。端的に言うと「緊急事態宣言下で、酒類の提供停止に応じない飲食店には 金融機関から圧力をかける」という旨の発言をし、炎上した。その後の謝罪の弁はTwitterにて

とのことだ。「趣旨を十分に伝えられず」ということは「認識は間違っていなかった」と言うことだ。 どこからどう聞いても、誤った認識による発言だったように思うが。

真っすぐに謝れない人たち

政治家や官僚、大企業の役員幹部など、謝罪シーンで真正面から謝罪できる人は少ない。「女性は話が長い」と発言した方の謝罪シーンも記憶に新しい。 こういった謝罪では、ほとんどの場合、「私の発言が誤解を招き」や「意図が伝わらなかった」などと、なぜか聞き手に落ち度があったかのように説明し、 形だけの謝罪をする。なぜ「私が間違っていた」と言えないのだろう。

誤りを認めることは、人生の終わり?

今の日本社会では一度自分の非を認めると、どこまでも追及され、二度と這い上がることは許されないのだろう。 学びなおす、やり直すチャンスを与えてもらえないのだ。1度ミスを犯した社員は出世の道が閉ざされる等の話はよく聞く。 そのような風潮の中で、正直に非を認め謝る人はいるだろうか。

しかし、もし誤っていたのならば、それを正直に認めてもらえないと、建設的な議論などできるはずがない。 つまり「何が間違っていて、どう直せばいいのか」が有耶無耶なままでは、社会や個人は改善や成長のチャンスを奪われてしまうのだ。

このような風潮でよいのだろうか

人や必ず間違え、失敗を犯す。そんな時に、もし仮に、正直に非を認め、反省し、すぐに改善できたならば、 その人は称賛され、称えられても良いと思う。チャンスをまた与えて良い。そんな社会はいつかやってくるだろうか。 それとも、これからも永遠に、不祥事のたびに胸糞の悪い謝罪会見を見せられ続けるのだろうか。

PayPal JavaScript SDK はじめの一歩 ちょっと触ったよ

PayPal JavaScript SDK を触ってみたんですが、日本語で解説しているサイトがほとんどなく とても苦労したので書いてみようと思います。 公式のリファレンスはこちら PayPal JavaScript SDK

サービスの構成について

まず、どういう構成になっているかを整理しておきます。 (多分こういう構成だろ、という雑な理解で書いています。) PayPalでは、決済用のAPIを公開していて、そこにリクエストを投げれば決済してくれるようになっています。 PayPal JavaScript SDKでは、このAPIに決済用のリクエストを投げるWebパーツを用意してくれていて 開発者はHTML、JavaScriptでフロントエンドのコードだけ書けば、決済機能が作れるようになっています。 ただし、決済情報の送信から決済が完了するまでの処理はPayPal側のサーバサイドに移るため、 その途中に処理を挟み込むことはできないことになっています(たぶん)。

※このPayPal API呼び出しを、JavaScript SDKではなく、PythonPHPJavaなどから任意のロジックと一緒に記述した場合は、決済と任意の処理を組み合わせて実装できます。

概要を把握したところで、さっそくPayPal JavaScript SDKを使った場合の実装手順を確認します。

実装手順

上記の大まかな流れは、リファレンスに記載があります。
javascript-sdk-reference
しかし僕の場合どう頑張ってのこの通りでは動きませんでした(´;ω;`)
なので多少自分なりにアレンジを加えながら実現していきます。

  1. アカウントの取得
  2. 検証用APIの確認
  3. 決済ボタン(Webパーツ)の用意
  4. 決済ボタン(Webパーツ)の設定
  5. テスト用カードの作成
  6. 動作確認
  7. 本番用環境への切り替え

1.アカウントの取得

決済機能を使いたい場合、PayPalビジネス用のアカウントが必要なはずです。 www.paypal.com
今回僕は、とある友人からビジネスアカウント配下のDevelopperアカウントの招待を受けました。
ビジネス用アカウントを作るとPayPal Developerのサイトにもログインできます。(たぶん)
もし、PayPalのビジネスアカウントがない場合でも手順の3,4,5は進めることができて 大体の動きは確認できますので、試しにやってみたい方は手順3へGO!

2.検証用アプリとサンドボックス環境の確認

Developperのサイトにログインすると検証用APIを作成する画面があります。

f:id:ThunderInfo:20210515232811p:plain
newAPI
これから自作する決済機能付きWebページに合わせて、個別にAPIを作り、各種設定を施していくのですが、 デフォルトでDefault Applicationという名前のAPIが既に登録されていますので、 今回はこれを使います。クリックして、最低限の情報を確認しておきましょう。
f:id:ThunderInfo:20210515232956p:plain
ClientID
Webページ(クライアント)側に埋め込むClient IDが記載されています。後で使います。 その他、SANDBOX - Accountsという画面から今の検証環境で作られているダミーアカウント (ビジネスオーナーとユーザー)も確認しておきます。(ほとんど使いません。)
f:id:ThunderInfo:20210515233111p:plain
SandboxAccounts

3.決済ボタン(Webパーツ)の用意

JavaScript SDK reference リファレンスに従って、ボタンを作るコードを作成します・・・が、ここがどうしてもうまくいかなかったので PayPal Checkout | Secure Credit Card Processing | PayPal US こっちの画面からコードを自動生成します。 (リファレンスを見ながらの自作も頑張ったんですけどねぇ、僕にはちょっと無理でした 笑) 吐き出されたソースコードをHTMLに張り付けましょう。

    <div id="smart-button-container">
        <div style="text-align: center;">
            <div id="paypal-button-container"></div>
        </div>
    </div>
    <script src="https://www.paypal.com/sdk/js?client-id=sb&currency=JPY"
        data-sdk-integration-source="button-factory"></script>
    <script>
        function initPayPalButton() {
            paypal.Buttons({
                style: {
                    shape: 'rect',
                    color: 'gold',
                    layout: 'vertical',
                    label: 'paypal',

                },

                createOrder: function (data, actions) {
                    return actions.order.create({
                        purchase_units: [{ "amount": { "currency_code": "JPY", "value": 1000 } }]
                    });
                },

                onApprove: function (data, actions) {
                    return actions.order.capture().then(function (details) {
                        alert('Transaction completed by ' + details.payer.name.given_name + '!');
                    });
                },

                onError: function (err) {
                    console.log(err);
                }
            }).render('#paypal-button-container');
        }
        initPayPalButton();
    </script>

HTMLを開き、ボタンが表示されるか確認してみてください。 f:id:ThunderInfo:20210515235650p:plain

4.決済ボタン(Webパーツ)の設定

先ほどのソースコードをカスタマイズしていきます。 決済ボタン自体の各種設定はscriptタグのURLにパラメータを付加することで行います。 例えば、言語を日本語にするには、URLのパラメータにlocale=ja_JPを付け加えます。 また、client-idのパラメータは先ほどdevelopperサイトで確認したClient IDを設定します。 client-id=XXXXXXXXXXXX となります。XXXの部分は先ほど確認したClient ID

    <script src="https://www.paypal.com/sdk/js?client-id=XXXXXXXXXXXX&currency=JPY&locale=ja_JP"
        data-sdk-integration-source="button-factory"></script>
    <script>

基本的にはこれで、ボタンは完成ですが、 createOrderプロパティ、onApproveプロパティ、onErrorプロパティを必要に応じてカスタマイズします。 今回は、onApproveプロパティにメッセージ表示を追加してみました。

onApprove: function (data, actions) {
    return actions.order.capture().then(function (details) {
        alert('Transaction completed by ' + details.payer.name.given_name + '!');
        alert('payment id : ' + details.id);//★追記 支払いIDを表示します。
    });
},

作成出来たら、HTMLを開き、ボタンが表示されるか確認してみてください。

5.テスト用カードの作成

developperのサイトに戻りCredit card generatorから テスト用のカードを作成します。
f:id:ThunderInfo:20210516001419p:plain 作成出来たら、さっそく先ほどの画面でテストしてみましょう!

6.動作確認

いよいよ動作確認です。先ほど作成した画面にテスト用カードの情報を入れて 決済してみましょう。テスト用カードにない情報は、任意に記載してOKです。 ただし、各入力項目には書式チェックが走りますので(郵便番号や電話番号など) ある程度それっぽい情報を入れましょう。
f:id:ThunderInfo:20210516002318p:plain f:id:ThunderInfo:20210516002915p:plain 上手く決済ができたら、本当にサーバ側にその情報が飛んで来ているかをチェックします。 サンドボックス用のダッシュボードが用意されています。 先ほど確認したサンドボックス環境でのビジネスアカウントでログインします。 動作検証で入力した情報がこちらに飛んできていれば成功です。

7.本番環境への切り替え

いよいよ本番環境へ切り替えます。 切り替えるには本番用のAPIを用意し、Client IDを書きかえればOKです。 簡単ですね。developperサイトに行きLiveに切り替えてAPIを作成します。 自分のクレジットカードで少額決済してみましょう。

おめでとうございます、完成です!

最後に

PayPalは老舗のWeb決済事業者ですが、おそらくAPI提供ではほかのサービスの後塵を拝しているのではないかと思います。(だから日本語で解説している人少ないんだろう!?そうだろう!?) リファレンス関係の情報も、ユースケースの設定がいまいちだったり、参照すべきところが結構多岐にわたっていたりと、まとまっていない印象です。 でも決済系の仕組みを提供してくれているのは本当にありがたいですね 以前、Stripeで決済画面を作ったことがありますが、リファレンス一つで結構簡単に実装できたのをおぼえています。とても使いやすく作りやすかったです。

最後Stripe推しみたいになっちゃったな! おしまい(^ω^)

Web会議が当たり前の時代、PCはテキパキ操作しようね

前回ブックマークレットの記事を書いて以来、 数名の方がこのブログに足を運んでくださるようになりました(これまではほぼ0でした)。 ありがとうございます。実は私、現在は営業職なので、それほど技術には触れていないのですが、 これからも技術系の話やその他業務の与太話を書いていこうと思います。 よろしくお願いします。

本題

さて、今回は私の普段の仕事でも当たり前になってきたリモートワーク、 そのなかでも「Web会議」から見えてきたPC操作スキルの重要性についてお話します。 typing

続きを読む

ブックマークレットとは

最近あんまり聞かなくなりましたが
昔から「ブックマークレット」というツールをよく使っていました。
使っていた当時、どういう仕組みなのかはよくわかっていなかったのですが、
当時の認識は、

"ブラウザのブックマーク(お気に入り)に登録しておいて、必要な時にそのブックマークを実行すると 便利な機能が呼び出せる"

というものでした。
あれからはや十数年、IT関係の仕事に就き一時期はWeb開発にも携わっていたことで、 当時謎だったブックマークレットが何だったのかが理解できました。 今日は、当時の自分に向けてここに「ブックマークレットとは何か」を書いておきます。 ※JavaScriptやHTMLを理解している人向けの説明になると思います。

続きを読む

トイレのマークで恥かいて、良い気づきを得た話

皆さん、こんにちは。 だいぶ放置していましたが、久しぶりに書きたいことがあったので書きます。


町中や公共施設のトイレは、大体の場合このピクトグラムで指示されていると思います。
駅構内とかデパートとか学校とか、普段からよく目にしますよね。
今日はこのピクトグラムに関する気付きのお話です。

女子トイレに飛び込んじゃった

先日、品川駅(確か北改札内)でトイレを探していて、
僕もこのマークを見つけて飛び込んだんです。
その時、なぜか女子トイレに飛び込もうとしちゃったんですよね。
半歩くらい入って「えっ!?やべっ!」と気づき急いで脱出したんですが・・・。


はて。自分はなぜ女子トイレに飛び込んだんだろう。

続きを読む

オンライン飲み会がやりたいの?それともZOOMが使いたいの?!

オンラインでも飲み会やってますか?

コロナウィルスの自粛生活にも慣れてきて、
オンライン飲み会をやる機会も増えてきたのではないでしょうか。
私自身も何度かやりましたし、周囲でもよく聞きます、「オンライン飲み会」。
皆さん、どんなツールで飲み会してますか?

続きを読む

自分のアイデンティティを守ってくれた先生の話

小学校4年生の時、 どんな話の流れだったかは忘れてしまったが、ふと周囲のクラスメイトに 「自分はまだ50音表を完璧には覚えきれていない」という告白?をしてしまったことがあった。

ひらがなが書けなかったわけではない。 宿題になっていた漢字練習帳や日記帳はさぼりながらも、ほぼ毎日書いていたし、 国語のテストの点数も極端に悪かったことはなかった。

当時、自分自身も、自分が何を言いたいのかがうまく理解できていなかった。 でも感覚的に、あの表についてそれほど自信を持っていなかったことだけは確かだった。

続きを読む