JavaScript 根据用户的 IP 地址更改 href 链接 url答案

【问题标题】：JavaScript changes a href link url based on user's IP addressJavaScript 根据用户的 IP 地址更改 href 链接 url
【发布时间】：2015-03-13 02:54:02
【问题描述】：

希望有人可以帮助解决这个问题。

我正在寻找简单的 JavaScript 代码，该代码将根据访问请求所来自的 IP 地址更新 a href 链接 url 并将其显示在静态 HTML 页面上。

好消息是 - IP 将是静态且固定的，它会是相同的数字，我已经拥有了。

也就是说，如果我从不同的IP地址访问同一个页面，该页面将显示不同的链接url。

虽然我可能错了，但我的理解是这可以使用“if else”逻辑编写脚本——如果检测到并匹配特定的 IP 地址，JS 会重写链接地址。

下面是我的逻辑。抱歉，我不太了解 JavaScript 语法，并使用下面的构造作为假设示例（它可能完全是一个残骸，因为我没有使用正确的语法等等），但这应该给出一般的想法：

**if (location.referrer.ip('123.45.67.89.00') > -1)**

**document.write.href = 'xxx.com';**

**else if (location.referrer.ip('123.98.76.54.00') > -1)**

**document.write.href = 'yyy.com';**

**else**

**document.write.href = 'zzz.com';**

据我了解，由于我将在公式中使用单个 IP 地址，因此可以省略以下代码：

**else if (location.referrer.ip('123.98.76.54.00') > -1)**

**document.write.href = 'yyy.com/';**

只留下这样的东西

**if (location.referrer.ip('123.45.67.89.00') > -1)**

**document.write.href = 'xxx.com';**

**else**

**document.write.href = 'zzz.com';**

同样，这可能不是完全正确的方法，需要更复杂的解决方案，因此我希望你们中的一些具有编码专业知识的人可以提供一些帮助。需要明确一点 - 脚本不应重定向页面，而应仅更新其上显示的链接后面的 url。

我知道已经有几种技术可以提供解决方案，但我的任务是让它在浏览器的客户端运行；我不允许使用 Dot.NET、ASP、JSP 等服务器端技术或 JavaScript 和静态 html 以外的任何其他技术。

如果可以这样做，有人可以建议吗？基本上，我只需要知道我上面描述的方法是否可行，如果可行，'if' 和 'else' 行的语法是什么。

非常感谢任何帮助，谢谢！

【问题讨论】：

第一步是获取客户端的IP地址。你有没有弄清楚那部分？如果获取不到ip地址，剩下的逻辑就没用了。
基本上，我们需要知道在将您的逻辑转换为实际代码的过程中，您卡在了哪里。如果您希望我们采用您的逻辑并编写一个完整的程序，stackoverflow 不适合您。

标签： javascript html hyperlink href

【解决方案1】：

我今天去寻找相同问题的答案，但找不到任何东西。经过一番修改，我想出了一个解决方案并在此站点上注册只是为了分享它。

在我的特殊情况下，我正在构建我的网站以根据 IP 提供不同的 href，但更具体地说，它是本地 IP (192.168.x.x) 还是外部 IP。目的是规避 NAT 环回问题（本地连接到同一个 IP 时无法访问外部 IP 地址）

首先，我们将使用 php，因此将文件从扩展名 .html 重命名为 .php，然后将其添加到代码中的任何位置，并将 IP 替换为您正在搜索的任何 IP

<?php
$ipaddress = getenv('REMOTE_ADDR');
if (fnmatch("192.168.*", $ipaddress)) {
  echo '<a href="http://192.168.2.40:8080">This button is for local IP</a>';
  $link = 'http://192.168.2.40:8080';
} else {
  echo '<a href="http://www.myddns.com:8080">This button is for external IP</a>';
  $link = 'http://www.myddns.com:8080';
}
?>

我注意到的一件奇怪的事情是，我不能让链接成为上述 php 标记内的图像，所以我通过在后面添加这个来解决这个问题：

<a href="<?php echo "$link";?>"><img src="image/pic.png" onmouseover="this.src='image/picMouseOver.png'" onmouseout="this.src='image/pic.png'" border="0" alt="Link"></a>

请注意，当加载到适当的网络服务器时，此代码可以正常工作，但如果只是双击并直接在 chrome 中进行测试，它将无法正常工作。请注意这一点（即您必须将其放在您的网络服务器上或安装 php for windows 来测试它）

这回答了你的问题……但在相关说明中，我想分享其他内容。

所以我有多个域链接到同一个站点，但希望链接指向您最初访问的同一个域。因此，出于这个原因，我被困在使用相对链接而不是完整 URL（即，如果您从 www.website1.com 找到该网站，按钮不会将您发送到 www.website2.com\link.html）

我想弄清楚如何建立到不同端口的相对链接，但了解到如果不对域进行硬编码，就无法做到这一点。因此，我将上面的操作与此处的说明结合起来： Relative URL to a different port number in a hyperlink?

并在页面加载后编写此方法来更改 URL，因此将鼠标悬停在链接上或执行“复制链接位置”将获得带有端口号的更新 URL：

<html>
<head>
<script>
function setHref1() {
document.getElementById('modify-me').href = window.location.protocol + "//" + window.location.hostname + ":32400/web/index.html";
}
</script>

<?php
$ipaddress = getenv('REMOTE_ADDR');
if (fnmatch("192.168.*", $ipaddress)) {
//  echo '<a href="http://192.168.2.40:8080">This button is for local IP</a>';
  $link = 'http://192.168.2.40:8080';
  $id = '';
} else {
//  echo '<a href="http://www.myddns.com:8080">This button is for external IP</a>';
  $link = 'http://www.myddns.com:8080';
  $id = 'modify-me';
}
?>

</head>

<body onload="setHref1()">

<a href="<?php echo "$link";?>" id="<?php echo "$id";?>" ><img src="image/pic.png" onmouseover="this.src='image/picMouseOver.png'" onmouseout="this.src='image/pic.png'" border="0" alt="Link"></a>

</body> 
</html>

编辑：您可能还会发现显示访问者 IP 地址的代码很有趣：

<html>
<head>
 <title>What is my IP address?</title>
</head>
<body>
<?php

    if (getenv('HTTP_X_FORWARDED_FOR')) {
        $pipaddress = getenv('HTTP_X_FORWARDED_FOR');
        $ipaddress = getenv('REMOTE_ADDR');
echo "Your Proxy IP address is : ".$pipaddress. "(via $ipaddress)" ;
    } else {
        $ipaddress = getenv('REMOTE_ADDR');
        echo "Your IP address is : $ipaddress";
    }
?>
</body>
</html>

来源：http://www.cyberciti.biz/faq/how-to-determine-retrieve-visitors-ip-address-use-php-code-programming/

【讨论】：