Question

我想将reCaptcha集成到一个网站中，感到有些困惑，因为它正在工作。

这是我的配置方式：

在头部添加了此代码：

const w = 1000;
const h = 550;
const padding = 50;
const barPadding = 0.5;
 d3.json(
  "https://raw.githubusercontent.com/freeCodeCamp/ProjectReferenceData/master/GDP-data.json",
  json => {
    const minDate = d3.min(json.data, d => d[0]);
    const maxDate = d3.max(json.data, d => d[0]);
    const max = d3.max(json.data, d => d[1]);

    const xScale = d3
      .scaleTime()
      .domain([new Date(minDate), new Date(maxDate)])
      .range([padding, w - padding]);

    const yScale = d3
      .scaleLinear()
      .domain([0, max])
      .range([h - padding, padding]);

    const tooltip = d3
      .select("#container")
      .append("div")
      .attr("id", "tooltip")
      .style("width", padding);

    const svg = d3
      .select("#container")
      .append("svg")
      .attr("width", w)
      .attr("height", h);

    svg
      .selectAll("rect")
      .data(json.data)
      .enter()
      .append("rect")
      .attr("x", (d, i) => xScale(new Date(d[0])))
      .attr("y", d => yScale(d[1]))
      .attr("width", w / json.data.length - barPadding)
      .attr("height", d => h - yScale(d[1]) - padding)
      .attr("class", "bar")
      .attr("data-date", d => d[0])
      .attr("data-gdp", d => d[1])
      .on("mouseover", (d, i) => {
        console.log(d[0]);
        tooltip
          .style("visibility", "visible")
          .style("top", `${yScale(d[1])}px`)
          .style("left", `${xScale(new Date(d[0])) - padding}px`)
          .attr("data-date", d => d[0])
          .html(`${d[0]} <br/> $${d[1]} Billion`);
      })
      .on("mouseout", () => tooltip.style("visibility", "hidden"));

    const xAxis = d3.axisBottom(xScale);
    const yAxis = d3.axisLeft(yScale);

    svg
      .append("g")
      .attr("transform", `translate(0, ${h - padding})`)
      .attr("id", "x-axis")
      .call(xAxis);

    svg
      .append("g")
      .attr("transform", `translate(${padding}, 0)`)
      .attr("id", "y-axis")
      .call(yAxis);
  }
);

在页面加载时使用此代码获取reCaptcha响应

<script src='https://www.google.com/recaptcha/api.js?render=SITE_KEY></script>

使用此代码验证验证码响应

<script>
grecaptcha.ready(function() {
grecaptcha.execute('SITE_KEY', {action: 'register'})
.then(function(token) {
  jQuery('#recaptcha').val(token);
});
});
</script>

这对我来说似乎很好，我的要求得到0.9分。

问题： 假设由于任何原因，验证码因有效的用户请求而失败（例如ip被用作垃圾邮件或任何其他Google验证检查失败）。但是用户是合法的，所以：

如果用户加载注册表并参加其他活动，则该用户会在一段时间（例如10分钟）后回来。当用户尝试提交表单时，验证码检查将失败。（我尝试过此操作，并返回“超时或重复”错误）
有什么方法可以在不重新加载页面的情况下重新加载验证码？

请让我知道，如何克服这些问题？

Answer 1

添加reCAPTCHA V2和V3。如果V3失败。使用V2验证用户。

与Google reCaptcha v3相关的问题

1 个答案: