হাইপারলিঙ্কে আলাদা পোর্ট নম্বরের সাথে সম্পর্কিত ইউআরএল?


136

জাভাস্ক্রিপ্ট / সার্ভার-সাইড স্ক্রিপ্টিং ছাড়া কি কোনও উপায় আছে যে আমি একই হোস্টের নামটি না জানলে একই বাক্সে একটি ভিন্ন পোর্ট নম্বরে লিঙ্ক করব?

উদাহরণ:

<a href=":8080">Look at the other port</a>

(এই উদাহরণটি ঠিক যেমন আচরণ করবে তেমন কার্যকর হয় না: 8080 স্ট্রিং হিসাবে আমি নেভিগেট করতে চাই)


stackoverflow.com/questions/8317059/relative-path-but-for-port এটি ব্যবহার করে দেখুন ... এটা আমার জন্য কাজ

যেহেতু নীচে প্রচুর লোকেরা সার্ভার-সাইড সমাধানের সাহায্যে স্তূপিত হয়েছে, এনজিআইএনএক্স ভার্চ $http_hostকাজ করে, যেমন: return 200 '<html><body><iframe id="ic" src="http://$http_host:2812/"></iframe></body></html>যেমন কোনও /etc/nginx/conf.d/strange.confফাইলে।
মার্কহু

উত্তর:


52

এটি কাজ করতে পারলে ভাল :লাগত, এবং ইউআরআই উপাদানগুলির অভ্যন্তরে পোর্ট পৃথকীকরণের জন্য একটি সংরক্ষিত চরিত্রের কারণ আমি দেখতে পাচ্ছি না , তাই ব্রাউজারটি বাস্তবতাকে এই ইউআরএলটির সাথে সম্পর্কিত একটি বন্দর হিসাবে ব্যাখ্যা করতে পারে, তবে দুর্ভাগ্যক্রমে এটি তা করেনি ' t এবং এটি করার কোনও উপায় নেই।

সুতরাং এটি করার জন্য আপনার জাভাস্ক্রিপ্টের প্রয়োজন হবে;

// 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);

ফায়ারফক্স 4 এ পরীক্ষিত

ফিডল: http://jsfiddle.net/JtF39/79/


আপডেট : ইউআরএল শেষ হওয়ার জন্য পোর্ট সংযোজনের জন্য বাগ স্থির করা হয়েছে এবং শেষ পর্যন্ত যুক্ত হওয়ার জন্য আপেক্ষিক এবং পরম ইউআরএলগুলির জন্য সমর্থন যুক্ত করেছে:

<a href=":8080/test/blah">Test absolute</a>
<a href=":7051./test/blah">Test relative</a>

1
সুতরাং জাভাস্ক্রিপ্ট ছাড়া সত্যিকারের কোনও সমাধান নেই
ড্যানিয়েল রফ

2
জাভাস্ক্রিপ্ট ছাড়া এটি করার কোনও উপায় নেই।
গ্যারি গ্রিন

6
এই সাফারি 6. মধ্যে কাজ করে নি সমস্যা হল আপনি আপেক্ষিক URL থেকে বন্দর সরানোর করছি না, তাই আপনি ভালো কিছু দিয়ে শেষ হয় http://myhost:8080/:8080জন্য href=":8080"। এটি ঠিক করতে আপনি এই লাইনটি `টার্গেট.পোর্ট = পোর্ট [1]; under এর অধীনে যুক্ত করতে পারেন। target.href = target.href.replace("/:"+target.port, "");(এটি একটি নিখুঁত সমাধান নয়, কারণ এটি সন্ধান / প্রতিস্থাপন, তবে ইউআরএল-এ থাকা পোর্ট স্ট্রিংটি সম্পর্কে আপনি উদ্বিগ্ন নন এমন সাধারণ ক্ষেত্রে ভাল))
জেকেল ২12

1
আমার সমাধানটি ছিল একটি এএসপি.এনইটি ক্লাস তৈরি করা যা URL টি উত্পন্ন করে। এটি মূলত উপরের মত একই সমাধান, কেবল সার্ভার-সাইড।
rookie1024

7
দয়া করে এই সমাধানটি ব্যবহার করবেন না । এটি জাভাস্ক্রিপ্ট ব্যতীত ক্লায়েন্টদের উপর পুরোপুরি বিরতি ফেলবে , সম্ভবত পর্দার পাঠকদের মতো অনেক অ্যাক্সেসিবিলিটি ডিভাইস সহ। পরিবর্তে সার্ভার সাইডে URL গুলি তৈরি করুন।
সোভেন স্লোটওয়েগ

88

এগুলো কেমন:

ক্লিক করে পোর্ট নম্বর পরিবর্তন করুন:

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

তবে, আপনি যদি লিংকের উপরে মাউস রাখেন তবে এতে নতুন পোর্ট নম্বর অন্তর্ভুক্ত থাকা লিঙ্কটি প্রদর্শিত হবে না। এটি আপনি পোর্ট নম্বর যোগ না করা অবধি এটি নয়। এছাড়াও, যদি ব্যবহারকারী লিঙ্কটিতে ডান-ক্লিক করে এবং "লিঙ্কের অবস্থানের অনুলিপি করুন" করে, তারা পোর্ট নম্বর ছাড়াই অশোধিত 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>

আমি যে বিষয়ে অবহিত ছিলাম সেই সতর্কীকরণগুলি নির্দেশ করার জন্য ধন্যবাদ আমার পরিস্থিতিতে সতর্কতাগুলি খুব গুরুত্বপূর্ণ নয় এবং আমি আপনার প্রথম সমাধানটির সরলতাকে পছন্দ করি। আমি প্রায় নিশ্চিত ছিলাম যে আমি ইতিমধ্যে আপনার উত্তরটিকে উজ্জীবিত করেছি, তবে সফ্টওয়্যারটি মনে হয় না বলে মনে হয় এবং সম্ভবত সফ্টওয়্যারটির স্মৃতি আমার চেয়ে বেশি নির্ভরযোগ্য। আমি এটি upvote (আবার ??)।
কেভিন ওয়াকার

আমি রহস্যটি সমাধান করেছি: আমি ঘটনাক্রমে এর পরিবর্তে অন্য উত্তরগুলির মধ্যে একটিটিকে আপত্তি জানিয়েছি। উফ। আমার দুর্ঘটনাজনিত উত্সাহকে উল্টে দেওয়ার মতো যথেষ্ট খ্যাতি আমার নেই।
কেভিন ওয়াকার

<a href="#" onclick="javascript:event.target.port=8888">port 8888</a>প্রযুক্তিগতভাবে ডাব্লু 3 স্পেসিফিকেশন অনুযায়ী কাজ করা উচিত নয় । event.targetহতে অনুমিত হয় readonly। তবে মনে হয় এটি আমার জন্য ক্রোম এবং ফায়ারফক্সে কাজ করে!
জেমস থমাসমুন 1979 26:51

এক লাইনারের সমাধানটি দুর্দান্ত! +1
পাইটর কুলা

ধন্যবাদ। আমি আপনার দ্বিতীয় সমাধানটি পছন্দ করি কারণ আমি খুব সম্ভবত ইউআরআইয়ের ফ্যালব্যাক হিসাবে এইচটিএমএলে উপাদানটির href সেট করতে পারি।
ডানকান এক্স সিম্পসন

56

আপনি ডকুমেন্টটি ব্যবহার করে এটি সহজেই করতে পারেন rite রাইট এবং ইউআরএল সঠিকভাবে প্রদর্শিত হবে যখন আপনি এর উপরে নেবেন। আপনারও এই পদ্ধতিটি ব্যবহার করে অনন্য আইডি লাগবে না এবং এটি ক্রোম, ফায়ারফক্স এবং আইইয়ের সাথে কাজ করে। যেহেতু আমরা কেবল ভেরিয়েবলগুলি উল্লেখ করছি এবং কোনও বাহ্যিক স্ক্রিপ্টগুলি লোড করছি না, তাই এখানে ডকুমেন্ট.উইরাট ব্যবহার করা পৃষ্ঠা লোডের কার্যকারিতার উপর প্রভাব ফেলবে না।

<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>

3
সরল ও মার্জিত! আমি জানি না কেন এর বেশি ভোট নেই - এটি কেবলমাত্র একজন প্রয়াত।
কেভিন এইচ। প্যাটারসন

5
এছাড়াও নোট করুন, আপনাকে window.location.protocolকেবল অংশ দিয়ে শুরু করার দরকার নেই '//'
কেব্রোক

লেজিট বলে মনে হচ্ছে মার্জিত।
জয়

রিয়েল হ্যান্ডি এবং মার্জিত।
রবার্ট লুসিয়ান চিরিয়াক

শুধু এটি বলতে document.writeএখনকার সার্বজনীন অপ্রস্তুত প্রস্তাবিত। এর মতো কিছু করা ভালmyElement.innerHTML = '...'
mwfearnley


5

জাভাস্ক্রিপ্ট ব্যতীত আপনাকে কিছু সার্ভার সাইড স্ক্রিপ্টিংয়ের উপর নির্ভর করতে হবে। উদাহরণস্বরূপ, আপনি যদি এএসপি ব্যবহার করে থাকেন তবে এরকম কিছু ...

<a href="<%=Request.ServerVariables("SERVER_NAME")%>:8080">Look at the other port</a>

কাজ করা উচিত. তবে, সঠিক বিন্যাসটি আপনি যে প্রযুক্তি ব্যবহার করছেন তার উপর নির্ভর করবে।


4

এটির সাথে কুস্তি করার পরে আমি দেখতে পেলাম যে 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>

1
চমৎকার পিএইচপি সমাধান! আপনি এত প্রোটোকল আউট চলে যাবে এটি এর স্বয়ংক্রিয় সনাক্ত করেছে:<a href="https://stackoverflow.com//<?php print $_SERVER{'SERVER_NAME'}; ?>:8069">
ADTC

3

সার্ভার ভেরিয়েবলগুলি থেকে url পাওয়া ভাল:

// PHP:
<a href="<?=$_SERVER['SERVER_NAME']?>:8080/index.php">

// ASP.net
<a href='<%=Request.ServerVariables("SERVER_NAME")%>:8080/index.asp'>

2

জটিল জাভাস্ক্রিপ্টের দরকার নেই: আপনার অ্যাঙ্কারের পরে কেবল একটি স্ক্রিপ্ট নোড সন্নিবেশ করুন, তারপরে জাভাস্ক্রিপ্টে নোড পাবেন এবং উইন্ডো.লোকেশন.রিগিন পদ্ধতিতে এর href সম্পত্তিটি পরিবর্তন করুন ।

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

আইডি বৈশিষ্ট্যটি অবশ্যই অনন্য পৃষ্ঠা প্রশস্ত হতে হবে, তাই আপনি নোড বস্তুগুলি পুনরুদ্ধার করতে অন্য পদ্ধতিটি ব্যবহার করতে পারেন।

লিনাক্সে অ্যাপাচি এবং ফায়ারফক্সের সাথে পরীক্ষিত।


কোনও কারণে এটি আমার পক্ষে বেশ কার্যকর হয়নি - এটি ব্রাউজারটি নির্দেশ করেছিল http//localhost:8081, অনুপস্থিত কোলনটি নোট করুন। ক্রোম যেভাবে যাইহোক HTTP ধরেছিল তাই আমি কেবল প্রোটোকল অংশটি পুরোপুরি সরিয়েছি।
জেরিক

আপনি এটি পরীক্ষা কিভাবে?
MUY বেলজিয়াম

1
আমি মনে করি এটি window.location.hostnameপরিবর্তে হওয়া উচিত । বিকাশকারী.মোজিলা.অর্গ.ইন-
ইউএস

2

এই সমাধানটি আমার কাছে আরও পরিষ্কার দেখাচ্ছে

<a href="#"  
    onclick="window.open(`${window.location.hostname}:8080/someMurghiPlease`)">
    Link to some other port on the same host
  </a>

1

গ্যারি হোলের উত্তরের ভিত্তিতে , তবে ক্লিকের পরিবর্তে পৃষ্ঠা লোডে url পরিবর্তন করে।

আমি সিএসএস ব্যবহার করে ইউআরএলটি দেখাতে চেয়েছিলাম:

a:after {
  content: attr(href);
}

সুতরাং আসল ইউআরএলটি পরিদর্শন করার জন্য আমার রূপান্তরিত হওয়ার জন্য অ্যাঙ্কারের href প্রয়োজন।

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="https://stackoverflow.com/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তাই এটি আই 7 তে কাজ করে))


0

আমি যে উত্তরগুলি দেখেছিলাম তার কোনওটিই (এবং আমি বলব না যে আমি সেগুলি পড়িনি) URL টি এমনভাবে সামঞ্জস্য করুন যে কোনও মিডল ক্লিক বা "নতুন ট্যাবে খুলুন" সঠিকভাবে কাজ করবে - লিঙ্কটি অনুসরণ করতে কেবল নিয়মিত ক্লিক করুন। আমি গ্যারি গ্রিনের উত্তর থেকে ধার নিয়েছি এবং অন ফ্লাইটে ইউআরএল সামঞ্জস্য করার পরিবর্তে পৃষ্ঠাটি লোড হওয়ার পরে আমরা এটিকে সামঞ্জস্য করতে পারি:

...
<script>
function rewriteRelativePortUrls() {
    var links = document.getElementsByTagName("a");
    for (var i=0,max=links.length; i<max; i++)
    {
        var port = links[i].getAttribute("href").match(/^:(\d+)(.*)/);
        if (port)
        {
            newURL = window.location.origin + port[0]
            links[i].setAttribute("href",newURL)
        }    
    }
}

</script>
<body onload="rewriteRelativePortUrls()">
...
আমাদের সাইট ব্যবহার করে, আপনি স্বীকার করেছেন যে আপনি আমাদের কুকি নীতি এবং গোপনীয়তা নীতিটি পড়েছেন এবং বুঝতে পেরেছেন ।
Licensed under cc by-sa 3.0 with attribution required.