如何在angularjs $http请求中获取请求url

Question

I have this request:

$http({
  method: 'get',
  url: '/api/items/',
  params: {a: 1, b: 2, c: 3}
}).success(function (response) {
  console.log(response);
}).error(function (err) {
  console.log(err);
});

有没有一种方法，在请求已经发出后（在回调函数或其他方式中），获取它所使用的URL？ 我希望输出结果如下：

http://www.example.org/api/items?a=1&b=2&c=3

这里使用jquery完成同样的事情。

- Jahongir Rahmonov

---

使用 params 不起作用了吗？ - Endre Simo

即使在 Promise 成功函数中，$location.search('target') 似乎也无法正常工作。 - changtung

Answer 1

成功处理程序将传入4个参数：

$http
  .get({ url: '/someUrl', params: { q: 3 } })
  .success(function(data, status, headers, config) {});

第四个参数config具有以下属性：

{
  method: "GET",
  url: {
    url: '/someUrl',
    params: {
      q: 3
    }
  }
}

你可以使用window.location.origin来获取基本的url并构建一个简单的函数将其全部连接在一起。

这个函数应该会产生预期的响应：

var baseUrl = window.location.origin;
var query = [];
Object.keys(config.url.params || {}).forEach(function (key) {
  var val = config.url.params[key];
  query.push([key, val].join('=')); // maybe url encode
});
var queryStr = query.join('&');
var fullPath = baseUrl + config.url.url + '?' + queryStr;

很遗憾，此功能仅在按照上述格式传递参数时才能正常工作。如果您以不同的格式传递它们，则需要稍微修改此函数。您可以使用此处作为游乐场。

据我所知，没有更简单的方法。至少存在一个功能请求。 有关参考，请参阅$http文档。

- riptidebyte

---

那个 url 只给了我路径，没有参数。 - Jahongir Rahmonov

请检查此示例 - URL 中还包含查询参数。 - riptidebyte

这个例子能够正常工作是因为参数被附加到了URL上（/url?q=3）。但在我的情况下，参数是分别给出的（params: {q:3}）。 - Jahongir Rahmonov

函数对你有用吗？我得到了config.url.params的值为undefined，并且在forEach部分给我这个错误Cannot convert undefined or null to object。不过还是谢谢你的帮助。 - Jahongir Rahmonov

上述函数只有在您按照所描述的格式传递参数时才能正常工作。如果您以稍微不同的格式传递参数，那么您将需要修改该函数。 - riptidebyte

Answer 2

你可以使用HTTP请求拦截器。 在config函数中使用$httpProvider配置拦截器， 对于请求拦截器，你可以在发出请求之前查看URL和参数。

- user1608841

---

你能在这里分享一下代码吗？如何在 $httpInterceptor 中获取 URL 和参数。 - Aji

Answer 3

尝试在浏览器开发工具中查看XHR请求的URL。

- ryanrain

Answer 4

这个回调函数的配置参数具有URL属性：

// Simple GET request example :
$http.get('/someUrl').
  success(function(data, status, headers, config) {
    console.log(config.url);
  }).
  error(function(data, status, headers, config) {
    // called asynchronously if an error occurs
    // or server returns response with an error status.
  });

基于：https://docs.angularjs.org/api/ng/service/$http

- Firefly

---

这会只给我/someUrl，不包括参数。 - Jahongir Rahmonov