Ionic 框架在显示 json 数据时出错答案

【问题标题】：Ionic Framework giving error while displaying json dataIonic 框架在显示 json 数据时出错
【发布时间】：2023-03-11 20:34:01
【问题描述】：

我正在使用 Ionic Framework 和 WP-API 为我的基于 Woocommerce 的网站开发移动应用程序。我正在使用以下 URL 从网站中检索有关我的产品的 JSON 数据 -

http://example.com/wp-json/posts?type=product&?_jsonp=JSON_CALLBACK

当我从浏览器尝试此 URL 时，我得到了完美的 JSON 响应，其中包含有关我的产品的所有必需详细信息。但是，当我尝试通过 Ionic 调用相同的 URL 时，框架出现错误。

更新

$http.jsonp( postsApi ).
    success(function(data, status, headers, config) {
      $scope.posts = data;
      console.log( data );
    }).
    error(function(data, status, headers, config) {
      console.log( 'Post load error.' );
    });

【问题讨论】：

你有具体的错误信息吗？
我正在将错误记录到我的控制台，如下所示：console.log('Post load error.');
该错误是 CORS 错误吗？如果是这样，可能值得一读Handling CORS issues in Ionic。我还注意到您正在请求 jsonp - 这是故意的吗？
如果你记录整个事情，离子在控制台中给你的错误信息是什么？
404 error for an existing url calling from cordova app的可能重复

标签： json woocommerce ionic

【解决方案1】：

请提供有效链接以重试。

尝试使用服务：

app = angular.module('appName', ['ionic']);

app.factory('postService', function($http){
  return {
    all: function all() {            
        var url = 'http://example.com/wp-json/posts?type=product&?_jsonp=JSON_CALLBACK';
      return $http.jsonp(url, {cache: true})
      .success(function(data){
          return data;
      }).error(function() {
        alert("Error");    
      });
    }
   }
 });

app.controller("ItemController", function($scope,postService){

    $scope.item = [];

     postService.all().then(function(data){
        data = data.data;
        if(data.length == 0){
            console.log('empty return');
        }else{
            $scope.item = data;
        }
    });
});

【讨论】：