僕は中国人向けホームページを作っています。本ブログではそんな中で分かったノウハウをいくつか公開しています!
2つのトピックがあります。
- ★中国人向け電子決算導入について
- ★中国人向けホームページ作成について
今回はホームページ作成について書きます。中国でも使える会員登録画面を作ろう!
会員登録画面の作り方
ヤリ場サイト
この前ヤリ場サイトの構想を言いました。ヤリ場サイトはWordPressで作る会員制サイトです。サイトの特徴として、最初に会員登録しないと使えないです。
Theme My Login — WordPress プラグイン
以下TMLとします。Wordpressで会員サイトを作る時によく使われるプラグインです。これを使うと。。
こんな感じであっさり会員登録画面ができます!メールアドレスを登録するだけで誰でも会員になれる優れもの。今回の目的にばっちり合っています!!
Google reCAPTCHA
TMLの会員登録画面だけど、そのままでは弱点があります。メールアドレスの入力欄と登録ボタンだけなので、いたずらでもユーザ登録し放題です。
画面のユーザ達はいたずらで登録されたユーザです。TMLの登録画面を設置した直後から、スパム(ハッカー)によるいたずらゴミユーザが際限なく増えます。というわけで、会員登録画面のセキュリティ対策が必要です。
スパムによるいたずら登録を防ぐためのセキュリティ対策がこれです!reCAPTCHAと言います。「僕はロボットではありません」をクリックすると。。
こんな感じの質問が表示される。これに正解しないと会員登録ができないのだ。このセキュリティはTMLに標準で入っていて、これを設定すればスパムによるいたずら登録は無くなります。
reCAPTCHA自体はGoogleが提供しています。Google reCAPTCHAと言います。TMLを始め多くのプラグインはGoogle reCAPTCHAを使います。解説サイトもGoogle reCAPTCHAを使う事が前提である説明が多いです。
中国ならではの事情
まず中国ではGoogleが使えないことが前提で。。
Google reCAPTCHAは使えない
中国ではGoogle reCAPTCHAは使えないです。この段階でTMLを使った会員制サイトの構想が摘みますw
ちなみに転売サイトも会員制サイトなんだけど、あっち(Paid Memberships Pro)はお金を払わないと会員登録できない作りなので、今回のTMLのようにいたずら登録されることはありません。
中国の会員制サイトはどうやっていたずら登録を阻止している?
答え⇒Googleじゃない認証機能を自前で作っています。大きく3パターンあります!
SMSでの認証
一番よく見るのがこのパターン。携帯番号を入力して青いボタンを押すと携帯電話にSMSメッセージが送信されるのだ。そこに書かれているキーを入力するというもの。
SMS認証を個人で実装するのは現実的でないのでこの方法は使えません。理由は、
- 1SMSごとにお金かかる
- 身元の保証が必要
など。
外部SNSとの連携
日本でもよくあるよね。会員登録にFacebookアカウントを使うもの。
SNSの種類が中国版になった認証です。
これも個人レベルで導入するのは難しそうだ。
完全自前の認証
例えばこんなの!パズルのピースを合わせるように下のバーをシークするのだ。これも個人レベルで作るのは無理だwこんな凝ったものじゃなくてもいいんだけどね。。
このレベルで良いw验证码というのがreCAPTCHAのこと。
reCAPTCHA認証を自作する
Form Makerを使う
何か使えそうなものは無いかなー、と探していたところ良いもの見つけた!
Form Makerを使うとこのような登録フォームが作れます!これはForm MakerのSimple Captcha機能です。当然このままじゃ使えません。Form Makerを入口としてTMLに処理を渡す必要があります。
Form MakerとTMLを合体
これが完成形です。ついでにTMLの悪い所も直します。TMLはこんな処理になっています。
ユーザが使えるようになるまで複雑で長いです。あと登録チェックがザル、っていうか無い。(それもそのはず、TMLはGoogle reCAPTCHAと一緒に使うことがほぼ必須なのだ)
Form MakerとTMLを合体させたフォームを作ってこの部分をすっきりさせます。
これが中国人向け会員サイトで、googleを使わず、しかも個人レベルで実装できるベストな形かな。今の自分のスキルではw
ちなみにCaptchaの判定はサーバ側であることが重要です。クライアントでやろうとすると判定ロジックが解析されて容易に突破されるのだw
Form MakerとTMLを合体。やり方
簡単に言うと。。
- WordPressにそれぞれのプラグインをインストールする
- TMLの設定を「ログイン方法メールアドレス」「モデレーション有り」にする
- Form Makerで「メールアドレス」「Simple Captcha」を搭載したフォームを作る
- Form Makerで作ったフォームを開いてソースコードを編集する
- →「メールアドレス」欄の名前とフォームの送信先をTMLと同じにする。あと不要なコードを削除する
- TMLの登録画面(固定ページの/register)を編集し、元の定義を消してForm Makerのソースコードを張り付ける
ざっとこんなところ。WordpressのテーマはSimplicityです。
会員登録画面まとめ
どうだろう?中国独自の事情を乗り越え、ある程度のセキュリティを持った会員登録画面を作る方法を紹介しました。
これはまだヤリ場サイトのほんの入り口でしかないです。先は長い!!
>>次のページは