Core.js:6014 ERROR SyntaxError: Unexpected token < in JSON at position 0

I am getting the following error in Ionic CRUD app
core.js:6014 ERROR SyntaxError: Unexpected token < in JSON at position 0
at JSON.parse ()
at Response.json (http.js:845)
at MapSubscriber.project (post-provider.ts:16)
at MapSubscriber._next (map.js:29)
at MapSubscriber.next (Subscriber.js:49)
at XMLHttpRequest.onLoad (http.js:1263)
at ZoneDelegate.invokeTask (zone-evergreen.js:391)
at Object.onInvokeTask (core.js:39680)
at ZoneDelegate.invokeTask (zone-evergreen.js:390)
at Zone.runTask (zone-evergreen.js:168)

post-provider.ts file

import {Injectable} from ‘@angular/core’;

import {Http,Headers, RequestOptions} from ‘@angular/http’;

import ‘rxjs/add/operator/map’;

@Injectable()

export class PostProvider{

    server: string = "https://localhost/tutorial/server_api/";

    constructor (public http: Http){

     }

     postdata (body,file){

         let type= "application/json; charset=UTF-8";

         let headers= new Headers({'content-type':type});

         let options = new RequestOptions({headers: headers});

         return this.http.post(this.server + file, JSON.stringify(body),options)

         .map (res => res.json());

     }

}

process-api file

<?php header('Access-Control-Allow-Origin:*'); header ("Access-Control-Allow-Credentials: true"); header ("Access-Control-Allow-Methods: POST,GET,OPTIONS"); header ("Access-Control-Allow-Headers: Content-Type, Authorization, X-Requested-With"); header ( "Content-Type: application/json; charset=utf-8"); include "library/config.php"; $postjson= json_decode(file_get_contents('php://input'),true); $today= date('y-m-d'); if ($postjson['aksi']=='add'){ $query= mysqli_query($mysqli,"insret into master_customer set name_customer= '$postjson[name_customer]', desc_customer= '$postjson[desc_customer]', created_at= '$today' "); $idcust= mysqli_insert_id($mysqli); if($query) $result= json_encode (array('success'=>true, 'customer_id'=>$id_cust)); else $result=(array('success'=>false)); echo ($result); } ?>

addcustomer.page.ts

import { Component, OnInit } from ‘@angular/core’;

import { Router } from ‘@angular/router’;

import {PostProvider} from ‘…/…/providers/post-provider’;

import { resolve } from ‘url’;

@Component({

selector: ‘app-addcustomer’,

templateUrl: ‘./addcustomer.page.html’,

styleUrls: [’./addcustomer.page.scss’],

})

export class AddcustomerPage implements OnInit {

name_customer: String = “”;

desc_customer: String="";

constructor( private router: Router, private postpvdr: PostProvider) { }

ngOnInit() {

}

customer(){

this.router.navigate(['/customer']);

}

createdprocess(){

return new Promise (resolve=> {

  let body= {

    aksi: 'add',

    name_customer: this.name_customer,

    desc_customer: this.desc_customer,

  };

  this.postpvdr.postdata(body,'process-api.php').subscribe(data=>{

    this.router.navigate(['/customer']);

    console.log('ok');

  });

});

}

}

I would suggest starting completely over from scratch here and following the idioms outlined in the Tour of Heroes part 6 instead. You do not want to be using the very obsolete Http. You do not want to be manually instantiating Promises. You do not want to be manually marshalling and unmarshalling JSON. You do not want to be manually setting headers.

All that being said, your proximate problem would seem to lie on the server. It’s not returning JSON when expected.