ExpressJS IP 和 AngularJS $http 获取

Question

我正在尝试学习 ExpressJS，但在从 Express 路由获取 IP 地址以通过 Angular 控制器显示在浏览器中时遇到问题。

我正在使用 2 个 Nodejs 模块（request-ip 和 geoip2）来获取 IP，然后查找该 IP 的地理位置数据。然后尝试使用 Angular 使用 Angular $http get 调用在浏览器中显示地理位置数据。

我的 IP 快速路由：

// get IP address
router.get('/ip', function (req, res, next) {
    console.log('requestIP is ' + ip);
    // geolocation
    geoip2.lookupSimple(ip, function(error, result) {
    if (error) {
        //return res.status(400).json({error: 'Something happened'});//default
        return res.sendStatus(400).json({error: 'Something happened'});
        }
        else if (result) {
        return res.send(result);
      }
    });
});

还有我的 AngularJS 控制器代码：

function MainController($http) {
    var vm = this;
    vm.message = 'Hello World';
    vm.location = '';
    vm.getLocation = function() {
        $http({
            method: 'GET',
            url: 'localhost:8000/ip'
        }).then(function (result) {
            console.log(result);
            return vm.location = result;
        });
      }; 
    };

Hello World 消息显示但不显示位置...？我也可以访问 localhost:8000/ip 并查看 JSON result。 result 也不会出现在 Chrome 的控制台中。结果是一个像这样的 json 对象：

{"country":"US","continent":"NA","postal":"98296","city":"Snohomish","location":{"accuracy_radius":20,"latitude":47.8519,"longitude":-122.0921,"metro_code":819,"time_zone":"America/Los_Angeles"},"subdivision":"WA"}

我不确定为什么 Hello Word 会显示，而当我似乎已正确配置所有内容时，位置却没有显示...所以显然我做错了我看不到的事情...？

Answer 1

1. 您已将 'vm.location' 初始化为字符串，而实际上它是 JSON 对象。

   vm.location = {};

2. 您需要将请求中的 url 参数调整为：

   url: '/ip'

3. 当您从 Express.js 发回 JSON 时，您应该将响应行更改为：

   return res.json(result);

Answer 2

这个 express js 和 angular 是否托管在同一个端口上？如果是这样，请更换您的

$http({
    method: 'GET',
    url: 'localhost:8000/ip'
}).then(function (result) {
    console.log(result);
    return vm.location = result;
});

与

$http({
    method: 'GET',
    url: '/ip'
}).then(function (result) {
    console.log(result);
    return vm.location = result;
});

它可能被视为 CORS 调用，您可能已禁用它。 您还可以将第二个函数指定为then（查看下面的代码）并查看是否调用了错误回调。

$http({
    method: 'GET',
    url: '/ip'
}).then(function (result) {
    console.log(result);
    return vm.location = result;
}, function (error) {
    console.log(error);
});

Answer 3

在此之后，您是否在代码中的某处调用 vm.getLocation()？
您需要的数据位于响应对象的result.data 下。
此外，为了在 html 中显示数据，您必须从 vm.location 对象（vm.location.country、vm.location.city 等）中指定要显示的属性。

来自关于 $http 的 Angular 文档：

响应对象具有以下属性：
data – {string|Object} – 使用转换函数转换的响应主体。
status – { number} – 响应的 HTTP 状态代码。
headers – {function([headerName])} – Header getter 函数。
config – {Object} – 用于生成请求的配置对象。
statusText – {string} – 响应的 HTTP 状态文本。