あるSEのつぶやき・改

ITやシステム開発などの技術に関する話題を、取り上げたりしています。

Angularで外部JavaScriptを読み込みHTML要素を書き換える方法

Angular でプログラムを書いていると、どうしても画面の遷移時に JavaScript を実行させたくなります。 ですが、テンプレートの HTML に <script>要素で処理を記述しても、テンプレート適用時に無効になってしまいます。 そこで調べてみたところ、コンポーネントの初…

Fix: oauthService.getIdentityClaims always returns null with implicit flow

Angular の angular-oauth2-oidc ライブラリで、Google の OAuth 認証を行おうとしたら、this.oauthService.getIdentityClaims();が必ず null を返してきて、ユーザーの情報が取得できませんでした。 原因がいくつか分かったので、メモとして残しておきます…

Fix:ERROR Error: Uncaught (in promise): Error: Cannot match any routes. URL Segment: 'state' Error: Cannot match any routes

Angular で OAuth の処理を行っている際に、以下のエラーが出力されました。 ERROR Error: Uncaught (in promise): Error: Cannot match any routes. URL Segment: 'state' Error: Cannot match any routes. URL Segment: 'state' at Anonymous function (ht…

Fix:ERROR Error: StaticInjectorError(AppModule)[OAuthService -> HttpClient]: StaticInjectorError(Platform: core)[OAuthService -> HttpClient]: NullInjectorError: No provider for HttpClient!

Angular で OAuth の処理を行っている際に、以下のエラーが表示されました。 ERROR Error: StaticInjectorError(AppModule)[OAuthService -> HttpClient]: StaticInjectorError(Platform: core)[OAuthService -> HttpClient]: NullInjectorError: No provide…

AngularなSPAでリロード時にアクセスエラーが起きる問題の解消方法

Angular な SPA を、Amazon S3 + CloudFront の環境にアップロードしていたのですが、デフォルトのルーティング設定だと、リロード時に以下のようなアクセスエラー(403? 404?)が発生してしまいます。 <Error> <Code>AccessDenied</Code> <Message>Access Denied</Message> <RequestId>774BF58712AE4AD1</RequestId> <HostId>bn3apgN</hostid></error>…

Fix:Error: No base href set. Please provide a value for the APP_BASE_HREF token or add a base element to the document.

Angular で以下のようなエラーが発生するようになってしまいました。 Error: No base href set. Please provide a value for the APP_BASE_HREF token or add a base element to the document. at new PathLocationStrategy (common.js:403) at provideLocat…

Fix:Error: The selector "app-root" did not match any elements

Angular でなにも変更してないと思っていたのですが、突然、以下のようなエラーが発生するようになりました。 Error: The selector "app-root" did not match any elements at DefaultDomRenderer2.push../node_modules/@angular/platform-browser/fesm5/pla…

AngularのSPAをS3+CloudFront環境にデプロイしてキャッシュクリアする方法

はじめに Angular な SPA を Amazon S3 + CloudFront にホストするのはいいですが、じゃあデプロイはどうするのとなって行き詰まっていました。 www.aruse.net いろいろ調べてみたところ、Angular の SPA を自動でデプロイして CloudFront のキャッシュもク…

Xamarin.FormsのCarouselPageで2ページ目を最初に開く方法

Xamarin.Forms の CarouselPage を2ページ使って、左ページにメニュー、右ページにコンテンツを表示しようと考えてみました。 そうすると、CarouselPage の2ページ目を最初に開く必要があるのですが、意外と簡単にできたのでメモとして残しておきます。 ま…

FacebookのOAuth認証で取得したアクセストークンをC#で検証する方法

はじめに 以下の記事で、Angularな SPA で Facebook の OAuth 認証を行いました。 www.aruse.net OAuth 認証時に取得したアクセストークンは、サーバーに送信して検証をしなければいけないはずなのですが、Facebook がその情報をきちんと公開していません。 …