i am developing a hybrid live streaming app in ionic4. i have to load remote data from json to get url of my chennal for live streaming. I am using http method to get data from json but i am getting error of “No ‘Access-Control-Allow-Origin’ header is present on the requested resource.” So that’s why i am using CORS policy of IONIC to avoid this error. But now i am facing error of " Types of property ‘headers’ are incompatible. [ng] Type ‘Headers’ is not assignable to type ‘HttpHeaders | { [header: string]: string | string; }’. [ng] Type ‘Headers’ is not assignable to type ‘{ [header: string]: string | string; }’. [ng] Index signature is missing in type ‘Headers’."
I am using http method to get data from json but i am getting error of “No ‘Access-Control-Allow-Origin’ header is present on the requested resource.” So that’s why i am using CORS policy of IONIC to avoid this error.
[ng] ERROR in src/app/services/reddit-data.service.ts(56,75): error TS2345: Argument of type ‘{ headers: Headers; }’ is not assignable to parameter of type ‘{ headers?: HttpHeaders | { [header: string]: string | string; }; observe?: “body”; params?: HttpParams | { [param: string]: string | string; }; reportProgress?: boolean; responseType?: “json”; withCredentials?: boolean; }’. [ng] Types of property ‘headers’ are incompatible. [ng] Type ‘Headers’ is not assignable to type ‘HttpHeaders | { [header: string]: string | string; }’. [ng] Type ‘Headers’ is not assignable to type ‘{ [header: string]: string | string; }’. [ng] Index signature is missing in type ‘Headers’.
1.At your server side you need to implement CROS so that server should accept request from
different origins.
In Ionic whenever we calling api and if request is from Android then origin address is http://localhost but when we are doing it from iOS then its
ionic://localhost.
So you need to define it in your server side with CORS rules that server should response to
request which comes from http://localhost or ionic://localhost.
Then it should work
2.Another workaround is use Native HTTP to call api.Sometimes angular http not working in Ionic
for iOS and Android.
That time we can use native http plugin
import { HTTP} from ‘@ionic-native/http/ngx’
Give it try hope it helps.
i have one more issue…Actually i want to get an object from json file. After getting the specific object i want to decode that object value and store it in a variable. So that i can use it anywhere else.
I want to get url object from json data and decode url … i try to load it but it doesn’t show any data and the atob function for decoding is not working…
Please help me to solve my problem… Service
async getRemoteData(){
this.http.get('url', {}, {})
.then(data => {
console.log(data.status);
console.log(data.data); // data received by server
console.log(data.headers);
console.log(data);
//let url=(atob(data.url));
console.log(data.data.stream);
})
.catch(error => {
console.log(error.status);
console.log(error.error); // error message as string
console.log(error.headers);
});
}
live streming function where i want to put decoded url for live streming