How to redirect after reCAPTCHA verification? - javascript

I am using Google reCAPTCHA on my site. If the captcha is success I want to redirect to another website.
The code I used is:
<script src="https://www.google.com/recaptcha/api.js" async defer></script>
<script type="text/javascript">
if (grecaptcha.getResponse() == "success") {
function Redirect() {
window.location = "example.com";
}
document.write("You will be
redirected to a new page in 5 seconds "); setTimeout('Redirect()',
1000);
}
} else {
alert("You can't proceed!");
</script>
<body>
<div data-type="image" class="g-recaptcha" data-sitekey="public site key"></div>
</body>
But it's not working.
Edited
I just don't understand JavaScript much . That's why I was asking and still don't understand it .
What it means and what does I have to do with it. https://www.google.com/recaptcha/api/siteverify
Can you give me an example of whole code

First thing is if you want to redirect use window.location.href = "example.com" and second you are showing user that page will redirect in 5 seconds but you are only setting 1 seconds time and third don't call the function in setTimeout only pass the function as callback to it. And please write this entire code as recaptcha's callback so that it can be called when recaptcha gets verified from server.
<script src="https://www.google.com/recaptcha/api.js" async defer></script>
<script type="text/javascript">
if (grecaptcha.getResponse() == "success") {
function Redirect() {
window.location.href = "example.com"; // Correct here
}
document.write("You will be redirected to a new page in 5 seconds ");
setTimeout(Redirect,5000); // Correct here
}
else alert("You can't proceed!");
</script>
<body>
<div data-type="image" class="g-recaptcha" data-sitekey="public site key"></div>
</body>

Related

How to redirect after success in recaptcha

I am trying to redirect the person to a location after captcha attempt is successful . I used this code , but this is not working.
<script src="https://www.google.com/recaptcha/api.js" async defer></script>
<script type="text/javascript">
if (grecaptcha.getResponse() == "success")
{
function Redirect()
{
window.location.href = "example.com";
}
setTimeout(Redirect,1000);
}
else alert("You can't proceed!");
</script>
<div data-type="image" class="g-recaptcha" data-sitekey="my-sitekey"></div>
I think it's not working because I don't understand https://www.google.com/recaptcha/api/siteverify the api. Can you give an example of the code? I want to redirect after example.com after recaptcha success , else send him "You can't proceed"
The problem is, when the recaptcha returns 'success' you are creating a function called Redirect but you are not calling it, so you have to call the function after create it:
<script src="https://www.google.com/recaptcha/api.js" async defer></script>
<script type="text/javascript">
if (grecaptcha.getResponse() == "success") {
function Redirect() {
window.location.href = "https://www.youtube.com/";
}
Redirect()
setTimeout(Redirect, 1000);
} else alert("You can't proceed!");
</script>
<div data-type="image" class="g-recaptcha" data-sitekey="my-sitekey"></div>
Or you can delete the function and redirect directly
Make sure you are adding the full url:
<script src="https://www.google.com/recaptcha/api.js" async defer></script>
<script type="text/javascript">
if (grecaptcha.getResponse() == "success") {
window.location.href = "https://www.youtube.com/";
setTimeout(Redirect, 1000);
} else alert("You can't proceed!");
</script>
<div data-type="image" class="g-recaptcha" data-sitekey="my-sitekey"></div>

How to setInterval on php?

echo '
<script type="text/javascript">
setInterval( myfunction , 1000);
myfunction(){
window.location = "../index.php";
}
</script>';
if I'm just call window.location = "../index.php" without setInterval it really works I have seen many codes but no one can help me thank you.
If you want to redirect or reload webpage after certain amount of time then event can only be triggered form the client side. You can achieve this using java script and html meta tags.
1: Using HTML
<meta http-equiv="refresh" content="0";url=http://www.domain.com/new-page.html">
you can set the value of content to the time
2: Using Javascript
<script type="text/javascript">
setInterval(function(){
window.location = "../index.php";
} , 1000);
</script>
Redirect the page after 1 second. It runs one time
<script type="text/javascript">
setTimeout(function(){
window.location = "../index.php";
}, 1000);
</script>
If you write in php, use it
<?php
//code here
?>
<script type="text/javascript">
setTimeout(function(){
window.location = "../index.php";
}, 1000);
</script>
<?php
//code here
?>
or use setInterval instead of setTimeout

Paypal lightbox: does not permit cross-origin framing

I have attempted to go about the use of Paypal Lightbox a bit differently.
I have used a button to trigger an ajax call which then generates the PayKey and if all goes well then triggers the form (from the documentation) to be created and submitted.
When i click the button the lightbox html is created but the content is not loaded into it. Instead i get the error:
Load denied by X-Frame-Options: https://www.sandbox.paypal.com/us/cgi-bin/webscr?cmd=_dispatch-failed does not permit cross-origin framing.
My Code:
<head>
<script src="https://www.paypalobjects.com/js/external/dg.js" type="text/javascript"></script>
</head>
External Script:
$("#checkout").click(function() {
var id = $(this).data("id");
if(id) { pay(id); }
});
function pay(id) {
$.ajax({
url : 'paypal/Pay-Chained.php',
type : 'POST',
data : "id="+id,
success : function (data) {
var info = (JSON.parse(data));
if (info['Type'] == 'Success') {
var output = info['URL'].substr(0, 64) + "expType=light&" + info['URL'].substr(64);
$("body").append('<form action="'+output+'" target="PPDGFrame" class="standard"><input type="submit" id="submitBtn"></form>');
$("#submitBtn").click();
} else {
alert("Error: Please try again or contact support.");
}
},
error : function () {
alert("Error: Please try again.");
}
});
}
At the bottom of the buttons page:
<script type="text/javascript" charset="utf-8">
var embeddedPPFlow = new PAYPAL.apps.DGFlow({trigger: 'checkout'});
</script>
I am thinking maybe it has to do with the order things are executed but can't seem to figure it out. Any help would be great!
EDIT: I just created a blank page and copied the script from the documentation exactly. I still get the same error. Might it have something to do with server settings? I am running a WampServer with an address like 192.168.1.1/mysite/index.html.

How to Convert Maxmind Geoip1 javascript script to Geoip2

Using the first Geoip I was using a simple Javascript code (as seen below), but I've been trying all day to figure out what I need to do to have the script recognise the country code for Maxmind Javascript Geoip2.
The Original GEOip code
<script type="text/javascript">
var user_country = geoip_country_code();
if(user_country == "US")
document.write(hockeyAds[4]);
else
document.write(hockeyAds[5]);
</script>
What I have in the new header
<script type="text/javascript" src="//j.maxmind.com/js/apis/geoip2/v2.0/geoip2.js"></script>
The latest code that I have attempted to use.
<script type="text/javascript">
var user_country = geoip2.cityISPOrg.country.iso_code();
if(user_country == "US")
document.write(hockeyAds[4]);
else
document.write(hockeyAds[5]);
</script>
Below on the same page I have tried this script that someone made and I was able to get it to type out the correct country code. So I am convinced that it is a problem with the above javascript code.
<script>
geoip2.cityISPOrg(function (response) {
$("#usercountry").html(response.country.iso_code);
});
</script>
<p>
<span id="usercountry"></span>
</p>
Not really all the great with understanding Javascript.
Thanks
You need to pass success and error callbacks to the geoip2 methods. Try this:
geoip2.country(
function (response) {
if (response.country.iso_code === "US") {
document.write(hockeyAds[4]);
} else {
document.write(hockeyAds[5]);
}
},
function (error) {
// handle error
}
);
Also, this tutorial might help you understand the API: http://dev.maxmind.com/geoip/geoip2/javascript/tutorial/

Javascript not working in JQuery loaded DIV

I load pages into a div , my question is i cant execute javascript code in page1.php.. How can i execute code when i load page in to div.. thanks for your help..
here is my codes
index.php :
<script language="JavaScript" type="text/javascript">
function swapContent(cv) {
$("#content").html('<img class="loader" src="images/loader.gif"/>').show();
var url = "load.php";
$.post(url, {contentVar: cv} ,function(data) {
$("#content").html(data).show();
});
}
</script>
Button1
Button2
<div id="content"></div>
load.php :
<?php
if(isset($_GET['contentVar']))
{
$contentVar = $_GET['contentVar'];
}else{
$contentVar = $_POST['contentVar']; }
if ($contentVar == "page1") {
include("page1.php");
} else if ($contentVar == "page2") {
include("page2.php");
}
and example for page1.php
<script type="text/javascript" src="nicEdit.js"></script>
<script type="text/javascript">
bkLib.onDomLoaded(function() { nicEditors.allTextAreas() });
</script>
<textarea name="message" id="message" cols="45" rows="5"></textarea>
Data returned from Ajax is treated like plain text, so any Javascript within it is not executed by default. See this article.
Try using .load() instead of $.post() :
function swapContent(cv) {
$("#content").html('<img class="loader" src="images/loader.gif"/>').show();
var url = "load.php";
$("#content").load(url, {contentVar: cv});
}

Categories