PHP 初心者が WordPress の プラグイン 作成 ! part03

この記事では PHP 初心者 が WordPress プラグイン を 作成 します。 part03 ではココナラ(ブログ)のリクエストとレスポンスを確認していきます。

前回の確認

先日の記事でココナラのブログに投稿するまでの一通りの流れを記載しました。

PHP 初心者が WordPress の プラグイン 作成 ! part02

ログインする
ブログを登校するボタンをクリックする
ブログの種類を選択し入力へ進むをクリックする
カバー画像を設定する
ブログタイトルを入力する
本文を入力する
公開設定をクリックする
販売設定・カテゴリ・ハッシュタグ を入力する
投稿するをクリックする

 

結構大変ですね😥
ココナラサーバとの間でどんな情報がやり取りされているのか見ていきたいと思います。
最近のブラウザには「開発者ツール」というツールが搭載されています。
だいたいのブラウザでは F12 キーを押すと出てきます。

 

このツールを利用してどんな情報をサーバに渡し、どんな情報が帰ってきているのか確認したいと思います。

 

ココナラサーバとのやり取り

ログイン

ココナラのログインURLは以下のようになっていました。

https://coconala.com/login?redirect_to=https%3A%2F%2Fcoconala.com%2F

URLエンコードされている部分があるので実際には

https://coconala.com/login?redirect_to=https://coconala.com/

となるでしょうか。

 

私はココナラ専用のアカウントを登録しています。
なので、「メールアドレス」と「パスワード」を入力してから
「メールアドレスでログインする」のボタンをクリックすることになります。

サーバに送信したデータがこちらです。

こちらがやり取りされているCookie情報

機密情報盛りだくさんなのでマスクしまくってます(笑

g-recaptcha-responseというフィールドの値はどうやって取得するのでしょうか。

ログイン画面のform要素を眺めていたらhiddenでその項目がありました。

<form action="/login" autocomplete="on" class="js_login-form loginChoiceBox_emailForm" data-key="login_email" id="UserLoginForm" method="post" accept-charset="utf-8">
<div style="display:none;"><input type="hidden" name="_method" value="POST"></div>
            <input name="data[User][login_email]" type="text" placeholder="メールアドレス" class="firstFocus js_login-email" id="UserLoginEmail">
            <input type="password" name="data[User][login_password]" placeholder="パスワード" class="loginChoiceBox_password js_login-password" id="UserLoginPassword">

            <div class="loginChoiceBox_loginEmailSave">
              <input type="hidden" name="data[User][login_email_save]" id="loginEmailSave_" value="0">
              <input type="checkbox" name="data[User][login_email_save]" class="js_login-email-save" id="loginEmailSave" value="1">
              <label for="loginEmailSave">メールアドレスを記憶する</label>
            </div>
            <input type="hidden" name="g-recaptcha-response" id="g-recaptcha-response" value="xxxxxxx">
            <button type="submit" class="loginChoiceBox_emailRegister submitButton js_submit-button" disabled="">
              <div class="frontButton">
                <i class="coconala-icon -envelope-o"></i>
                メールアドレスでログインする
              </div>
              <div class="progressButton">送信中</div>
            </button>
          </form>

しかしロボット避けでCAPCHAが動作する可能性が高くどうしようかなぁ・・・。今はこの問題はおいておきます。

 

まとめ

ココナラのログイン部分について調査しました。
サーバに送る情報はそんなに難しくは無い内容に見えました。
しかし、ロボット避けの対策があるようです。

またログイン時やログイン成功後にCookieをやり取りしているようにも見えます。
ひとまずログインについてはここまでにしておきます。

今日はここまで!