#5 Ionic4(아이오닉4) http get 방식

이제 json data를 http 통신을 통해서 가져오도록 해보자

https://ionicframework.com/docs/native/http

Ionic Documentation

만약에 import를 할때 다음과 같은 에러가 나온다면

npm i @ionic-native/http@beta --save
npm i @ionic-native/core@beta --save

진행 후 다시 한번 http를 install해보자 

(필자는 Ionic3 documents를 보고 하다가 버전이 꼬였는지 다음과 같은 에러가 나와서 수정 후 진행했다 참고바람)

ionic cordova plugin add cordova-plugin-advanced-http

콘솔에 또 이상한게 나왔다. 아마 cordova plugin을 깔으라는것 같은데 터미널에 또 적어준다.

자 이제 다시 ionic serve를 실행해보자. 이런 또 크롬 콘솔에 cors 에러가 떳다

https://ionicframework.com/docs/faq/cors#cors-headers

Ionic Documentation

친절하게 설명되어있으니 참고

근데 또 에러를 내뱉는다 아 혈압상승..

ionic serve로는 json data를 get을 못한다는 내용이다 마지막에 쓰여있는것 처럼

디바이스/에뮬레이터 또는 ionic brower를 실행해야한다.

ionic cordova run browser

---

그럼 이제 데이터를 뽑아보자

url 접속 후 data를 json으로 출력해서 가져오기

 async getData(){

        const url = url;
        const params = {
          
        };
        const headers = {
          'Access-Control-Allow-Origin':'*'
        };
  
        const response = await this.http.get(url, params, headers);

        let data = JSON.parse(response.data);
        console.log(data.result[0]);


  
        // console.log(response.status);
        // console.log(JSON.parse(response.data)); // JSON data returned by server
        // console.log(response.headers);
  
    }

headers에 헤더값 추가 후 this.http.get 실행하면 끝!

response.status 200이면 성공!