Issue Description
I have a NativeScript with angular project. The backend is a rest api written in .NET CORE. I'm trying to make a HTTP call fom the nativescript frontend using angular following the post method as described in the link: https://v6.docs.nativescript.org/angular/ng-framework-modules/http#http-post
Whenever I make a call, I get error 'JS: ReferenceError: URL is not defined'
Reproduction
app.module.ts
import { NgModule, NO_ERRORS_SCHEMA } from '@angular/core'
import { NativeScriptHttpClientModule } from "@nativescript/angular";
import { NativeScriptModule } from '@nativescript/angular'
import { NativeScriptCommonModule } from "@nativescript/angular";
import { NativeScriptRouterModule } from "@nativescript/angular";
import { NativeScriptFormsModule } from "@nativescript/angular";
import { AppRoutingModule } from './app-routing.module'
@NgModule({
bootstrap: [AppComponent],
imports: [
NativeScriptModule,
NativeScriptHttpClientModule,
NativeScriptCommonModule,
NativeScriptRouterModule,
NativeScriptFormsModule,
AppRoutingModule,
],
declarations: [AppComponent],
providers: [],
schemas: [NO_ERRORS_SCHEMA],
})
export class AppModule {}
authservice.ts :
import { Injectable } from '@angular/core';
import { RouterExtensions } from "@nativescript/angular";
import { HttpClient, HttpHeaders } from "@angular/common/http";
import { CommonCodeService } from "./common-code-service";
import { LoginRequestDTO, LoginResponseDTO} from "../data-models/login-model";
@Injectable({
providedIn: 'root'
})
export class AuthenticationService {
loginModelData: LoginRequestDTO = {
Username:"",
Password:""
}
loginResponseData: LoginResponseDTO = {
isLoginSuccess:false,
responseMessage:"",
userId:"",
token:"",
firstname:""
};
isLoginValid: boolean = false;
constructor(
private router: RouterExtensions,
private http: HttpClient,
private commonCodeService: CommonCodeService) { }
private createRequestOptions() {
let headers = new HttpHeaders({
"Content-Type": "application/json"
});
return headers;
}
login(username: string, password:string){
this.loginModelData.Username=username;
this.loginModelData.Password=password;
let apiURL = "http://10.0.2.2:4001/api/Login/Login"; //Since api runs on localhost, i use 10.0.2.2 from android emulator to invoke localhost
let options = this.createRequestOptions();
this.http.post(apiURL, {this.loginModelData}, {headers: options} )
.subscribe(res => {
const result = <LoginResponseDTO>res;
if(result!=null)
{
this.loginResponseData = <LoginResponseDTO>result;
if(this.loginResponseData.isLoginSuccess)
{
this.isLoginValid=true;
this.router.navigate(["home"], { clearHistory: true });
}
else
{
this.isLoginValid=false;
}
}
else
{
this.commonCodeService.alert('User data not found. Please try again');
}
},
(e) => {
console.log(e);
});
}
}
Relevant log output (if applicable)
JS: ReferenceError: URL is not defined
Environment
pacjage.json
{
"name": "ns-myapp",
"main": "./src/main.ts",
"version": "1.0.0",
"private": true,
"dependencies": {
"@angular/animations": "~13.2.0",
"@angular/common": "~13.2.0",
"@angular/compiler": "~13.2.0",
"@angular/core": "~13.2.0",
"@angular/forms": "~13.2.0",
"@angular/platform-browser": "~13.2.0",
"@angular/platform-browser-dynamic": "~13.2.0",
"@angular/router": "~13.2.0",
"@auth0/angular-jwt": "^5.0.2",
"@nativescript/angular": "^14.0.4",
"@nativescript/core": "~8.2.0",
"@nativescript/theme": "~3.0.2",
"crypto-js": "^3.3.0",
"nativescript-audio": "^6.2.6",
"nativescript-gif": "^5.0.0",
"nativescript-ui-gauge": "^8.0.1",
"nativescript-vibrate": "^4.0.1",
"nativescript-videoplayer": "^5.0.1",
"rxjs": "~7.5.0",
"zone.js": "~0.11.5"
},
"devDependencies": {
"@angular-devkit/build-angular": "~13.2.0",
"@angular/compiler-cli": "~13.2.0",
"@nativescript/android": "8.2.3",
"@nativescript/types": "~8.2.0",
"@nativescript/webpack": "~5.0.6",
"@ngtools/webpack": "~13.2.0",
"typescript": "~4.5.5"
}
}
tsconfig.json
{
"compilerOptions": {
"module": "esnext",
"target": "es2017",
"moduleResolution": "node",
"experimentalDecorators": true,
"emitDecoratorMetadata": true,
"noEmitHelpers": true,
"importHelpers":true,
"noEmitOnError": true,
"skipLibCheck": true,
"lib": ["es2017", "dom"],
"baseUrl": ".",
"paths": {
"~/": ["src/"],
"@/": ["src/"]
}
},
"include": ["src/tests//*.ts", "src//.ios.ts", "src/**/.android.ts"],
"files": ["./src/main.ts", "./references.d.ts", "./src/polyfills.ts"],
"exclude": ["node_modules", "platforms", "e2e"]
}
Please accept these terms
Issue Description
I have a NativeScript with angular project. The backend is a rest api written in .NET CORE. I'm trying to make a HTTP call fom the nativescript frontend using angular following the post method as described in the link: https://v6.docs.nativescript.org/angular/ng-framework-modules/http#http-post
Whenever I make a call, I get error 'JS: ReferenceError: URL is not defined'
Reproduction
app.module.ts
import { NgModule, NO_ERRORS_SCHEMA } from '@angular/core'
import { NativeScriptHttpClientModule } from "@nativescript/angular";
import { NativeScriptModule } from '@nativescript/angular'
import { NativeScriptCommonModule } from "@nativescript/angular";
import { NativeScriptRouterModule } from "@nativescript/angular";
import { NativeScriptFormsModule } from "@nativescript/angular";
import { AppRoutingModule } from './app-routing.module'
@NgModule({
bootstrap: [AppComponent],
imports: [
NativeScriptModule,
NativeScriptHttpClientModule,
NativeScriptCommonModule,
NativeScriptRouterModule,
NativeScriptFormsModule,
AppRoutingModule,
],
declarations: [AppComponent],
providers: [],
schemas: [NO_ERRORS_SCHEMA],
})
export class AppModule {}
authservice.ts :
import { Injectable } from '@angular/core';
import { RouterExtensions } from "@nativescript/angular";
import { HttpClient, HttpHeaders } from "@angular/common/http";
import { CommonCodeService } from "./common-code-service";
import { LoginRequestDTO, LoginResponseDTO} from "../data-models/login-model";
@Injectable({
providedIn: 'root'
})
export class AuthenticationService {
loginModelData: LoginRequestDTO = {
Username:"",
Password:""
}
loginResponseData: LoginResponseDTO = {
isLoginSuccess:false,
responseMessage:"",
userId:"",
token:"",
firstname:""
};
isLoginValid: boolean = false;
constructor(
private router: RouterExtensions,
private http: HttpClient,
private commonCodeService: CommonCodeService) { }
private createRequestOptions() {
let headers = new HttpHeaders({
"Content-Type": "application/json"
});
return headers;
}
}
Relevant log output (if applicable)
Environment
pacjage.json
{
"name": "ns-myapp",
"main": "./src/main.ts",
"version": "1.0.0",
"private": true,
"dependencies": {
"@angular/animations": "~13.2.0",
"@angular/common": "~13.2.0",
"@angular/compiler": "~13.2.0",
"@angular/core": "~13.2.0",
"@angular/forms": "~13.2.0",
"@angular/platform-browser": "~13.2.0",
"@angular/platform-browser-dynamic": "~13.2.0",
"@angular/router": "~13.2.0",
"@auth0/angular-jwt": "^5.0.2",
"@nativescript/angular": "^14.0.4",
"@nativescript/core": "~8.2.0",
"@nativescript/theme": "~3.0.2",
"crypto-js": "^3.3.0",
"nativescript-audio": "^6.2.6",
"nativescript-gif": "^5.0.0",
"nativescript-ui-gauge": "^8.0.1",
"nativescript-vibrate": "^4.0.1",
"nativescript-videoplayer": "^5.0.1",
"rxjs": "~7.5.0",
"zone.js": "~0.11.5"
},
"devDependencies": {
"@angular-devkit/build-angular": "~13.2.0",
"@angular/compiler-cli": "~13.2.0",
"@nativescript/android": "8.2.3",
"@nativescript/types": "~8.2.0",
"@nativescript/webpack": "~5.0.6",
"@ngtools/webpack": "~13.2.0",
"typescript": "~4.5.5"
}
}
tsconfig.json
{
"compilerOptions": {
"module": "esnext",
"target": "es2017",
"moduleResolution": "node",
"experimentalDecorators": true,
"emitDecoratorMetadata": true,
"noEmitHelpers": true,
"importHelpers":true,
"noEmitOnError": true,
"skipLibCheck": true,
"lib": ["es2017", "dom"],
"baseUrl": ".",
"paths": {
"~/": ["src/"],
"@/": ["src/"]
}
},
"include": ["src/tests//*.ts", "src//.ios.ts", "src/**/.android.ts"],
"files": ["./src/main.ts", "./references.d.ts", "./src/polyfills.ts"],
"exclude": ["node_modules", "platforms", "e2e"]
}
Please accept these terms