Recaptcha enterprise do not execute onSucces - recaptcha

I am trying to implement Recaptcha Enterprise for a login.
But I the onSuccess function is not been executed and I do not get an action_token.
What is missing?
I followed this: https://cloud.google.com/recaptcha-enterprise/docs/implement-tokens#action-token. In Google cloud I have set up the keys and domain.
In the header I have added the JS file:
<script src="https://www.google.com/recaptcha/enterprise.js?render=<?php echo RECAPTCHAKEY; ?>"></script>
On the page I have implemented the example:
<script>
function onSuccess(action_token) {
alert("alert");
const xhr = new XMLHttpRequest();
xhr.open('GET','login.php', false);
// Attach the action-token to the predefined request header
xhr.setRequestHeader("X-Recaptcha-Token", action_token);
xhr.send(null);
}
function onError(reason) {
alert('Response promise rejected: ' + reason);
}
grecaptcha.enterprise.ready(function () {
console.log("READY");
document.getElementById("submit").onclick = () => {
console.log("getElementById");
grecaptcha.enterprise.execute('<?php echo RECAPTCHAKEY ?>', {
}).then(onSuccess, onError);
console.log("execute");
};
});
And also a form:
<form id="login-form" ENCTYPE='multipart/form-data' method='post' action='' name='login'>...
<button type="submit" id="submit" name='submit' class="btn btn-primary"
class="g-recaptcha"
data-sitekey="<?php echo RECAPTCHAKEY; ?>"
data-callback='onSubmit'
data-action='submit'><?php echo $lan->getValue('login'); ?></button>

Related

Google recaptcha v3 recaptcha_response is null

i am using google recaptcha v3 in my website ,
here is the code i have added in my html web page in the head:
<script src="https://www.google.com/recaptcha/api.js?render=my public key"></script>
<script>
grecaptcha.ready(function () {
grecaptcha.execute('my public key', { action: 'contact' }).then(function (token) {
var recaptchaResponse = document.getElementById('recaptchaResponse');
ecaptchaResponse.value = token;
});
});
</script>
and i added this in my form :
<input type="hidden" name="recaptcha_response" id="recaptchaResponse">
but when i submit the form and try to see the content of $_POST['recaptcha_response'] with var_dump()
it is just an empty string : string(0) ""
where is the mistake ?
thanks for answers !
i tried lots of changes but everytime i get " token = null " then i try this.. 100% working....
in Your Html
<html>
<head>
</head>
<body>
<form id="contact">
<div class="col-12">
<div class="form-group">
<input type="hidden" name="captcha_token" id="recaptchaResponse" data-sitekey="YOUR-SITE-KEY">
</div>
</div>
<div class="col-12">
<button type="submit" class="btn btn-lg" id="submit-btn">
SUBMIT
</button>
</div>
</form>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>
<script src="https://www.google.com/recaptcha/api.js?onload=ReCaptchaCallbackV3&render=YOUR-SITE-KEY"></script>
</body>
</html>
after then add in your js file
$(document).ready(function(){
setInterval(function(){
ReCaptchaCallbackV3();
}, 90000);
$(document).on("submit",'#contact',function (e) {
var token = $('[name="g-recaptcha-response"]').val();
console.log(token);
});
});
var ReCaptchaCallbackV3 = function() {
grecaptcha.ready(function () {
grecaptcha.execute('YOUR-SITE-KEY', { action: 'contact' }).then(function (token) {});
});
}
In your original script you have a typo:
var recaptchaResponse = document.getElementById('recaptchaResponse');
ecaptchaResponse.value = token;
Instead of recaptchaResponse, you wrote ecaptchaResponse

How to use AJAX function in Total js?

I have a User form and I am trying to do a POST. Earlier code with schemas work. I am fitting in AJAX just now and I dont have a clue why it is not working. There is no error.
Below is code snippet from users.html file
</div>
<div class="btn" role="group">
<button type="button" name="submit" id="Submit" class="btn btn-primary" onclick="onSubmit()">Submit</button>
</div>
<div class="btn" role="group">
<input class="btn btn-warning" type="reset" value="Reset">
</div>
</form>
<script type="text/javascript">
function onSubmit() {
console.log("Ajax Testing");
AJAX('POST /users', function (value, err, response) {
if (err) { throw err };
console.log(value);
console.log(response);
});
};
</script>
Here is the routing part from default.js file
exports.install = function () {
ROUTE('GET /', displayHome);
ROUTE('GET /{userId} *userSchema --> #query');
ROUTE('GET /homepage', displayHome);
ROUTE('POST /users *userSchema --> #insert');
Below is the schema for Insert operation
schema.setInsert(function ($) {
var userDB = DATABASE('users');
userObj = {
name: $.controller.body.name,
age: $.controller.body.age,
height: $.controller.body.height,
email: $.controller.body.email,
gender: $.controller.body.gender,
cities: $.controller.body.cities,
landline: $.controller.body.telephone,
about: $.controller.body.aboutMe
};
userDB.insertOne(userObj, function (err, result) {
if (err) throw err;
console.log("Created New user using Schema Definition" + result);
$.controller.view('homepage');
}.bind($.controller));
});
Can you please let me know what is the error?
You forgot to send a data:
AJAX('POST /users/', YOUR_DATA, function (value) {
console.log(value);
});
BTW: the code is not good in your schema. You need to work with fields defined in the schema and then everything is much simpler:
schema.setInsert(function ($) {
DB('users').insertOne($.clean(), $.callback);
});
Learn from examples:
https://github.com/totaljs/emptyproject-jcomponent/
https://github.com/totaljs/emptyproject-restservice/
https://github.com/totaljs/examples/

How to save the content of a textarea using Ckeditor and CodeIgniter?

I'm using Codeigniter with Ckeditor. My problem is that when I submit the content, the data from the textarea is not stored in the database. But when I tried it again it finally did. So the situation is like I have to double click submit button to save it.
I stored the downloaded Ckeditor on a folder named ./Assests/Ckeditor(Sorry for the wrong spelling.I'll fix this later.)
Here's my form in my view folder:
ask_view.php:
<form id="form" enctype="multipart/data" method="post" onsubmit="createTextSnippet();">
<div class="form-group">
<label for="exampleInputEmail1">Title</label>
<input type="text" name ="title" class="form-control" id="title" placeholder="Title" required >
</div>
<input type="hidden" name="hidden_snippet" id="hidden_snippet" value="" />
<div class="form-group">
<label for="exampleInputEmail1">Editor</label>
<textarea name ="text" class="form-control" id="text" rows="3" placeholder="Textarea" required></textarea>
</div>
<input type="submit" class="btn " name="submit" value ="Submit" style="width: 100%;background: #f4a950;color:#161b21;">
</form>
<script src="<?php echo base_url('assests/js/editor.js')?>"></script>
<script type="text/javascript">
CKEDITOR.replace('text' ,{
filebrowserBrowseUrl : '<?php echo base_url('assests/filemanager/dialog.php?type=2&editor=ckeditor&fldr=')?>',
filebrowserUploadUrl : '<?php echo base_url('assests/filemanager/dialog.php?type=2&editor=ckeditor&fldr=')?>',
filebrowserImageBrowseUrl : '<?php echo base_url('assests/filemanager/dialog.php?type=1&editor=ckeditor&fldr=')?>'
}
);
</script>
<script type="text/javascript">
//code used to save content in textarea as plain text
function createTextSnippet() {
var html=CKEDITOR.instances.text.getSnapshot();
var dom=document.createElement("DIV");
dom.innerHTML=html;
var plain_text=(dom.textContent || dom.innerText);
var snippet=plain_text.substr(0,500);
document.getElementById("hidden_snippet").value=snippet;
//return true, ok to submit the form
return true;
}
</script>
<script type="text/javascript">
$('#form').on('submit', function (e) {
e.preventDefault();
$.ajax({
type: 'POST',
url: '/knowmore2/index.php/ask_controller/book_add',
data: $('form').serialize(),
success: function (data) {
console.log(JSON.parse(data));
}
});
});
</script>
Ask_model.php:
public function book_add($data)
{
$query=$this->db->insert('article', $data);
return $query;
}
Ask_controller.php:
public function book_add(){
$data = $_POST;
$details = array();
$details['title'] = $data['title'];
$details['content'] = $data['text'];
$details['snippet'] = $data['hidden_snippet'];
$details['createdDate']=date('Y-m-d H:i:s');
$result=$this->ask_model->book_add($details);
echo json_encode($details);
}
The content with html tags should be save in a column named content in the database, but it didn't save in the first click. It only saves on the second one,but the other data are saved in the first like the title, etc. So I get 2 rows of data, one without the content and the other with one.
Database:

Ajax submit and replace submit button with checkmark after success

First, I'm not having luck with ajax submitting at all in cakephp 1.3 environment. Once I successfully submit, I'm hoping user stays on page and submit button hidden or replaced with a checkmark. I've tried a few things... controller without $action and then .click function instead of on submit. I'm also not versed in debugging js to see where it might be wrong so any suggestions are welcome.
Maybe "update_a" is the $action within my dashboard controller
"function applications($action) {" instead?
dashboard controller
function update_a($action) {
...
switch ($action) {
case 'save':
if (!empty($this->data)) {
// update fields in database table matching model
$this->data['Model']['submitted'] = $_POST['submitted'];
$this->data['Model']['locked'] = $_POST['locked'];
if ($this->Model->save($this->data)) {
// save form fields to other models
$this->OtherModel->saveField('form_status_id',$_POST['form_status_id']);
$this->OtherModel->saveField('form_status',$_POST['form_status']);
}
}
}
break;
default:
//$this->redirect("admin/index");
$this->render("dashboard/applications");
break;
} //case
} // end function
html
<body>
<form id='update_a' action='save'>
<div class='form-group'>
<input type='hidden' class='hidden' name='locked' id='locked' value='1'>
<input type='hidden' class='hidden' name='form_status' id='form_status' value='Locked'>
<input type='hidden' class='hidden' name='form_status_id' id='form_status_id' value='3'>
<input type='hidden' class='hidden' name='submitted' id='submitted' value='<?php echo date("Y-m-d G:i:s") ?>'>
</div>
<div class='text-center'>
<input name='submit' type='button' class='btn btn-default' value='Submit Form A'>
</div>
</form>
</body>
<script>
$(document).ready(function () {
$('#update_a').on('submit', function (e) {
//$('#update_a').click(function (e) {
e.preventDefault();
$.ajax({
type: 'POST',
url: '/dashboard/update_a',
data: $('#update_a').serialize(),
success: function () {
alert('Form A has been submitted and locked for editing');
$('#update_a').hide();
},
error : function() {
alert("Error");
}
});
return false;
});
});
</script>

How to submit form using ajax inside wordpress plugin

I am creating small plugin where i want to submit form data using ajax but it giving response zero.
Here is my call i have added all code in a single file for the time being
file name :index.php
<?php wp_enqueue_script("jquery");?>
<?php
function myaddgallery(){
global $wpdb;
echo "abac";
}
add_action('wp_ajax_myaddgallery' , 'myaddgallery');
add_action('wp_ajax_nopriv_myaddgallery' , 'myaddgallery');
?>
<script type="text/javascript">
jQuery(document).ready(function(){
jQuery('#shaGalleryForm').submit(function(e){
// prevent normal submit behaviour
e.preventDefault();
var name = jQuery("#shaGalleryName").val();
alert(name);
//var postData = jQuery("#shaGalleryForm").serialize();
//console.log(postData);
var name = "shalu";
jQuery.ajax({
type: "POST",
url: "http://localhost/plugindevelop/wp-admin/admin-ajax.php",
data : {action: "myaddgallery", name : name},
success: function(response){
//console.log(postData);
console.log("added success");
alert(response);
},
error: function(data){
console.log("fail");
}
});
});
}) ;
</script>
<div class='wrap'>
<h2>Add Gallery</h2>
<p>This is where from you can create new gallery</p>
<form name="shaGalleryForm" id="shaGalleryForm" method="post">
<table class="form-table">
<tr>
<th>Gallery Name</th>
<td>
<input type="text" id="shaGalleryName" name="shaGalleryName">
<p class="description">Add gallery name also please avoid special character</p>
</td>
</tr>
</table>
<p class="submit">
<input type="submit" value="Save" id="shaSaveGallery" name="shaSaveGallery" class="button button-primary">
</p>
</form>
</div>
Try to add die() after you echo the data
function myaddgallery(){
global $wpdb;
echo "abac";
die();
}

Resources