首页
学习
活动
专区
工具
TVP
发布
社区首页 >问答首页 >IONIC 3 CORS问题

IONIC 3 CORS问题
EN

Stack Overflow用户
提问于 2017-10-17 02:53:07
回答 6查看 24.2K关注 0票数 14

我在尝试对应用程序接口进行GET调用时遇到了IONIC3的CORS问题。我使用的是Ionic本地服务器,在实时服务器的命令行中运行ionic server。

Error请求的资源上没有'Access-Control-Allow-Origin'标头。因此不允许访问源'http://localhost:8100'

我尝试使用代理设置更新ionic.config.json,但似乎不起作用。

{
  "name": "projectLeagueApp",
  "app_id": "47182aef",
  "type": "ionic-angular",
  "integrations": {
    "cordova": {}
  },
  "proxies": [
    {
      "path":"/games",
      "proxyUrl": "https://api-2445582011268.apicast.io/games/"
    }
  ]
}

我的数据服务

import { Injectable } from '@angular/core';
import { Http, Headers, RequestOptions } from '@angular/http';
import 'rxjs/add/operator/map';


@Injectable()
export class DataProvider {

  headers = new Headers({'user-key': '1234567890123'});
  options = new RequestOptions ({headers: this.headers}); 
  limit: number = 50;

  constructor(public http: Http) {
    console.log('Hello DataProvider Provider');
  }

  getGames(genre, offset_num) {

    let genre_id = genre;
    let offset = offset_num;

    return this.http.get('https://api-2445582011268.apicast.io/games/?fields=name,release_dates,screenshots&limit='+this.limit+'&offset='+offset+'&order=release_dates.date:desc&filter[genres][eq]='+genre_id+'&filter[screenshots][exists]', this.options)
  }

}

我正在尝试调用此api

请求Url

https://api-2445582011268.apicast.io
HEADERS
Key Value
user-key    YOUR_KEY
Accept  application/json

主要问题我的呼叫失败。如何为此问题创建代理?

EN

回答 6

Stack Overflow用户

发布于 2017-10-17 12:31:25

要解决此问题,请更改以下行

ionic.config.json

{
  "name": "projectLeagueApp",
  "app_id": "47182aef",
  "type": "ionic-angular",
  "integrations": {
    "cordova": {}
  },
  "proxies": [
    {
      "path":"/games",
      "proxyUrl": "https://api-2445582011268.apicast.io/games"
    }
  ]
}

您必须删除"proxyUrl“末尾的”/“。

我的数据服务

return this.http.get('/games/?fields=name,release_dates,screenshots&limit='+this.limit+'&offset='+offset+'&order=release_dates.date:desc&filter[genres][eq]='+genre_id+'&filter[screenshots][exists]', this.options)

在http调用中,url应该以'/games‘开头。'/games‘,因为ionic将代理http://localhost:<port>/gameshttps://api-2445582011268.apicast.io/games

请对应用程序中的外部GET和POST调用使用上述方法。

谢谢。

票数 19
EN

Stack Overflow用户

发布于 2018-11-24 22:55:37

如果你想使用Chrome进行测试,只需安装chrome extension Allow control origin快速简单的方法

票数 1
EN

Stack Overflow用户

发布于 2017-10-17 03:04:26

代理功能要求您引用本地服务器。在GET请求中,您仍然指向远程API。如果你改变你的代码为this.http.get('/games/...',它应该开始工作,因为请求将去往http://localhost:8100/games...,"proxy“选项将捕获并传递到你提供的URL。

您可能也只需要在proxyUrl字段中输入https://api-2445582011268.apicast.io。我想剩下的路都是直通的。

票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/46777212

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档