如何使 <a href> 发出其 GET 请求而不重定向？答案

【问题标题】：How can I make <a href> make its GET request without redirecting?如何使 <a href> 发出其 GET 请求而不重定向？
【发布时间】：2015-12-21 13:30:57
【问题描述】：

一些背景：我正在使用 Bigcommerce（它不支持 PHP）来设计店面，并希望允许用户在结帐页面内添加产品将他们重定向到购物车页面。我知道这是可能的，因为在首页上，有一些预编程的按钮，它们只是 <a href="http://somestore.com/cart.php?action=add&product_id=9001"> 标签，带有一些类似按钮的样式。这些拉出一个模式，最重要的是将产品添加到购物车 - 两者都没有重定向。

所以起初这让我觉得这是一个简单的问题 - 只需 $.ajax 到页面并完成它，但后来我遇到了旧的 Access-Control-Allow-Origin 错误，这很奇怪，因为我正在编写我的 Javascript在我尝试访问的同一个域上，只有子域不同（/cart vs /checkout）。我决定深入研究这个神奇按钮发出的请求。我自己的功能失调版本的此请求中唯一不存在的请求标头是X-Requested-With，我当然尝试将其添加到我的XMLHttpRequest，但未成功。

我注意到的第二件事是一个额外的 URL 参数，它最初没有在源代码中列出，fastcart=1 所以我尝试添加它，然后被带到一个我显然不打算看到的 PHP 页面。它很容易大约 200 行意大利面，我不确定我可以在这里发布。很明显，某处的脚本正在使用此href 并使用它来发出 GET 请求，但是如何？我尝试了XMLHttpRequest 和ajax，但都给了我Access-Control-Allow-Origin 响应。

我已经看到使用一种技术，您可以通过向其添加 .click(function(e) 并调用 return false 或 e.preventDefault(); 来禁止在 <a href> 上重定向页面，但这些根本不让我的<a href> 完成任何事情，更不用说一些忍者GET 的请求了。我的问题最终是关于为什么我自己尝试对这个页面的 GET 请求失败了，而一个简单的 <a href> 已经能够绕过 SOP 并几乎秘密地发出请求。

显然，我将不得不花更多时间查看我被额外参数带到的 PHP 脚本。然而，事实证明这比我最初想象的要神秘得多，一路上教会了我很多东西。不幸的是，我还没有解决它，我真的需要让这个功能正常工作。如果这些请求的来源对我有帮助，我会很高兴，但现在我已经没有时间了，必须休息一下。如果有更多Web开发经验的人可以提供帮助，我将非常感激！

【问题讨论】：

有些东西没有加起来，如果你在同一个域上，你不能得到 Access-Control-Allow-Origin 问题。有些东西必须不同（主机后面的 /cart不应该有所作为）
如果这是他们不支持的东西，我怀疑'黑客'一种使其工作的方法会受到赞赏。如果这对您很重要，那么这不是适合您的平台 - 还有很多其他平台
Saar，你说得对，我看看有没有漏掉的前缀。 Dagon，由于该功能已经在第一页上可用，我认为我不会真正称其为“黑客”，我理解这种情绪，但我认为 Bigcommerce 不会因为启用更多用户而敲门我-通过减少不必要的重定向来获得友好的体验。将商品添加到购物车是一个简单的获取请求。有什么害处？
他们有一个庞大的支持论坛。询问他们是否有意义

标签： javascript php ajax get xmlhttprequest

【解决方案1】：

您不必使用<a> 标记，您所要做的就是在要用于将商品添加到购物车的任何元素上添加一个事件侦听器。例如，下面是一个按钮的代码，它将把 id# 9001 的产品添加到购物车中。

<style>
    .button {
        display: table-cell;
        width: 200px;
        height: 75px;
        color: #fff;
        background: #000;
        text-align: center;
        vertical-align: middle;
        cursor: pointer;
    }
</style>

<div class="button">Click Me</div>

<script type="text/javascript">
    $('.button').click(function () {
        $.ajax({type: 'GET', url: '/cart.php?action=add&product_id=9001'});
    });
</script>

基本上，制作您想要的元素，按照您的喜好设置样式，然后添加一个.click() 监听器。

只需将产品 ID 替换为您要添加的商店中的产品编号即可。

【讨论】：