如何在JavaScript中获取路由参数？

Question

我有一个启用了URL重写的ASP.NET网站。我知道如何使用C#获取路由参数：

Page.RouteData.Values["id"] as string;

但是我不知道如何从JavaScript中获取它？以下是我的重写链接格式：

http://www.domain.com/topic/{id}/{title}

我想使用JavaScript获取这个{id}字段。请帮忙！

更新

我有这段代码可以获取请求参数。

function getParameterByName(name) {
    name = name.replace(/[\[]/, "\\\[").replace(/[\]]/, "\\\]");
    var regex = new RegExp("[\\?&]" + name + "=([^&#]*)"),
        results = regex.exec(location.search);
    return results == null ? "" : decodeURIComponent(results[1].replace(/\+/g, " "));
}

这个怎样修改才能获取路由参数？

- Aishwarya Shiva

---

请查看这篇文章，我认为你会在那里找到解决方案：链接 - jalba

URL参数是不同的事情。我认为它不会起作用。 - Aishwarya Shiva

如果你的格式是 http://www.domain.com/topic/{id}/{title}，那么为什么不将其放在字符串中使用 window.location.href；然后按 '/' 分割它，并访问特定的索引。 - Vikram Deshmukh

@srvikram13 请提供一个例子，说明您确切想要表达的意思。 - Aishwarya Shiva

@AishwaryaShiva，请检查我下面发布的解决方案。 - Vikram Deshmukh

Answer 1

function getValueAtIndex(index){
    var str = "http://www.sample.com/234/Fiddle/test"; //window.location.href; 
    return str.split("/")[index];
}
console.log(getValueAtIndex(3));

更新

这是使用纯JS获取路由中索引值的更加简洁的方法:

    location.pathname.split('/')[index]
    

例如，对于当前页面：

location.pathname = '/questions/20302776/how-to-get-route-parameter'

您可以通过以下方式获取问题ID：

location.pathname.split('/')[2]

// Notice that the index does not start from zero.

- Vikram Deshmukh

---

如果使用虚拟目录，这有点糟糕。 - Mike

我喜欢这个想法，但是需要将字符串拆分为单独的数组变量，然后使用数组长度减去提供的索引值再减1作为数组索引。这样就可以倒序工作了，所以对于索引0返回'test'，对于索引1返回'Fiddle'等等。这将解决虚拟目录的问题。 - Kate

Answer 2

尝试以下操作：

const getRouteValueAt = (idx) => {

   const routeTokens = location.pathname.replace(/^\/+/g,'').split('/')
   //[questions,20302776,how-to-get-route-parameter-in-javascript]

   return routeTokens.length > idx ? routeTokens[idx] : undefined
}

使用

const routeName = getRouteValueAt(0); // questions
const routeId = getRouteValueAt(1); // 20302776

- Ali Kleit