我正在尝试对 URL 进行 http 调用以获取 JSON 并将其显示在我的页面上。
JSON 看起来像这样:
{"ticker":{"high":484.01099,"low":470.37201,"avg":477.1915,"vol":2193393.03322,"vol_cur":4588.62668,"last":482.16,"buy":482.16,"sell":481.2,"updated":1398350394,"server_time":1398350394}}
代码如下。我读到我必须使用“JSONP”,但我不知道如何使用它。
<html ng-app>
<body>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.0-beta.6/angular.min.js"></script>
<div id = "content" style="min-width: 1200px; max-width: 90%: margin-left: auto; margin-right: auto;">
<div style="width: 520px; float: left;">
<h4>Bot Summary:</h4>
</div>
<div ng-controller="TickerControl" style="width: 680px; float: left;">
<h4>Market Summary</h4>
<p>Price = {{data}} </p>
</div>
</div>
<div></div>
<script type="text/javascript">
function TickerControl($scope, $http, $templateCache) {
$scope.method = 'JSONP';
$scope.url = 'https://btc-e.com/api/2/btc_usd/ticker?callback=JSON_CALLBACK';
$scope.getTicker = function() {
$scope.code = null;
$scope.response = null;
$http({method: $scope.method, url: $scope.url, cache: $templateCache}).
success(function(data, status) {
$scope.status = status;
$scope.data = data;
}).
error(function(data, status) {
$scope.data = data || "Request failed";
$scope.status = status;
});
};
$scope.getTicker();
}
</script>
</body>
</html>
更新
我现在已经修改了我的代码来尝试执行 JSONP 请求。我收到以下错误:
Resource interpreted as Script but transferred with MIME type text/html: "https://btc-e.com/api/2/btc_usd/ticker?callback=angular.callbacks._0". angular.js:8582
Uncaught SyntaxError: Unexpected token : ticker:1
我好像收到短信了。由于我无法控制服务器响应,我如何将此文本解析为 JSON...或者只是显示它...它可以在 chrome 开发环境中查看。
更新 2
显然这似乎是服务器未正确配置的问题。因为我无权访问它,所以能够只接收文本并在客户端中解析它会很好!
最佳答案
在用不同的方法做了更多的研究和试验之后,我很遗憾地通知你,你想要达到的目标无法实现。
我向 https://btc-e.com/api/2/btc_usd/ticker?callback=JSON_CALLBACK
发送了一个 GET 请求用于测试目的,在响应 header 中它说
content-type → text/html; charset=utf-8
因为做跨域调用,没有权限访问服务器,所以不得不使用jsonp。但是 jsonp 不适用于 text/html
内容。这与错误有关
Resource interpreted as Script but transferred with MIME type text/html
因此,即使响应看起来像有效的 JSON,您的客户端应用程序也不会这样对待它。
要解决此问题,您必须在服务器上添加正确的 Content-Type header ,但您无权访问它。
jsonp can only be used if and when the server properly embed the response in a javascript function call.
总结一下:
你应该
- 通过配置服务器允许跨域调用
- 通过配置服务器发回正确的内容类型 header
很遗憾,您无法访问服务器。
请注意,这不是您的错。这是因为服务器没有配置好。
关于html - How to use AngularJS to get JSON from external URL and display in page - Resource interpreted as Script 但使用 MIME 类型 text/html 传输,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/23268751/