外部データ取り込み色々テスト中5
前回、判ったというレベルでは無いですがangularで使われるRxJSライブラリーを調べてみました。
アクションゲーム等でも使えそうな機能でもある事は理解しました。
ただ、現状、必要なのはシナリオデータを別な(任意の)サーバからでも取ってこれる手法です。
ちょっとまとめますと
・HTMLとjavascriptでJSONPと言う形式でデータの読み込みは成功
・ionicでは、(少なくとも同じ方法では)動かない
・Angularには、JSONPを読み込む方法があるようだ(ionicプロジェクトをType="angular"で作成している)
・利用にはRxJSライブラリーが必要なようだ
・RxJSを勉強しよう(←今ここ)
となっています。
多少は(少なくとも使っている用語に聞き覚えがある程度には)なじんだはずですので、Angularの公式サイトの
HTTPによるバックエンドサービスとの通信
https://angular.jp/guide/http
の方法を見ていきます。
まず"app/app.module.ts"に"HttpClientModule"のインポートを行います。
(@NgModule内のimportsもお忘れなく!)
その後、"JSONPリクエストの作成"の項目へ移動しますが、そのまま使うにはいくつか問題ありそうなので"JSON以外のデータをリクエストする"の方法を試す事にします。
サンプルコードを入れるといくつかエラーが出るので
・import { HttpClient } from '@angular/common/http';
・変数としてhttp:HttpClientを定義
・import {tap} from 'rxjs/operators'
・this.log(filename, data),とthis.logError(filename, error)をconsole.log(~~)にした
(どうしてよいか判らなかったので)
さて、"ionic serve"で実行すると以下のエラーがコンソールに表示されました。
---------------------------------------------------------------
ERROR TypeError: Cannot read properties of undefined (reading 'get')
at HomePage.getTextFile (home.page.ts:49:22)
at HomePage.ionViewDidEnter (home.page.ts:43:10)
at HTMLElement.handler (ionic-angular.js:2373:37)
at _ZoneDelegate.invokeTask (zone.js:443:35)
at Object.onInvokeTask (core.mjs:26363:33)
at _ZoneDelegate.invokeTask (zone.js:442:64)
at Zone.runTask (zone.js:214:51)
at ZoneTask.invokeTask [as invoke] (zone.js:525:38)
at invokeTask (zone.js:1727:22)
at globalCallback (zone.js:1758:31)
---------------------------------------------------------------
どうもoptionの設定をしていないのが原因か?
そのままではimport不足の様なので
import { HttpClient , HttpHeaders, HttpParams} from '@angular/common/http';
に追加変更
その他もろもろ変更で、動く事は動くが、CORSエラーで拒否
Localhostだからって事もある?
う~ん、判らない・・・
夕飯落ち前に投稿