Question

我正在使用PHP / jQuery并且具有以下场景：

我有一个网站（site1.php），其中包含指向另一个网站（site2.php）的链接，我还在此链接中添加了一个ajax-onclick-event，其中jQuery请求另一个网站（ ajaxcall.php）。这个其他网站有很多工作要做，所以这不是一个简短的请求。

我的目标是：在后台将请求设置为ajaxcall.php（异步）并立即转到site2.php。（我不需要回答ajaxcall.php）

我的第一个实现是这样的：

<!DOCTYPE html>
<html>
<head>
    <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
    <script type="text/javascript">
    $(document).ready(function() {
        $("#link").on("click",function(){
            $.get('./ajaxcall.php');
    </script>
</head>
<body>
    <a href="./file2.php" id="link">link</a>
</body>
</html>

显然这不起作用。因为ajax-request（异步）会在页面更改后立即中止。

据我所知，我有两种可能性：

请求同步＆amp;显示加载指示符（$.ajax({url: './ajaxcall.php',async:false});）
- ＆GT;缺点：file2.php在ajaxcall.php完成之前无法打开。
打开一个弹出窗口（window.open('ajaxcall.php')）并在那里制作一个同步ajax-request /或类似内容并在此之后自动关闭它 - ＆GT;优势：file2.php几乎可以立即打开 - ＆GT; （大）缺点：弹出
???一个更好的方法???

我希望你理解我想要完成的事情并且你可以帮助我:)。

Answer 1

试试这段代码......

$(document).ready(function() {
    $("#link").on("click",function(e){
        e.preventDefault();
        var href = this.href;
        $.get('./ajaxcall.php', function() {
            window.location.href = href;
        });
    });
});

停止执行链接（使用e.preventDefault()），获取目标网址，然后在获取请求完成后将网页重定向到该位置。

Answer 2

您是否可以通过将参数传递给ajaxcall.php来开始file2.php内的操作？所以喜欢：

file2.php?startBackgroundAction=true

<强> file2.php：

if($_GET['startBackgroundAction']) {
   include 'ajaxCall.php' // with ignore_user_abort(true)
}

Answer 3

最新的Chrome浏览器无法完成Ajax请求。由于浏览器页面收到了来自用户的新url请求，因此浏览器将立即终止该线程。

98％的情况下，您可以在网络标签中看到ajax请求被取消。

因此解决方案是使用sendBeacon API。这将异步执行POST请求。
Google Analytics（分析）使用此代码执行事件跟踪（例如：点击）。
https://developer.mozilla.org/en-US/docs/Web/API/Navigator/sendBeacon

 navigator.sendBeacon("{{url}}", param);

单击链接时发出异步ajax请求

3 个答案: