如果我不知道主机名,是否有没有Javascript /服务器端脚本链接到同一个盒子上不同端口号的方法?超链接中不同端口号的相对URL?
如:
<a href=":8080">Look at the other port</a>
(这个例子简化版,工作,因为它只会对待:8080作为字符串我希望导航)
如果我不知道主机名,是否有没有Javascript /服务器端脚本链接到同一个盒子上不同端口号的方法?超链接中不同端口号的相对URL?
如:
<a href=":8080">Look at the other port</a>
(这个例子简化版,工作,因为它只会对待:8080作为字符串我希望导航)
这将是很好,如果这可以工作,我不明白为什么不能这样做,因为:
是URI组件内部用于端口分离的保留字符,因此浏览器可以真实地将其解释为相对于此URL的端口,但不幸的是,它并没有办法让它去做。
因此您需要使用Javascript才能做到这一点;
// delegate event for performance, and save attaching a million events to each anchor
document.addEventListener('click', function(event) {
var target = event.target;
if (target.tagName.toLowerCase() == 'a')
{
var port = target.getAttribute('href').match(/^:(\d+)(.*)/);
if (port)
{
target.href = port[2];
target.port = port[1];
}
}
}, false);
测试在Firefox 4
小提琴:http://jsfiddle.net/JtF39/79/
更新:固定用于附加端口来结束URL的错误,并且还加入用于相对和绝对URL以支持被追加到最后:
<a href=":8080/test/blah">Test absolute</a>
<a href=":7051./test/blah">Test relative</a>
所以如果没有JavaScript,那么没有真正的解决方案 – 2011-05-16 11:13:39
没有Javascript没有办法做到这一点。 – 2011-05-16 11:53:54
这在Safari 6中无法正常工作。问题是你没有从相对URL中删除端口,所以你最终得到'http:// myhost:8080 /:8080'作为'href =“ :8080" '。你可以在'target.port = port [1];下面加上这一行来解决这个问题。 'target.href = target.href.replace(“/:”+ target.port,“”);'(这不是一个完美的解决方案,因为它是一个查找/替换,但它适用于你不是的简单情况担心网址中的端口字符串。) – zekel 2012-09-26 14:35:49
如果没有JavaScript,您将不得不依赖某些服务器端脚本。例如,如果您使用ASP,如...
<a href="<%=Request.ServerVariables("SERVER_NAME")%>:8080">Look at the other port</a>
应该工作。但是,确切的格式将取决于您使用的技术。
这些怎么样:
修改端口号点击:
<a href="/other/" onclick="javascript:event.target.port=8080">Look at another port</a>
然而,如果你将鼠标悬停在链接上,它并没有显示出与包括新的端口号的链接。直到你点击它才会添加端口号。另外,如果用户右键单击该链接并执行“复制链接位置”,则它们将获得未经修改的URL,而不包含端口号。所以这并不理想。
这里只是在页面加载后更改URL的方法,所以将鼠标悬停在链接或做“复制链接位置”,将获得与端口号更新网址:
<html>
<head>
<script>
function setHref() {
document.getElementById('modify-me').href = window.location.protocol + "//" + window.location.hostname + ":8080/other/";
}
</script>
</head>
<body onload="setHref()">
<a href="/other/" id="modify-me">Look at another port</a>
</body>
</html>
您的第一个解决方案适用于我的情况 - 谢谢。 – 2012-11-24 15:35:41
感谢您指出我注意到的警告。在我的情况下,警告并不重要,我更喜欢第一个解决方案的简单性。我几乎可以肯定,我已经提出了你的答案,但软件似乎并不认为,并且该软件的内存可能比我的更可靠。我已经upvoted它(再次??)。 – 2012-11-26 23:24:30
我解决了这个谜题:我不小心提出了其他答案之一。哎呀。我没有足够的声望来扭转我意外的恶搞行为。 – 2012-11-26 23:28:12
没有必要的复杂的javascript:只需在你的主播后插入一个脚本节点,然后在javascript中获取节点,并修改其属性与window.location.origin的方法。
<a id="trans">Look at the other port</a>
<script>
document.getElementById('trans').href='http://'+window.location.origin+':8081';
</script>
id属性必须是唯一的页面宽度,因此您可能需要使用其他方法来检索节点对象。
在Linux上使用apache和Firefox进行测试。
出于某种原因,这并不适合我 - 它将浏览器导向到“http // localhost:8081”,注意缺少的冒号。无论如何,我只是将Chrome协议部分完全移除了。 – joerick 2014-01-09 17:17:45
你是如何测试它的? – 2014-01-10 11:37:24
您可以使用document.write轻松完成,当您将鼠标悬停在其上时,URL将正确显示。你也不需要使用这种方法的唯一ID,它适用于Chrome,FireFox和IE。 由于我们仅引用变量而不加载任何外部脚本,因此在此处使用document.write不会影响页面加载性能。
<script language="JavaScript">
document.write('<a href="' + window.location.protocol + '//' + window.location.hostname + ':8080' + window.location.pathname + '" >Link to same page on port 8080:</a> ');
</script>
基于Gary Hole's answer,但在页面加载而不是点击时更改URL。
我想显示URL中使用CSS:
a:after {
content: attr(href);
}
所以,我需要锚的href转换为包含将要访问的实际的URL。
function fixPortUrls(){
var nodeArray = document.querySelectorAll('a[href]');
for (var i = 0; i < nodeArray.length; i++) {
var a = nodeArray[i];
// a -> e.g.: <a href=":8080/test">Test</a>
var port = a.getAttribute('href').match(/^:(\d+)(.*)/);
//port -> ['8080','/test/blah']
if (port) {
a.href = port[2]; //a -> <a href="/test">Test</a>
a.port = port[1]; //a -> <a href="http://localhost:8080/test">Test</a>
}
}
}
在页面加载时调用上述函数。
或在同一行:
function fixPortUrls(){var na=document.querySelectorAll('a[href]');for(var i=0;i<na.length;i++){var a=na[i];var u=a.getAttribute('href').match(/^:(\d+)(.*)/);u&&a.href=u[2]&&a.port=u[1];}}
(我用的for
代替forEach
所以它在IE7。)
这个我居然发现,SERVER_NAME是一个保留变量摔跤后。所以,如果你在页面上(www.example.com:8080),你应该可以删除8080并调用另一个端口。比如这个修改后的代码只是为我工作让我感动的任何基本端口到端口8069(根据需要进行更换你的端口)
<div>
<a href="http://<?php print
$_SERVER{'SERVER_NAME'}; ?>:8069"><img
src="images/example.png"/>Example Base (http)</a>
</div>
不错的PHP解决方案!您可以省略协议,以便自动检测: ADTC 2016-01-03 08:02:04
这是更好地生成URL服务器端:
// PHP:
<a href="<?=$_SERVER['SERVER_NAME']?>:8080/index.php">
// ASP.net
<a href="<%=Request.ServerVariables("SERVER_NAME")%>:8080/index.asp">
修改鼠标悬停的端口号:
<a href="/other/" onmouseover="javascript:event.target.port=8080">Look at another port</a>
这是没有退缩显示不正确的链接的https://stackoverflow.com/a/13522508/1497139的改善。
http://stackoverflow.com/questions/8317059/relative-path-but-for-port检查了这一点......它为我工作 – 2016-07-05 03:47:44
因为很多人在服务器端解决方案堆积如山, NGINX'$ http_host' var works,例如:'return 200'