通过设置Ionic-Cli代理解决ionic serve跨域调试问题

Ionic-Cli代理设置:

打开ionic.config.json文件,添加proxies代理配置字段:

{
  "name": "ion",
  "app_id": "",
  "v2": true,
  "typescript": true,
  "proxies": [
    {
      "path": "/web",
      "proxyUrl": "http://127.0.0.1/phpResty/web"
    }
  ]
}

  

之后在provider中这样调用即可:

  url:string = "/web/";
  api(){
    return new Promise((resolve, reject)=>{
      this.http.get(this.url + "api.php").subscribe(res => {
        resolve(res.json)
      }, err => {
        reject(err);
      });
    });
  }

  

此时访问 http://localhost:8100/web/api.php 等同于访问 http://127.0.0.1/phpResty/web/api.php

从而避开了因端口不同而产生的跨域问题。

参考:http://www.jianshu.com/p/e9c85dbf406d

http://blog.csdn.net/haozhoupan/article/details/51149896

时间: 2024-08-01 14:21:31

通过设置Ionic-Cli代理解决ionic serve跨域调试问题的相关文章

nodejs 代理 解决开发环境跨域问题

前后端分离项目中,会遇到跨域问题.解决方法无非就是jsonp cors等. 本次项目前端不搭node服务,线上用nginx搭站点,nginx转发ajax请求server. 本地开发环境的跨域问题用node做代理转发请求server(完美解决开发环境下请求server的跨域问题). node代码如下 "use strict"; const express = require('express'); const path = require('path'); const app = exp

谷歌、火狐浏览器下实现JS跨域iframe高度自适应的完美解决方法,跨域调用JS不再是难题!

谷歌.火狐浏览器下实现JS跨域iframe高度自适应的解决方法 导读:今天开发的时候遇到个iframe自适应高度的问题,相信大家对这个不陌生,但是一般我们都是在同一个项目使用iframe嵌套页面,这个ifame高度自适应网上一搜一大把,今天要讲的如何在不同的网站下进行相互的调用跟在同一个网站下是一个效果:例如我在自己的项目里面Iframe  了第一博客的页面  http://www.diyibk.com/   当第一博客的页面高度变化了怎么通知父页面呢? 这个时候在谷歌下肯定是拿不到 ifram

使用Spring Session和Redis解决分布式Session跨域共享问题

前言 对于分布式使用Nginx+Tomcat实现负载均衡,最常用的均衡算法有IP_Hash.轮训.根据权重.随机等.不管对于哪一种负载均衡算法,由于Nginx对不同的请求分发到某一个Tomcat,Tomcat在运行的时候分别是不同的容器里,因此会出现session不同步或者丢失的问题. 文末分享了我一部分私人收藏 有兴趣的可以收藏看一下的 都是架构师进阶的内容 实际上实现Session共享的方案很多,其中一种常用的就是使用Tomcat.Jetty等服务器提供的Session共享功能,将Sessi

Redis实战和核心原理详解(5)使用Spring Session和Redis解决分布式Session跨域共享问题

Redis实战和核心原理详解(6)使用Spring Session和Redis解决分布式Session跨域共享问题 前言 对于分布式使用Nginx+Tomcat实现负载均衡,最常用的均衡算法有IP_Hash.轮训.根据权重.随机等.不管对于哪一种负载均衡算法,由于Nginx对不同的请求分发到某一个Tomcat,Tomcat在运行的时候分别是不同的容器里,因此会出现session不同步或者丢失的问题. 实际上实现Session共享的方案很多,其中一种常用的就是使用Tomcat.Jetty等服务器提

grunt-connect-proxy解决开发时跨域问题

最近的项目中前后端是完全分离开发的,前端用grunt管理项目.这样就会导致一个问题:开发时前端调用后台的接口时因为不在一个服务器,所以会出现跨域问题.但是也不能用JSONP或CROS方式实现真正的跨域,因为项目发布时其实是在同一个服务器下的. 这时候我们的grunt-connect-proxy就出场了,它就是专门解决这个问题的. 具体配置: 1. 先下载安装这个组件 npm install grunt-connect-proxy --save-dev 这里要注意:一定要提前先装上grunt-co

解决Geoserver请求跨域的几种思路

文章版权由作者李晓晖和博客园共有,若转载请于明显处标明出处:http://www.cnblogs.com/naaoveGIS/ 1.背景描述 跨域问题是浏览器同源安全制引起的特别常见的问题.不同前端语言针对跨域解决方法有所区别.比如Flex语言做跨域请求时,如果中间件存有跨域文件(crossdomain.xml)则可以轻松实现跨域. 而JS开发的前端,针对GET请求则又可以通过JSONP方式解决.补充一下JSONP的原理:通过创建一个 script 标签,将 src 设置为目标请求,插入到 DO

解决Geoserver请求跨域的几种思路,第二种思路用过

1.背景描述 跨域问题是浏览器同源安全制引起的特别常见的问题.不同前端语言针对跨域解决方法有所区别.比如Flex语言做跨域请求时,如果中间件存有跨域文件(crossdomain.xml)则可以轻松实现跨域. 而JS开发的前端,针对GET请求则又可以通过JSONP方式解决.补充一下JSONP的原理:通过创建一个 script 标签,将 src 设置为目标请求,插入到 DOM中,服务器接受该请求并返回数据,数据通常被包裹在回调钩子中.根据JSONP的实现原理,我们可以看到其无法支持POST请求方式.

解决Ajax不能跨域的方法

1.  Ajax不能跨域请求的原因 同源策略(Same Origin Policy),是一种约定,该约定阻止当前脚本获取或者操作另一个域下的内容.所有支持Javascript的浏览器都支持同源策略,也就是说浏览器可以隔离来自不同源的内容,阻止跨域请求的发生. 2. 解决方法 (1) CORS 在被请求的脚本中使用header()函数设置http响应,从而使得跨域请求能够发生: header(“Access-Control-Allow-Origin:*”); 这一方法称为CORS(Cross-Or

cors跨域资源共享---解决前后端跨域问题

Cross-Origin Resource Sharing (CORS) ,定义了在跨域访问资源时浏览器和服务器之间如何通信.CORS背后的基本思想是使用自定义的HTTP头部允许浏览器和服务器相互了解对方,从而决定请求或响应成功与否. 解决方法: ①后端加响应头 header("Access-Control-Allow-Origin: *"); header('Access-Control-Allow-Credentials: true'); header('Access-Contro