Get protocol domain and port from URL

Question

I need to extract the full protocol  domain  and port from a given URL  For example   https   localhost 8181 ContactUs-1 0 contact lang it amp report type consumer  gt  gt  gt  https   localhost 8181

User · Answer

Why not use   let full   window location origin

User · Answer

None of these answers seem to completely address the question  which calls for an arbitrary url  not specifically the url of the current page   Method 1  Use the URL API  caveat  no IE11 support   You can use the URL API  not supported by IE11  but available everywhere else    This also makes it easy to access search params   Another bonus  it can be used in a Web Worker since it doesn t depend on the DOM   const url   new URL  http   example com 12345 blog foo bar startIndex 1 amp pageSize 10      Method 2  old way   Use the browser s built-in parser in the DOM  Use this if you need this to work on older browsers as well       Create an anchor element  note  no need to append this element to the document  const url   document createElement  a        Set href to any path url setAttribute  href    http   example com 12345 blog foo bar startIndex 1 amp pageSize 10      That s it   The browser s built-in parser has already done its job  Now you can just grab the parts you need  note that this works for both methods above        Get any piece of the url you re interested in url hostname        example com  url port           12345 url search           startIndex 1 amp pageSize 10  url pathname         blog foo bar  url protocol        http     Bonus  Search params  Chances are you ll probably want to break apart the search url params as well  since   startIndex 1 amp pageSize 10  isn t too useable on its own   If you used Method 1  URL API  above  you simply use the searchParams getters   url searchParams get  startIndex         1    Or to get all parameters   function searchParamsToObj searchParams      const paramsMap   Array      from url searchParams       reduce  params   key  val     gt  params set key  val   new Map       return Object fromEntries paramsMap     searchParamsToObj url searchParams      - gt    startIndex   1   pageSize   10      If you used Method 2  the old way   you can use something like this      Simple object output  note  does NOT preserve duplicate keys   var params   url search substr 1      remove     prefix params      split   amp         reduce  accum  keyval    gt            const  key  val    keyval split               accum key    val          return accum                 - gt    startIndex   1   pageSize   10

User · Answer

Simple answer that works for all browsers   let origin   if   window location origin      origin   window location protocol          window location hostname          window location port         window location port          origin   window location origin

User · Answer

Here is the solution I m using   const result       window location protocol       window location host       EDIT   To add cross-browser compatibility  use the following   const result       window location protocol       window location hostname    window location port         window location port

User · Answer

var getBasePath   function url        var r         url  match    https              i       return r   r 0

User · Answer

var full   location protocol      location hostname  location port       location port

User · Answer

The protocol property sets or returns the protocol of the current URL  including the colon        This means that if you want to get only the HTTP HTTPS part you can do something like this   var protocol   window location protocol replace    g       For the domain you can use   var domain   window location hostname    For the port you can use   var port   window location port    Keep in mind that the port will be an empty string if it is not visible in the URL  For example    http   example com  will return    for port http   example com 80  will return 80 for port   If you need to show 80 443 when you have no port use  var port   window location port     protocol      https     443     80

User · Answer

host  var url   window location host    returns localhost 2679  hostname  var url   window location hostname    returns localhost

User · Answer

Try use a regular expression  Regex   which will be quite useful when you want to validate   extract stuff or even do some simple parsing in javascript   The regex is        a-zA-Z           - w            d 0 5        Demonstration   function breakURL url         matches      a-zA-Z           - w            d 0 5      exec url         foo   new Array          if matches             for  i   1  i  lt  matches length   i     foo push matches i                   return foo    url    https   www google co uk 55699 search q http 3A 2F 2F amp oq http 3A 2F 2F amp aqs chrome  69i57j69i60l3j69i65l2 2342j0j4 amp sourceid chrome amp ie UTF-8    breakURL url             https  www google co uk  55699   breakURL                   breakURL  asf              breakURL  asd              breakURL  asd   a        asd  a  undefined    Now you can do validation as well

User · Answer

With ES6 template literals   x000D   x000D  const url      location protocol     location hostname   location port     location port        document getElementById  result   innerText   url  x000D   lt div id  result  gt  lt  div gt  x000D   x000D   x000D

User · Answer

window location protocol          window location host

User · Answer

window location origin will be enough to get the same

User · Answer

first get the current address  var url   window location href   Then just parse that string  var arr   url split         your url is   var result   arr 0           arr 2    Hope this helps

User · Answer

ES6 style with configurable parameters          Get the current URL from  window  context object     Will return the fully qualified URL if neccessary       getCurrentBaseURL true  false      http   localhost   -  https   localhost 3000        getCurrentBaseURL true  true      http   www example com  -  https   www example com 8080       getCurrentBaseURL false  true      www example com  -  localhost 3000         param  boolean   includeProtocol true      param  boolean   removeTrailingSlash false      returns  string  The current base URL      export const getCurrentBaseURL    includeProtocol   true  removeTrailingSlash   false    gt      if   window     window location     window location hostname     window location protocol        console error         The getCurrentBaseURL function must be called from a context in which window object exists  Yet  window is   window           window  window location  window location hostname  window location protocol             throw new TypeError  Whole or part of window is not defined           const URL      includeProtocol      window location protocol            window location hostname        window location port       window location port             removeTrailingSlash                    console log  The URL is   URL       return URL

User · Answer

As has already been mentioned there is the as yet not fully supported window location origin but instead of either using it or creating a new variable to use  I prefer to check for it and if it isn t set to set it   For example   if   window location origin      window location origin   window location protocol          window location hostname    window location port         window location port           I actually wrote about this a few months back A fix for window location origin

User · Answer

Indeed  window location origin works fine in browsers following standards  but guess what  IE isn t following standards   So because of that  this is what worked for me in IE  FireFox and Chrome   var full   location protocol      location hostname  location port       location port         but for possible future enhancements which could cause conflicts  I specified the  window  reference before the  location  object   var full   window location protocol      window location hostname  window location port       window location port

User · Answer

var http   location protocol  var slashes   http concat        var host   slashes concat window location hostname

User · Answer

For some reason all the answers are all overkills  This is all it takes   window location origin   More details can be found here  https   developer mozilla org en-US docs Web API window location Properties

[javascript] Get protocol, domain, and port from URL

Examples related to javascript

Examples related to url

Examples related to dns

Examples related to protocols

Examples related to port