Question

所以我有一个如下所示的网址：

localhost:9031?redirect_uri=http%3A%2F%2Flocalhost%3A8080%2Fcallback&scope=test

我想重定向到网址localhost:8080/something，该网址会使用部分重定向uri，但会从中删除/callback。

为了获得重定向uri，我有一个执行以下操作的方法，并将其传递给字符串redirect_uri：

function getQueryVariable(variable) {
  var query = window.location.search.substring(1);
  var vars = query.split('&');
  for (var i = 0; i < vars.length; i++) {
    var pair = vars[i].split('=');
    if (decodeURIComponent(pair[0]) == variable) {
      return decodeURIComponent(pair[1]);
    }
  }
}

这让我回到字符串http://localhost:8080/callback。然后要获得callback的索引，我使用以下函数。

function getPosition(string, subString, index) {
  return string.split(subString, index).join(subString).length;
}

然后当点击按钮时，我把它们放在一起并执行：

$('.button').click(function(e) {
  var query = window.location.search.slice(1);
  var redirect = getQueryVariable('redirect_uri');
  var index = getPosition(redirect, '/', 3);
  var baseUrl = redirect.slice(0, index);
  window.location.href = baseUrl + '/something';
});

这一切都按预期工作，但似乎并不是特别简单或有效。寻找优化或建议使用我不知道的JavaScript或JQuery的功能。希望避免使用第三方库，但如果它们足够好，我肯定会使用它们。

Answer 1

我建议让浏览器彻底解析URL。假设您有来自查询字符串的解码重定向URI，您可以执行以下操作：

var myUrl = 'http://localhost:8080/callback&scope=test';

function parseURL(url) {
  var a = document.createElement("a");
  a.href = url;
  
  return {
    protocol: a.protocol,
    hostname: a.hostname,
    port: a.port,
    pathname: a.pathname
  };
}

var parsedURL = parseURL(myUrl);
console.log(parsedURL.protocol + '//' + parsedURL.hostname + ':' + parsedURL.port + '/something');

您可以从结果中构建基本URL，并可选择在必要时解析路径名。

Answer 2

这是基于众所周知的Gist来解析JavaScript中的URL，这是由John Long引入的。

function parseURL(url) {
  var parser = document.createElement('a'),
      searchObject = {},
      queries, split, i;
  // Let the browser do the work
  parser.href = url;
  // Convert query string to object
  queries = parser.search.replace(/^\?/, '').split('&');
  for( i = 0; i < queries.length; i++ ) {
    split = queries[i].split('=');
    searchObject[split[0]] = decodeURIComponent(split[1]);
  }
  // return all fragments
  return {
    protocol: parser.protocol,
    host: parser.host,
    hostname: parser.hostname,
    port: parser.port,
    pathname: parser.pathname,
    search: parser.search,
    params: searchObject,
    hash: parser.hash
  };
}

// using the method
(function() {
  // your first url
  var temp = parseURL('localhost:9031?redirect_uri=http%3A%2F%2Flocalhost%3A8080%2Fcallback&scope=test');
  // second (the redirect_uri param);
  var url = parseURL(temp.params.redirect_uri);

  // now you could do:
  window.location.href = url.protocol + '://' + url.host + '/whateverYoWant';
})();

获取查询字符串中重定向uri的子节

2 个答案: