ピックアップ記事
WordPressプラグイン「bbPress」に不具合、ログイン機能が正常に動作しない場合の対応、修正方法

WordPressプラグイン「bbPress」に不具合

やりたかったこと

まず、私がやりたかったこと。

それは、固定ページにログインページを作成し、そこからのログイン。

 

固定ページには、bbPressのショートコードである、「bbp-login」を使用している。

 

環境

使用しているプラグインは、「bbPress」のほか、ajaxでのログインなどを可能にする「bbPress forum utility pack」も使用しています。

おそらく、これも不具合に関連していそうです。

 

不具合内容

ログインができず、以下のようなメッセージが返ってきた。

 

エラー:パスワードを入力してください。
エラー:ユーザー名を入力してください。

 

もちろん、ユーザ名もパスワードも入力していますが、値が取得できていないようです。

 

しかし、これは固定ページで作成したログインページだけの話で、どうやらウィジットから追加したログインページからはログインできるようです。

ウィジットでの表示のみも考えましたが、理想の形と違っていたため、この問題をなんとか解決しようと考えました。

 

調査

調べてみると、同じような不具合に悩まされている人を発見しましたが、

「ウィジットに表示したログインページと両方を表示されている場合にログインできない」

というようなことを書かれていました。

おそらく、私と同じ状態なのだと思います。

解決法を提案している人はいなかったため、自身で探すしかなさそうです。

 

まずはJavascriptで書かれたコードを確認します。

Ajaxによるログインということなので、おそらくjavascript内でユーザ名、パスワードの取得がうまくいっていないためです。

 

結果、この辺りが怪しいことに気づきました。

<script type="text/javascript">
window.bbpajax = {};
BBPAjax_extparm = function() {
    const params = window.bbpajax['params'];
    const selector = window.bbpajax['selector'];
    const items = document.querySelectorAll( selector );
    for (let i = 0; i < items.length; i++) {
        if(items[i].name && items[i].name != 'g-recaptcha-response'){
            if(items[i].type == 'checkbox'){
                params[ items[i].name ] = (items[i].checked != false)? 1 : 0;
            } else {
                params[ items[i].name ] = items[i].value;
            }
        }
    }
    const recaptcha = document.querySelectorAll( "*[name='g-recaptcha-response']" );
    for (let i = 0; i < recaptcha.length; i++) {
        if(recaptcha[i].textLength > 0){
            params[ recaptcha[i].name ] = recaptcha[i].value;        
            break;
        }
    }
    return params;
}
BBPAjax_submit = function( params ) {
    jQuery.ajax({ type: 'POST', url: 'https://share.took.jp/wp/wp-admin/admin-ajax.php', dataType: 'json', 
        data : params, 
    }).then(
        function (response, dataType) {
            if(typeof renderInvisibleReCaptcha !== "undefined"){
                grecaptcha.reset();
            }
            let result = window.bbpajax['success'];
            if(response.data.result !== result.code){
                result = window.bbpajax['error'];
            }
            if(result.msg != null)
                jQuery( result.msg ).html(response.data.info);
            if(result.action == 'redirect')
                window.location.href = response.data.info;
        },
        function () {
            if(typeof renderInvisibleReCaptcha !== "undefined"){
                grecaptcha.reset();
            }            
            //alert("ajax response error");
        }
    );    
}
</script>
<script type="text/javascript">
WPCustomLogin = function(nonce, is_widget, redirect, lostpass){
    window.bbpajax['params'] = { action: "custom_login", _ajax_nonce: nonce, redirect_to:redirect, lostpass:lostpass,};
    window.bbpajax['selector'] = (is_widget)? ".bbp_widget_login > form.bbp-login-form input" : ".bbpress-wrapper form.bbp-login-form input";
    window.bbpajax['success'] = { code:'login_redirect', msg: null, action: 'redirect' };
    window.bbpajax['error'] = { code: 'e_login', msg: '.custom-login-info', action: null };
    
    if(typeof renderInvisibleReCaptcha !== "undefined"){
    	grecaptcha.execute();
    } else {
        BBPAjax_submit( BBPAjax_extparm() );
    }
    return false; 
};
//# sourceURL=http://localhost/wordpress/bbp_custom_login.js
</script>                

 

そして、今回の不具合の犯人はこいつ。

上記のコードだと5行目あたりに当たるでしょうか。

const selector = window.bbpajax['selector'];
const items = document.querySelectorAll( selector );

 

selectorという定数の中身を確認してみると、

.bbp_widget_login > form.bbp-login-form input

これでは、ウィジットのログインフォームしか動作しませんね。

 

修正するにはselectorを

form.bbp-login-form input

に変更すれば、動作しそうです。

 

修正方法

少し強引な方法ですが、私はひとまず、このように対応しました。

 

footerに以下をスクリプトを挿入します。

<script type="text/javascript">
window.bbpajax = {};
BBPAjax_extparm = function() {
    const params = window.bbpajax['params'];
//     const selector = window.bbpajax['selector'];
	 const selector = "form.bbp-login-form input";
    const items = document.querySelectorAll( selector );
    for (let i = 0; i < items.length; i++) {
        if(items[i].name && items[i].name != 'g-recaptcha-response'){
            if(items[i].type == 'checkbox'){
                params[ items[i].name ] = (items[i].checked != false)? 1 : 0;
            } else {
					console.log("name:" +  items[i].name + "     value:" +  items[i].value)
                params[ items[i].name ] = items[i].value;
            }
        }
    }
    const recaptcha = document.querySelectorAll( "*[name='g-recaptcha-response']" );
    for (let i = 0; i < recaptcha.length; i++) {
        if(recaptcha[i].textLength > 0){
            params[ recaptcha[i].name ] = recaptcha[i].value;        
            break;
        }
    }
    return params;
}
BBPAjax_submit = function( params ) {

    jQuery.ajax({ type: 'POST', url: 'https://share.took.jp/wp/wp-admin/admin-ajax.php', dataType: 'json', 
        data : params, 
    }).then(
        function (response, dataType) {
            if(typeof renderInvisibleReCaptcha !== "undefined"){
                grecaptcha.reset();
            }
            let result = window.bbpajax['success'];
			console.log(result)
			console.log(response)
            if(response.data.result !== result.code){
                result = window.bbpajax['error'];
            }
            if(result.msg != null)
                jQuery( result.msg ).html(response.data.info);
            if(result.action == 'redirect')
                window.location.href = response.data.info;
        },
        function () {
            if(typeof renderInvisibleReCaptcha !== "undefined"){
                grecaptcha.reset();
            }            
            alert("ajax response error");
        }
    );    
}

WPCustomLogin = function(nonce, is_widget, redirect, lostpass){
	is_widget = 1;
    window.bbpajax['params'] = { action: "custom_login", _ajax_nonce: nonce, redirect_to:redirect, lostpass:lostpass,};
    window.bbpajax['selector'] = (is_widget)? ".bbp_widget_login > form.bbp-login-form input" : ".bbpress-wrapper form.bbp-login-form input";
    window.bbpajax['success'] = { code:'login_redirect', msg: null, action: 'redirect' };
    window.bbpajax['error'] = { code: 'e_login', msg: '.custom-login-info', action: null };
    
    if(typeof renderInvisibleReCaptcha !== "undefined"){
    	grecaptcha.execute();
    } else {
        BBPAjax_submit( BBPAjax_extparm() );
    }
    return false; 
};
//# sourceURL=http://localhost/wordpress/bbp_custom_login.js
</script>

 

URLについては、自身のサイトに置き換えてみてください。

ひとまずは、これで解決ということにして、しっかりとした修正は公式が出してくれるのを待とうと思います。

 

ただ、この方法だとウィジットにもログインを表示させたい場合には、動作しないため、修正が必要です。

 

関連の書籍

created by Rinker
¥2,417 (2020/09/30 06:41:47時点 楽天市場調べ-詳細)
おすすめの記事