When I call a rest service to get the data, they don't arrive.
The output of the rest service is like this
[
{
"idpizza": 1,
"name": "jdjd",
"price": 3
},
{
"idpizza": 2,
"name": "sdfv",
"price": 2
}
]
I've already tried the same program with a list of pizzas written by me and it works, so I think I'm wrong about using the service.
service
import { Injectable } from '#angular/core';
import { Observable } from 'rxjs';
import { HttpClient, HttpHeaders } from '#angular/common/http';
import { Pizza } from '../model/Pizza';
const httpOptions = {
headers: new HttpHeaders({
'Content-Type': 'application/json'
})
}
#Injectable({
providedIn: 'root'
})
export class PizzaService {
pizzasUrl:string = 'http://localhost:8080/PizzeriaServer/webapi/myresource';
pizzasLimit = '?_limit=5';
constructor(private http:HttpClient) { }
// Get Pizzas
getPizzas():Observable<Pizza[]> {
return this.http.get<Pizza[]>(`${this.pizzasUrl}${this.pizzasLimit}`);
}
}
app.component.html
<strike>
<div>
<app-header></app-header>
<app-pizza-item></app-pizza-item>
</strike>
PizzaItem.component
import { Component, OnInit, Input, EventEmitter, Output } from '#angular/core';
import { PizzaService } from '../../services/pizza.service';
import { Pizza } from 'src/app/model/Pizza';
#Component({
selector: 'app-pizza-item',
templateUrl: './pizza-item.component.html',
styleUrls: ['./pizza-item.component.css']
})
export class PizzaItemComponent implements OnInit {
#Input() pizza: Pizza;
constructor(private pizzaService:PizzaService) { }
ngOnInit() {
}
// Set Dynamic Classes
setClasses() {
}
}
<strike>
pizza-item.component.html
<div [ngClass]="setClasses()">
<p>
<label>
{{ pizza.name }}
</label>
<button class="del">X</button>
</p>
</div>
</strike>
PizzasComponent
import { Component, OnInit } from '#angular/core';
import { PizzaService } from '../../services/pizza.service';
import { Pizza } from '../../model/Pizza';
#Component({
selector: 'app-pizzas',
templateUrl: './pizzas.component.html',
styleUrls: ['./pizzas.component.css']
})
export class PizzasComponent implements OnInit {
pizzas:Pizza[];
constructor(private pizzaService:PizzaService) {
}
ngOnInit() {
this.pizzaService.getPizzas().subscribe(pizzas => {
this.pizzas = pizzas;
});
}
}
<strike>
pizzas.component.html
<app-pizza-item
*ngFor="let pizza of pizzas"
[pizza]="pizza"
>
{{console.log(pizzas)}}
</app-pizza-item>
</strike>
// model
export class Pizza {
idpizza:number;
name:string;
price:number;
}
Error:
ERROR TypeError: Cannot read property 'name' of undefined
at Object.eval [as updateRenderer] (PizzaItemComponent.html:3)
at Object.debugUpdateRenderer [as updateRenderer] (core.js:36090)
at checkAndUpdateView (core.js:35073)
at callViewAction (core.js:35433)
at execComponentViewsAction (core.js:35361)
at checkAndUpdateView (core.js:35074)
at callViewAction (core.js:35433)
at execComponentViewsAction (core.js:35361)
at checkAndUpdateView (core.js:35074)
at callWithDebugContext (core.js:36407)
View_PizzaItemComponent_0 # PizzaItemComponent.html:3
proxyClass # compiler.js:19257
logError # core.js:36342
handleError # core.js:7239
(anonymous) # core.js:32092
invoke # zone-evergreen.js:359
run # zone-evergreen.js:124
runOutsideAngular # core.js:30830
tick # core.js:32089
_loadComponent # core.js:32130
bootstrap # core.js:32053
(anonymous) # core.js:31675
_moduleDoBootstrap # core.js:31671
(anonymous) # core.js:31626
invoke # zone-evergreen.js:359
onInvoke # core.js:30904
invoke # zone-evergreen.js:358
run # zone-evergreen.js:124
(anonymous) # zone-evergreen.js:855
invokeTask # zone-evergreen.js:391
onInvokeTask # core.js:30885
invokeTask # zone-evergreen.js:390
runTask # zone-evergreen.js:168
drainMicroTaskQueue # zone-evergreen.js:559
Promise.then (async)
scheduleMicroTask # zone-evergreen.js:542
scheduleTask # zone-evergreen.js:381
scheduleTask # zone-evergreen.js:211
scheduleMicroTask # zone-evergreen.js:231
scheduleResolveOrReject # zone-evergreen.js:845
then # zone-evergreen.js:955
bootstrapModule # core.js:31656
./src/main.ts # main.ts:11
__webpack_require__ # bootstrap:78
0 # main.ts:12
__webpack_require__ # bootstrap:78
checkDeferredModules # bootstrap:45
webpackJsonpCallback # bootstrap:32
(anonymous) # main.js:1
PizzaItemComponent.html:3 ERROR CONTEXT DebugContext_ {view: {…}, nodeIndex: 5, nodeDef: {…}, elDef: {…}, elView: {…}}elDef: {nodeIndex: 4, parent: {…}, renderParent: {…}, bindingIndex: 1, outputIndex: 0, …}elView: {def: {…}, parent: {…}, viewContainerParent: null, parentNodeDef: {…}, context: PizzaItemComponent, …}nodeDef: {nodeIndex: 5, parent: {…}, renderParent: {…}, bindingIndex: 1, outputIndex: 0, …}nodeIndex: 5view: {def: {…}, parent: {…}, viewContainerParent: null, parentNodeDef: {…}, context: PizzaItemComponent, …}component: (...)componentRenderElement: (...)context: (...)elOrCompView: (...)injector: (...)providerTokens: (...)references: (...)renderNode: (...)__proto__: Object
View_PizzaItemComponent_0 # PizzaItemComponent.html:3
proxyClass # compiler.js:19257
logError # core.js:36342
handleError # core.js:7244
(anonymous) # core.js:32092
invoke # zone-evergreen.js:359
run # zone-evergreen.js:124
runOutsideAngular # core.js:30830
tick # core.js:32089
_loadComponent # core.js:32130
bootstrap # core.js:32053
(anonymous) # core.js:31675
_moduleDoBootstrap # core.js:31671
(anonymous) # core.js:31626
invoke # zone-evergreen.js:359
onInvoke # core.js:30904
invoke # zone-evergreen.js:358
run # zone-evergreen.js:124
(anonymous) # zone-evergreen.js:855
invokeTask # zone-evergreen.js:391
onInvokeTask # core.js:30885
invokeTask # zone-evergreen.js:390
runTask # zone-evergreen.js:168
drainMicroTaskQueue # zone-evergreen.js:559
Promise.then (async)
scheduleMicroTask # zone-evergreen.js:542
scheduleTask # zone-evergreen.js:381
scheduleTask # zone-evergreen.js:211
scheduleMicroTask # zone-evergreen.js:231
scheduleResolveOrReject # zone-evergreen.js:845
then # zone-evergreen.js:955
bootstrapModule # core.js:31656
./src/main.ts # main.ts:11
__webpack_require__ # bootstrap:78
0 # main.ts:12
__webpack_require__ # bootstrap:78
checkDeferredModules # bootstrap:45
webpackJsonpCallback # bootstrap:32
(anonymous) # main.js:1
core.js:30242 Angular is running in the development mode. Call enableProdMode() to enable the production mode.
PizzaItemComponent.html:3 ERROR TypeError: Cannot read property 'name' of undefined
at Object.eval [as updateRenderer] (PizzaItemComponent.html:3)
at Object.debugUpdateRenderer [as updateRenderer] (core.js:36090)
at checkAndUpdateView (core.js:35073)
at callViewAction (core.js:35433)
at execComponentViewsAction (core.js:35361)
at checkAndUpdateView (core.js:35074)
at callViewAction (core.js:35433)
at execComponentViewsAction (core.js:35361)
at checkAndUpdateView (core.js:35074)
at callWithDebugContext (core.js:36407)
View_PizzaItemComponent_0 # PizzaItemComponent.html:3
proxyClass # compiler.js:19257
logError # core.js:36342
handleError # core.js:7239
(anonymous) # core.js:32092
invoke # zone-evergreen.js:359
run # zone-evergreen.js:124
runOutsideAngular # core.js:30830
tick # core.js:32089
(anonymous) # core.js:31927
invoke # zone-evergreen.js:359
onInvoke # core.js:30904
invoke # zone-evergreen.js:358
run # zone-evergreen.js:124
run # core.js:30769
next # core.js:31924
schedulerFn # core.js:27846
__tryOrUnsub # Subscriber.js:185
next # Subscriber.js:124
_next # Subscriber.js:72
next # Subscriber.js:49
next # Subject.js:39
emit # core.js:27808
checkStable # core.js:30847
onHasTask # core.js:30924
hasTask # zone-evergreen.js:411
_updateTaskCount # zone-evergreen.js:431
_updateTaskCount # zone-evergreen.js:264
runTask # zone-evergreen.js:185
drainMicroTaskQueue # zone-evergreen.js:559
Promise.then (async)
scheduleMicroTask # zone-evergreen.js:542
scheduleTask # zone-evergreen.js:381
scheduleTask # zone-evergreen.js:211
scheduleMicroTask # zone-evergreen.js:231
scheduleResolveOrReject # zone-evergreen.js:845
then # zone-evergreen.js:955
bootstrapModule # core.js:31656
./src/main.ts # main.ts:11
__webpack_require__ # bootstrap:78
0 # main.ts:12
__webpack_require__ # bootstrap:78
checkDeferredModules # bootstrap:45
webpackJsonpCallback # bootstrap:32
(anonymous) # main.js:1
PizzaItemComponent.html:3 ERROR CONTEXT DebugContext_ {view: {…}, nodeIndex: 5, nodeDef: {…}, elDef: {…}, elView: {…}}elDef: {nodeIndex: 4, parent: {…}, renderParent: {…}, bindingIndex: 1, outputIndex: 0, …}elView: {def: {…}, parent: {…}, viewContainerParent: null, parentNodeDef: {…}, context: PizzaItemComponent, …}nodeDef: {nodeIndex: 5, parent: {…}, renderParent: {…}, bindingIndex: 1, outputIndex: 0, …}nodeIndex: 5view: {def: {…}, parent: {…}, viewContainerParent: null, parentNodeDef: {…}, context: PizzaItemComponent, …}component: (...)componentRenderElement: (...)context: (...)elOrCompView: (...)injector: (...)providerTokens: (...)references: (...)renderNode: (...)__proto__: Object
View_PizzaItemComponent_0 # PizzaItemComponent.html:3
proxyClass # compiler.js:19257
logError # core.js:36342
handleError # core.js:7244
(anonymous) # core.js:32092
invoke # zone-evergreen.js:359
run # zone-evergreen.js:124
runOutsideAngular # core.js:30830
tick # core.js:32089
(anonymous) # core.js:31927
invoke # zone-evergreen.js:359
onInvoke # core.js:30904
invoke # zone-evergreen.js:358
run # zone-evergreen.js:124
run # core.js:30769
next # core.js:31924
schedulerFn # core.js:27846
__tryOrUnsub # Subscriber.js:185
next # Subscriber.js:124
_next # Subscriber.js:72
next # Subscriber.js:49
next # Subject.js:39
emit # core.js:27808
checkStable # core.js:30847
onHasTask # core.js:30924
hasTask # zone-evergreen.js:411
_updateTaskCount # zone-evergreen.js:431
_updateTaskCount # zone-evergreen.js:264
runTask # zone-evergreen.js:185
drainMicroTaskQueue # zone-evergreen.js:559
Promise.then (async)
scheduleMicroTask # zone-evergreen.js:542
scheduleTask # zone-evergreen.js:381
scheduleTask # zone-evergreen.js:211
scheduleMicroTask # zone-evergreen.js:231
scheduleResolveOrReject # zone-evergreen.js:845
then # zone-evergreen.js:955
bootstrapModule # core.js:31656
./src/main.ts # main.ts:11
__webpack_require__ # bootstrap:78
0 # main.ts:12
__webpack_require__ # bootstrap:78
checkDeferredModules # bootstrap:45
webpackJsonpCallback # bootstrap:32
(anonymous) # main.js:1
Use the template expression operator ?. (the-safe-navigation-operator----and-null-property-paths) for dynamic property binding like,
<label>
{{ pizza?.name }}
</label>
I am trying to develop an app using ionic 4, angular 6, Nodejs 10 and need to integrate google maps. When I run my app, I always see this error in the dev tools browser console - [Browser][cordova.js][xhrStatusChangeHandler] Could not XHR config.xml: Not Found. Copied the full console at the end.
Following is the code I have -
app.module.ts
import { NgModule } from '#angular/core';
import { BrowserModule } from '#angular/platform-browser';
import { RouteReuseStrategy } from '#angular/router';
import { IonicModule, IonicRouteStrategy } from '#ionic/angular';
import { SplashScreen } from '#ionic-native/splash-screen/ngx';
import { StatusBar } from '#ionic-native/status-bar/ngx';
import { AppComponent } from './app.component';
import { AppRoutingModule } from './app-routing.module';
import { GoogleMaps } from '#ionic-native/google-maps';
#NgModule({
declarations: [AppComponent],
entryComponents: [],
imports: [
BrowserModule,
IonicModule.forRoot(),
AppRoutingModule
],
providers: [
StatusBar,
GoogleMaps,
SplashScreen,
{ provide: RouteReuseStrategy, useClass: IonicRouteStrategy }
],
bootstrap: [AppComponent]
})
export class AppModule {}
Following is my app.component.ts file -
import { Component, ViewChild } from '#angular/core';
import { Platform, Nav } from '#ionic/angular';
import { SplashScreen } from '#ionic-native/splash-screen/ngx';
import { StatusBar } from '#ionic-native/status-bar/ngx';
import { HomePage } from './home/home.page';
#Component({
selector: 'app-root',
templateUrl: 'app.component.html'
})
export class AppComponent {
#ViewChild(Nav) nav: Nav;
rootPage: any;
public appPages = [
{
title: 'Home',
url: '/home',
icon: 'home'
},
{
title: 'List',
url: '/list',
icon: 'list'
}
];
constructor(
private platform: Platform,
private splashScreen: SplashScreen,
private statusBar: StatusBar
) {
this.initializeApp();
}
initializeApp() {
this.platform.ready().then(() => {
this.rootPage = HomePage;
this.statusBar.styleDefault();
this.splashScreen.hide();
});
}
}
home.page.ts
import { Component, OnInit } from '#angular/core';
import { GoogleMaps, GoogleMap } from '#ionic-native/google-maps/ngx';
import { Platform } from '#ionic/angular';
import { Environment } from '#ionic-native/google-maps';
#Component({
selector: 'app-home',
templateUrl: 'home.page.html',
styleUrls: ['home.page.scss'],
})
export class HomePage implements OnInit {
map: GoogleMap;
constructor( private platform: Platform) {}
async ngOnInit() {
await this.platform.ready();
await this.loadMap();
}
loadMap() {
Environment.setEnv({
'API_KEY_FOR_BROWSER_RELEASE': 'Agktkllffff1xGYLjDF0v1i2RSDrqDLjEmDdLI',
'API_KEY_FOR_BROWSER_DEBUG': ''
});
this.map = GoogleMaps.create('map_canvas');
}
}
home.page.html
<ion-header>
<ion-toolbar>
<ion-buttons slot="start">
<ion-menu-button></ion-menu-button>
</ion-buttons>
<ion-title>
Home
</ion-title>
</ion-toolbar>
</ion-header>
<ion-content padding>
<h3>GoogleMaps</h3>
<div id = "map_canvas">
<button ion-button (click)="onButtonClick($event)">Demo</button>
</div>
</ion-content>
I checked my Google Map API key and it doesn't has problem and double checked that I am using the correct one. My account is also fine and shouldn't be a problem with that. I am wondering what is causing this issue. The command that I am using to run my application is -
ionic cordova run browser -l
The url that opens up is http://172.29.54.8:8100/home
console.log error details -
Angular is running in the development mode. Call enableProdMode() to enable the production mode.
cordova.js:1066 deviceready has not fired after 5 seconds.
cordova.js:1059 Channel not fired: onPluginsReady
cordova.js:1059 Channel not fired: onCordovaReady
bootstrap.js:15 Ionic Native: deviceready did not fire within 5000ms. This can happen when plugins are in an inconsistent state. Try removing plugins from plugins/ and reinstalling them.
(anonymous) # bootstrap.js:15
push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask # zone.js:421
push../node_modules/zone.js/dist/zone.js.Zone.runTask # zone.js:188
push../node_modules/zone.js/dist/zone.js.ZoneTask.invokeTask # zone.js:496
ZoneTask.invoke # zone.js:485
timer # zone.js:2054
setTimeout (async)
scheduleTask # zone.js:2075
push../node_modules/zone.js/dist/zone.js.ZoneDelegate.scheduleTask # zone.js:407
push../node_modules/zone.js/dist/zone.js.Zone.scheduleTask # zone.js:232
push../node_modules/zone.js/dist/zone.js.Zone.scheduleMacroTask # zone.js:255
scheduleMacroTaskWithCurrentZone # zone.js:1114
(anonymous) # zone.js:2090
proto.(anonymous function) # zone.js:1394
checkReady # bootstrap.js:13
./node_modules/#ionic-native/core/index.js # index.js:11
__webpack_require__ # bootstrap:83
./node_modules/#ionic-native/splash-screen/ngx/index.js # index.js:1
__webpack_require__ # bootstrap:83
./src/app/app.module.ts # app.component.ts:12
__webpack_require__ # bootstrap:83
./src/main.ts # main.ts:1
__webpack_require__ # bootstrap:83
0 # main.ts:12
__webpack_require__ # bootstrap:83
checkDeferredModules # bootstrap:45
webpackJsonpCallback # bootstrap:32
(anonymous) # main.js:1
cordova.js:1024 adding proxy for common
cordova.js:1024 adding proxy for PluginEnvironment
cordova.js:1024 adding proxy for CordovaGoogleMaps
cordova.js:1024 adding proxy for PluginLocationService
cordova.js:1024 adding proxy for PluginGeocoder
cordova.js:1024 adding proxy for StatusBar
cordova.js:1024 adding proxy for Device
cordova.js:1024 adding proxy for SplashScreen
StatusBarProxy.js:23 StatusBar is not supported
zone.js:2969 GET http://172.29.54.8:8100/config.xml 404 (Not Found)
scheduleTask # zone.js:2969
push../node_modules/zone.js/dist/zone.js.ZoneDelegate.scheduleTask # zone.js:407
push../node_modules/zone.js/dist/zone.js.Zone.scheduleTask # zone.js:232
push../node_modules/zone.js/dist/zone.js.Zone.scheduleMacroTask # zone.js:255
scheduleMacroTaskWithCurrentZone # zone.js:1114
(anonymous) # zone.js:3001
proto.(anonymous function) # zone.js:1394
readConfig # cordova.js:891
initAndShow # SplashScreenProxy.js:154
(anonymous) # SplashScreenProxy.js:165
build # cordova.js:51
require # cordova.js:66
localRequire # cordova.js:47
exports.mapModules # cordova.js:1352
(anonymous) # cordova.js:1152
f # cordova.js:645
Channel.fire # cordova.js:798
(anonymous) # cordova.js:1144
onScriptLoadingComplete # cordova.js:1574
scriptLoadedCallback # cordova.js:1591
(anonymous) # cordova.js:1545
wrapFn # zone.js:1188
push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask # zone.js:421
push../node_modules/zone.js/dist/zone.js.Zone.runTask # zone.js:188
push../node_modules/zone.js/dist/zone.js.ZoneTask.invokeTask # zone.js:496
invokeTask # zone.js:1540
globalZoneAwareCallback # zone.js:1566
error (async)
customScheduleGlobal # zone.js:1666
push../node_modules/zone.js/dist/zone.js.ZoneDelegate.scheduleTask # zone.js:407
onScheduleTask # zone.js:297
push../node_modules/zone.js/dist/zone.js.ZoneDelegate.scheduleTask # zone.js:401
push../node_modules/zone.js/dist/zone.js.Zone.scheduleTask # zone.js:232
push../node_modules/zone.js/dist/zone.js.Zone.scheduleEventTask # zone.js:258
(anonymous) # zone.js:1831
desc.set # zone.js:1244
requireEnsure # bootstrap:145
webpackAsyncContext # .*\.entry\.js$ include: \.entry\.js$ namespace object:780
o # ionic.core.js:6
t.In # ionic.core.js:9
$ # ionic.core.js:6
(anonymous) # ionic.core.js:6
r # ionic.core.js:6
(anonymous) # ionic.core.js:6
push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invoke # zone.js:388
onInvoke # core.js:14060
push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invoke # zone.js:387
push../node_modules/zone.js/dist/zone.js.Zone.run # zone.js:138
(anonymous) # zone.js:872
push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask # zone.js:421
onInvokeTask # core.js:14051
push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask # zone.js:420
push../node_modules/zone.js/dist/zone.js.Zone.runTask # zone.js:188
drainMicroTaskQueue # zone.js:595
Promise.then (async)
scheduleMicroTask # zone.js:578
push../node_modules/zone.js/dist/zone.js.ZoneDelegate.scheduleTask # zone.js:410
onScheduleTask # zone.js:297
push../node_modules/zone.js/dist/zone.js.ZoneDelegate.scheduleTask # zone.js:401
push../node_modules/zone.js/dist/zone.js.Zone.scheduleTask # zone.js:232
push../node_modules/zone.js/dist/zone.js.Zone.scheduleMicroTask # zone.js:252
scheduleResolveOrReject # zone.js:862
resolvePromise # zone.js:808
(anonymous) # zone.js:724
webpackJsonpCallback # bootstrap:25
(anonymous) # 12.js:1
cordova.js:866 [Browser][cordova.js][xhrStatusChangeHandler] Could not XHR config.xml: Not Found
fail # cordova.js:866
xhrStatusChangeHandler # cordova.js:880
push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask # zone.js:421
push../node_modules/zone.js/dist/zone.js.Zone.runTask # zone.js:188
push../node_modules/zone.js/dist/zone.js.ZoneTask.invokeTask # zone.js:496
invokeTask # zone.js:1540
globalZoneAwareCallback # zone.js:1566
load (async)
customScheduleGlobal # zone.js:1666
push../node_modules/zone.js/dist/zone.js.ZoneDelegate.scheduleTask # zone.js:407
push../node_modules/zone.js/dist/zone.js.Zone.scheduleTask # zone.js:232
push../node_modules/zone.js/dist/zone.js.Zone.scheduleEventTask # zone.js:258
(anonymous) # zone.js:1831
readConfig # cordova.js:886
initAndShow # SplashScreenProxy.js:154
(anonymous) # SplashScreenProxy.js:165
build # cordova.js:51
require # cordova.js:66
localRequire # cordova.js:47
exports.mapModules # cordova.js:1352
(anonymous) # cordova.js:1152
f # cordova.js:645
Channel.fire # cordova.js:798
(anonymous) # cordova.js:1144
onScriptLoadingComplete # cordova.js:1574
scriptLoadedCallback # cordova.js:1591
(anonymous) # cordova.js:1545
wrapFn # zone.js:1188
push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask # zone.js:421
push../node_modules/zone.js/dist/zone.js.Zone.runTask # zone.js:188
push../node_modules/zone.js/dist/zone.js.ZoneTask.invokeTask # zone.js:496
invokeTask # zone.js:1540
globalZoneAwareCallback # zone.js:1566
error (async)
customScheduleGlobal # zone.js:1666
push../node_modules/zone.js/dist/zone.js.ZoneDelegate.scheduleTask # zone.js:407
onScheduleTask # zone.js:297
push../node_modules/zone.js/dist/zone.js.ZoneDelegate.scheduleTask # zone.js:401
push../node_modules/zone.js/dist/zone.js.Zone.scheduleTask # zone.js:232
push../node_modules/zone.js/dist/zone.js.Zone.scheduleEventTask # zone.js:258
(anonymous) # zone.js:1831
desc.set # zone.js:1244
requireEnsure # bootstrap:145
webpackAsyncContext # .*\.entry\.js$ include: \.entry\.js$ namespace object:780
o # ionic.core.js:6
t.In # ionic.core.js:9
$ # ionic.core.js:6
(anonymous) # ionic.core.js:6
r # ionic.core.js:6
(anonymous) # ionic.core.js:6
push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invoke # zone.js:388
onInvoke # core.js:14060
push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invoke # zone.js:387
push../node_modules/zone.js/dist/zone.js.Zone.run # zone.js:138
(anonymous) # zone.js:872
push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask # zone.js:421
onInvokeTask # core.js:14051
push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask # zone.js:420
push../node_modules/zone.js/dist/zone.js.Zone.runTask # zone.js:188
drainMicroTaskQueue # zone.js:595
Promise.then (async)
scheduleMicroTask # zone.js:578
push../node_modules/zone.js/dist/zone.js.ZoneDelegate.scheduleTask # zone.js:410
onScheduleTask # zone.js:297
push../node_modules/zone.js/dist/zone.js.ZoneDelegate.scheduleTask # zone.js:401
push../node_modules/zone.js/dist/zone.js.Zone.scheduleTask # zone.js:232
push../node_modules/zone.js/dist/zone.js.Zone.scheduleMicroTask # zone.js:252
scheduleResolveOrReject # zone.js:862
resolvePromise # zone.js:808
(anonymous) # zone.js:724
webpackJsonpCallback # bootstrap:25
(anonymous) # 12.js:1
SplashScreenProxy.js:163 [Browser][cordova.js][xhrStatusChangeHandler] Could not XHR config.xml: Not Found
(anonymous) # SplashScreenProxy.js:163
fail # cordova.js:869
xhrStatusChangeHandler # cordova.js:880
push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask # zone.js:421
push../node_modules/zone.js/dist/zone.js.Zone.runTask # zone.js:188
push../node_modules/zone.js/dist/zone.js.ZoneTask.invokeTask # zone.js:496
invokeTask # zone.js:1540
globalZoneAwareCallback # zone.js:1566
load (async)
customScheduleGlobal # zone.js:1666
push../node_modules/zone.js/dist/zone.js.ZoneDelegate.scheduleTask # zone.js:407
push../node_modules/zone.js/dist/zone.js.Zone.scheduleTask # zone.js:232
push../node_modules/zone.js/dist/zone.js.Zone.scheduleEventTask # zone.js:258
(anonymous) # zone.js:1831
readConfig # cordova.js:886
initAndShow # SplashScreenProxy.js:154
(anonymous) # SplashScreenProxy.js:165
build # cordova.js:51
require # cordova.js:66
localRequire # cordova.js:47
exports.mapModules # cordova.js:1352
(anonymous) # cordova.js:1152
f # cordova.js:645
Channel.fire # cordova.js:798
(anonymous) # cordova.js:1144
onScriptLoadingComplete # cordova.js:1574
scriptLoadedCallback # cordova.js:1591
(anonymous) # cordova.js:1545
wrapFn # zone.js:1188
push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask # zone.js:421
push../node_modules/zone.js/dist/zone.js.Zone.runTask # zone.js:188
push../node_modules/zone.js/dist/zone.js.ZoneTask.invokeTask # zone.js:496
invokeTask # zone.js:1540
globalZoneAwareCallback # zone.js:1566
error (async)
customScheduleGlobal # zone.js:1666
push../node_modules/zone.js/dist/zone.js.ZoneDelegate.scheduleTask # zone.js:407
onScheduleTask # zone.js:297
push../node_modules/zone.js/dist/zone.js.ZoneDelegate.scheduleTask # zone.js:401
push../node_modules/zone.js/dist/zone.js.Zone.scheduleTask # zone.js:232
push../node_modules/zone.js/dist/zone.js.Zone.scheduleEventTask # zone.js:258
(anonymous) # zone.js:1831
desc.set # zone.js:1244
requireEnsure # bootstrap:145
webpackAsyncContext # .*\.entry\.js$ include: \.entry\.js$ namespace object:780
o # ionic.core.js:6
t.In # ionic.core.js:9
$ # ionic.core.js:6
(anonymous) # ionic.core.js:6
r # ionic.core.js:6
(anonymous) # ionic.core.js:6
push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invoke # zone.js:388
onInvoke # core.js:14060
push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invoke # zone.js:387
push../node_modules/zone.js/dist/zone.js.Zone.run # zone.js:138
(anonymous) # zone.js:872
push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask # zone.js:421
onInvokeTask # core.js:14051
push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask # zone.js:420
push../node_modules/zone.js/dist/zone.js.Zone.runTask # zone.js:188
drainMicroTaskQueue # zone.js:595
Promise.then (async)
scheduleMicroTask # zone.js:578
push../node_modules/zone.js/dist/zone.js.ZoneDelegate.scheduleTask # zone.js:410
onScheduleTask # zone.js:297
push../node_modules/zone.js/dist/zone.js.ZoneDelegate.scheduleTask # zone.js:401
push../node_modules/zone.js/dist/zone.js.Zone.scheduleTask # zone.js:232
push../node_modules/zone.js/dist/zone.js.Zone.scheduleMicroTask # zone.js:252
scheduleResolveOrReject # zone.js:862
resolvePromise # zone.js:808
(anonymous) # zone.js:724
webpackJsonpCallback # bootstrap:25
(anonymous) # 12.js:1
bootstrap.js:10 Ionic Native: deviceready event fired after 15597 ms
StatusBarProxy.js:23 StatusBar is not supported
cordova.js:1024 adding proxy for map_0_605401752643
util.js:225 Google Maps JavaScript API warning: NoApiKeys https://developers.google.com/maps/documentation/javascript/error-messages#no-api-keys
try {
xhr.open("get", "/config.xml", true);
xhr.send();
} catch(e) {
fail('[Browser][cordova.js][readConfig] Could not XHR config.xml: ' + JSON.stringify(e));
}
Try to find these lines in cordova.js file of the platform.
I guess your application is in a sub-folder. Hence the error. Change it to
try {
xhr.open("get", "/<foldername>/config.xml", true);
xhr.send();
} catch(e) {
fail('[Browser][cordova.js][readConfig] Could not XHR config.xml: ' + JSON.stringify(e));
}
I meet the problem when I run command
ionic cordova build browser
and gulp wrong build content to the serve,
wwwunber platforms/browser is the correct one
the wwwunder project folder is wrong one
In my case I am launching my app like the following
http://1.2.3.4/MyApp.BETA/
I think a better approach is to assume current directory instead of root. Therefor the fix should be:
xhr.open("get", "./config.xml", true);
Where is the source of this cordova.js?
Who should be notified to fix this? Cordova?
Thank you.
I'm trying to POST data from a website to a Web API endpoint on the same server with the same domain name, but a different port number. It works with IE11 both locally and on our test server, but Chrome only works locally. On the test server I get a 404 error. As far as I can tell, it qualifies as a "simple" request, however the 404 error shows the HTTP Method was "OPTIONS", so it must be making a preflight request and failing on that.
zone.js:2933 OPTIONS http://example.com:8001/api/search/quickSearch?v=1.35.2664 404 (Not Found)
scheduleTask # zone.js:2933
webpackJsonp.../../../../zone.js/dist/zone.js.ZoneDelegate.scheduleTask # zone.js:411
onScheduleTask # zone.js:301
webpackJsonp.../../../../zone.js/dist/zone.js.ZoneDelegate.scheduleTask # zone.js:405
webpackJsonp.../../../../zone.js/dist/zone.js.Zone.scheduleTask # zone.js:236
webpackJsonp.../../../../zone.js/dist/zone.js.Zone.scheduleMacroTask # zone.js:259
(anonymous) # zone.js:2966
proto.(anonymous function) # zone.js:1366
(anonymous) # angular.js:12587
sendReq # angular.js:12332
serverRequest # angular.js:12084
processQueue # angular.js:16832
(anonymous) # angular.js:16876
$digest # angular.js:17971
(anonymous) # static.js:1502
schedulerFn # core.js:4351
webpackJsonp.../../../../rxjs/_esm5/Subscriber.js.SafeSubscriber.__tryOrUnsub # Subscriber.js:240
webpackJsonp.../../../../rxjs/_esm5/Subscriber.js.SafeSubscriber.next # Subscriber.js:187
webpackJsonp.../../../../rxjs/_esm5/Subscriber.js.Subscriber._next # Subscriber.js:128
webpackJsonp.../../../../rxjs/_esm5/Subscriber.js.Subscriber.next # Subscriber.js:92
webpackJsonp.../../../../rxjs/_esm5/Subject.js.Subject.next # Subject.js:56
webpackJsonp.../../../core/esm5/core.js.EventEmitter.emit # core.js:4319
checkStable # core.js:4718
onLeave # core.js:4797
onInvokeTask # core.js:4747
webpackJsonp.../../../../zone.js/dist/zone.js.ZoneDelegate.invokeTask # zone.js:424
webpackJsonp.../../../../zone.js/dist/zone.js.Zone.runTask # zone.js:192
webpackJsonp.../../../../zone.js/dist/zone.js.ZoneTask.invokeTask # zone.js:499
ZoneTask.invoke # zone.js:488
timer # zone.js:2040
setTimeout (async)
scheduleTask # zone.js:2056
webpackJsonp.../../../../zone.js/dist/zone.js.ZoneDelegate.scheduleTask # zone.js:411
onScheduleTask # zone.js:301
webpackJsonp.../../../../zone.js/dist/zone.js.ZoneDelegate.scheduleTask # zone.js:405
webpackJsonp.../../../../zone.js/dist/zone.js.Zone.scheduleTask # zone.js:236
webpackJsonp.../../../../zone.js/dist/zone.js.Zone.scheduleMacroTask # zone.js:259
(anonymous) # zone.js:2072
proto.(anonymous function) # zone.js:1366
setTimeout # lodash.js:6663
timerExpired # lodash.js:10388
webpackJsonp.../../../../zone.js/dist/zone.js.ZoneDelegate.invokeTask # zone.js:425
onInvokeTask # core.js:4744
webpackJsonp.../../../../zone.js/dist/zone.js.ZoneDelegate.invokeTask # zone.js:424
webpackJsonp.../../../../zone.js/dist/zone.js.Zone.runTask # zone.js:192
webpackJsonp.../../../../zone.js/dist/zone.js.ZoneTask.invokeTask # zone.js:499
ZoneTask.invoke # zone.js:488
timer # zone.js:2040
setTimeout (async)
scheduleTask # zone.js:2056
webpackJsonp.../../../../zone.js/dist/zone.js.ZoneDelegate.scheduleTask # zone.js:411
onScheduleTask # zone.js:301
webpackJsonp.../../../../zone.js/dist/zone.js.ZoneDelegate.scheduleTask # zone.js:405
webpackJsonp.../../../../zone.js/dist/zone.js.Zone.scheduleTask # zone.js:236
webpackJsonp.../../../../zone.js/dist/zone.js.Zone.scheduleMacroTask # zone.js:259
(anonymous) # zone.js:2072
proto.(anonymous function) # zone.js:1366
setTimeout # lodash.js:6663
leadingEdge # lodash.js:10358
debounced # lodash.js:10425
fn # VM445:4
$eval # angular.js:18161
(anonymous) # angular.js:25998
(anonymous) # angular.js:28813
forEach # angular.js:403
$$writeModelToScope # angular.js:28811
writeToModelIfNeeded # angular.js:28804
(anonymous) # angular.js:28798
validationDone # angular.js:28723
processAsyncValidators # angular.js:28706
$$runValidators # angular.js:28650
$$parseAndValidate # angular.js:28791
$commitViewValue # angular.js:28757
(anonymous) # angular.js:28898
$eval # angular.js:18161
$apply # angular.js:18261
$$debounceViewValueCommit # angular.js:28897
$setViewValue # angular.js:28875
listener # angular.js:24822
dispatch # jquery.js:4737
elemData.handle # jquery.js:4549
webpackJsonp.../../../../zone.js/dist/zone.js.ZoneDelegate.invokeTask # zone.js:425
onInvokeTask # core.js:4744
webpackJsonp.../../../../zone.js/dist/zone.js.ZoneDelegate.invokeTask # zone.js:424
webpackJsonp.../../../../zone.js/dist/zone.js.Zone.runTask # zone.js:192
webpackJsonp.../../../../zone.js/dist/zone.js.ZoneTask.invokeTask # zone.js:499
invokeTask # zone.js:1540
globalZoneAwareCallback # zone.js:1566
(index):1 Failed to load http://example.com:8001/api/search/quickSearch?v=1.35.2664: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://example.com' is therefore not allowed access. The response had HTTP status code 404.
Here's what my Global.asax looks like to enable CORS requests:
protected void Application_BeginRequest(object sender, EventArgs e)
{
HttpContext.Current.Response.AddHeader("Access-Control-Allow-Origin", ConfigurationManager.AppSettings["RootUri"].TrimEnd('/'));
HttpContext.Current.Response.AddHeader("Access-Control-Allow-Methods", "GET, POST, HEAD, PUT, DELETE, OPTIONS");
HttpContext.Current.Response.AddHeader("Access-Control-Max-Age", "30");
HttpContext.Current.Response.AddHeader("Access-Control-Allow-Credentials", "true");
HttpContext.Current.Response.AddHeader("Access-Control-Allow-Headers", "Accept, Accept-CH, Accept-Charset, Accept-Datetime, Accept-Encoding, Accept-Ext, Accept-Features, Accept-Language, Accept-Params, Accept-Ranges, Access-Control-Allow-Credentials, Access-Control-Allow-Headers, Access-Control-Allow-Methods, Access-Control-Allow-Origin, Access-Control-Expose-Headers, Access-Control-Max-Age, Access-Control-Request-Headers, Access-Control-Request-Method, Age, Allow, Alternates, Authentication-Info, Authorization, C-Ext, C-Man, C-Opt, C-PEP, C-PEP-Info, CONNECT, Cache-Control, Compliance, Connection, Content-Base, Content-Disposition, Content-Encoding, Content-ID, Content-Language, Content-Length, Content-Location, Content-MD5, Content-Range, Content-Script-Type, Content-Security-Policy, Content-Style-Type, Content-Transfer-Encoding, Content-Type, Content-Version, Cookie, Cost, DAV, DELETE, DNT, DPR, Date, Default-Style, Delta-Base, Depth, Derived-From, Destination, Differential-ID, Digest, ETag, Expect, Expires, Ext, From, GET, GetProfile, HEAD, HTTP-date, Host, IM, If, If-Match, If-Modified-Since, If-None-Match, If-Range, If-Unmodified-Since, Keep-Alive, Label, Last-Event-ID, Last-Modified, Link, Location, Lock-Token, MIME-Version, Man, Max-Forwards, Media-Range, Message-ID, Meter, Negotiate, Non-Compliance, OPTION, OPTIONS, OWS, Opt, Optional, Ordering-Type, Origin, Overwrite, P3P, PEP, PICS-Label, POST, PUT, Pep-Info, Permanent, Position, Pragma, ProfileObject, Protocol, Protocol-Query, Protocol-Request, Proxy-Authenticate, Proxy-Authentication-Info, Proxy-Authorization, Proxy-Features, Proxy-Instruction, Public, RWS, Range, Referer, Refresh, Resolution-Hint, Resolver-Location, Retry-After, Safe, Sec-Websocket-Extensions, Sec-Websocket-Key, Sec-Websocket-Origin, Sec-Websocket-Protocol, Sec-Websocket-Version, Security-Scheme, Server, Set-Cookie, Set-Cookie2, SetProfile, SoapAction, Status, Status-URI, Strict-Transport-Security, SubOK, Subst, Surrogate-Capability, Surrogate-Control, TCN, TE, TRACE, Timeout, Title, Trailer, Transfer-Encoding, UA-Color, UA-Media, UA-Pixels, UA-Resolution, UA-Windowpixels, URI, Upgrade, User-Agent, Variant-Vary, Vary, Version, Via, Viewport-Width, WWW-Authenticate, Want-Digest, Warning, Width, X-Content-Duration, X-Content-Security-Policy, X-Content-Type-Options, X-CustomHeader, X-DNSPrefetch-Control, X-Forwarded-For, X-Forwarded-Port, X-Forwarded-Proto, X-Frame-Options, X-Modified, X-OTHER, X-PING, X-PINGOTHER, X-Powered-By, X-Requested-With");
// If a preflight request, end it so we don't fetch data.
if (HttpContext.Current.Request.HttpMethod == "OPTIONS")
{
HttpContext.Current.Response.End();
}
}
Why am I getting a 404 and how can I fix it?
Chrome and Safari may also make preflight OPTIONS requests for non-GET methods (e.g. POST).
I'm not sure what ConfigurationManager.AppSettings["RootUri"].TrimEnd('/') resolves to - the ACAO response headers must either be an asterisk or (as it appears you're trying to do) an FQDN, including the scheme and port (if the port isn't 80 or 443) - so in your case, it must have an EXACT value of "http://example.com:8001". It's much simpler to simply mirror back the value of the Origin request header (which will have that value).
Can you post the request and response headers?
Same issue calling a method
$.ajax({
url:'/Home/Read'
Use
$.ajax({
url:'../Home/Read'