Ionic 2：在应用程序内部加载外部内容

我是Ionic的新手。我的打字稿文件是这样的：Ionic 2：在应用程序内部加载外部内容

import { Component } from '@angular/core'; 
import { Http } from '@angular/http'; 

import { NavController } from 'ionic-angular'; 

@Component({ 
selector: 'page-about', 
templateUrl: 'about.html' 
}) 
export class AboutPage { 
    mypage: any; 

    constructor(public navCtrl: NavController, public http: Http) { 
     this.http 
    .get('http://localhost/xampp/') 
    .map(response => response.text()) 
    .subscribe(html => this.mypage = html); 
    } 
}

任何URL，甚至在同一来源，会导致这样的错误：
EXCEPTION: Response with status: 0 for URL: null 的错误出现在是离子的发球局中我的电脑或我的电话。我该怎么做才能解决？我想也加载它作为组件“templateUrl：'somehtml'”，但将来我想在我的应用程序中加载一些JSON数据。谢谢。

来源

2017-02-04 Daniele Squalo

我想你会很难搭上从GET请求中获得完整的URL。存在一些严重的安全风险。我会很惊讶，即使你确实得到它的工作，它会被应用程序商店所接受。如果它自己的代码库，那么你需要创建一个Api，它将与GET请求 – 2017-02-04 08:21:37

交互我有它（一个SOAP和一个REST webservice）;这仅仅是为了学习的目的。应该遵循的路线是什么？它是不同的，如果我想加载模板或一些JSON数据或数组？ –

我自己解决了这个问题。这是一个CORS问题，但我在Ionic 2上几乎找不到任何有关它的信息。答案位于ionic.config.json文件中。您必须将这些行添加到json项目：

"proxies": [ 
    { 
     "path": "/virtualfolder", 
     "proxyUrl": "http://www.externalsite.com" 
    } 
    ]

现在出现真正的问题。足够？不，当然。回到我的代码，我应该这样做：

this.http 
    .get('virtualfolder/someresource.html') 
    .map(response => response.text()) 
    .subscribe(html => this.mypage = html);

离子将您的外部资源映射到您指定的路径。在注意到之后，我不得不解决一些与此无关的问题，但最终我做了我想做的事情，并且我注意到反XSS策略有多棒。希望我会帮助别人。

来源

2017-02-05 19:56:17

您是否正在加载html并将其绑定到您的应用程序？ –

@AvishaiPeretz我打算用这个来获取一些JSON数据，但它也可以使用html –

我可以只加载HTML内容的一部分吗？ –

Ionic 2：在应用程序内部加载外部内容

回答

相关问题