Relative URL to a different port number in a hyperlink?

前端 未结 11 1803
心在旅途
心在旅途 2020-11-27 15:13

Is there a way without Javascript / server-side scripting to link to a different port number on the same box, if I don\'t know the hostname?

e.g.:

&l         


        
相关标签:
11条回答
  • 2020-11-27 16:11

    How about these:

    Modify the port number on click:

    <a href="/other/" onclick="javascript:event.target.port=8080">Look at another port</a>
    

    However, if you hover your mouse over the link, it doesn't show the link with new port number included. It's not until you click on it that it adds the port number. Also, if the user right-clicks on the link and does "Copy Link Location", they get the unmodified URL without the port number. So this isn't ideal.

    Here is a method to change the URL just after the page loads, so hovering over the link or doing "Copy Link Location" will get the updated URL with the port number:

    <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>
    
    0 讨论(0)
  • 2020-11-27 16:14

    After wrestling with this I found actually that SERVER_NAME is a reserved variable. So, if you are on page (www.example.com:8080) you should be able to drop the 8080 and invoke another port. For instance this modified code just worked for me and moves me from any base port to port 8069 (replace your port as required)

    <div>
        <a href="http://<?php print
        $_SERVER{'SERVER_NAME'}; ?>:8069"><img
        src="images/example.png"/>Example Base (http)</a>
    </div>
    
    0 讨论(0)
  • 2020-11-27 16:14

    It's better to get the url from the server variables:

    // PHP:
    <a href="<?=$_SERVER['SERVER_NAME']?>:8080/index.php">
    
    // ASP.net
    <a href='<%=Request.ServerVariables("SERVER_NAME")%>:8080/index.asp'>
    
    0 讨论(0)
  • 2020-11-27 16:19

    It would be nice if this could work, and I don't see why not because : is a reserved character for port separation inside the URI component, so the browser could realistically interpret this as a port relative to this URL, but unfortunately it doesn't and there's no way for it to do that.

    You'll therefore need Javascript to do this;

    // 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 = window.location.origin;
             target.port = port[1];
          }
      }
    }, false);
    

    Tested in Firefox 4

    Fiddle: http://jsfiddle.net/JtF39/79/


    Update: Bug fixed for appending port to end of url and also added support for relative and absolute urls to be appended to the end:

    <a href=":8080/test/blah">Test absolute</a>
    <a href=":7051./test/blah">Test relative</a>
    
    0 讨论(0)
  • 2020-11-27 16:19

    No need of complicated javascript : simply insert a script node after your anchor, then get the node in javascript, and modify its href property with the window.location.origin method.

     <a id="trans">Look at the other port</a>
     <script>
          document.getElementById('trans').href='http://'+window.location.origin+':8081';
     </script>
    

    The id property must be unique page wide, so you may want to use other method to retrieve node objects.

    Tested with apache and Firefox on Linux.

    0 讨论(0)
提交回复
热议问题