「[[Open棟梁 wiki>https://opentouryo.osscons.jp]]」は、「[[Open棟梁Project>https://github.com/OpenTouryoProject/]]」,「[[OSSコンソーシアム .NET開発基盤部会>https://www.osscons.jp/dotNetDevelopmentInfrastructure/]]」によって運営されています。

-[[戻る>機能一覧]]

*目次 [#de0c19a8]
#contents

*概要 [#qb3b638f]
v02-20でリリース予定。

**内容 [#c65fb68b]
-Apache Cordovaのテンプレート
-通常のWebアプリケーションやSPAアプリケーションをホストする。

**ニーズ [#g591527d]
-既存WebアプリにWebAPIを追加、フロントエンドにデータ提供を行うだけで、
--優れたUXを提供するフロントエンドが求められている。
--また、スマホ・ネイティブ機能をpluginさせたい。

-そんな開発を迅速化する、ハイブリットアプリ開発用のCordovaテンプレート
--テンプレート化
--plugin検証
--様々なバックエンドと連携。
---IdMaaS機能(認証・決済, etc.)
---mBaaS機能(ストレージ, プッシュ通知, etc.)

*機能 [#n924e654]

**適切な設定 [#k8528288]
***ホワイトリスト [#q1dfdf6a]
Cordovaの機能にある。

***[[Content-Security-Policy>https://dotnetdevelopmentinfrastructure.osscons.jp/index.php?Content-Security-Policy]] [#qf13e447]

**ネイティブアクセス(plugin) [#jb210b87]
Cordovaの機能にある。

***プッシュ通知 [#j1b9f032]
-phonegap-plugin-push
-プッシュ通知サービスと連携

***地理位置情報 [#xbad2a0d]
-cordova-plugin-geolocation
-GPSサービスと連携

**認証 [#r9eeaedc]
VS tools for Cordovaのpluginのトップも、ADALになっている。

また、以下のような、Webページも存在するので、~
この辺(フロントエンドの認証)のニーズは高いと思われる。

-Androidアプリ→ブラウザ起動→WEBサイトでログイン処理~
→URLスキームでアプリを再起動、そして指定したActivityに戻ってくる方法 - Qiita~
https://qiita.com/f-aoyama/items/07ecbefa54eefd62406d

***要件:認証のUXの統一 [#qf794bdd]
-Webアプリ
-WebAPI
-ローカル・ログイン

すべての認証を[[汎用認証サイト>汎用認証サイト(Multi-purpose Authentication Site)]]経由で行う。

***プロトコル [#rf255654]
OAuth2.0、OpenID Connectでサインイン。

***内部(WebView)でサインイン [#jcfed7a4]
非推奨らしい。

-Google、WebViewからのOAuth認証リクエストをブロックへ | スラド セキュリティ~
https://security.srad.jp/story/16/08/30/0636245/

***外部ブラウザ選択してサインイン [#w31f786d]
-認証は、[[パスワード・マネージャに依存していることが多いので>#ha0c8cda]]、~
認証時に使用する外部ブラウザを選択可能にする。

-この機能は、サーバ側実装も必要になるので、~
OAuth 2.0 Resources Server(ASP.NET Core 2.0)にこの実装を追加する。

-ログイン前
--ログイン画面
---[[ログイン画面で当該URLで外部ブラウザを開くリンクを表示>#k90aabe3]]する(QueryStringにflagを追加)。
---このリンクで、外部ブラウザ選択して開き、ログイン画面を再表示する。
--認可エンドポイント
---ログイン完了後、認可エンドポイントで、QueryStringのflag情報をClaimに格納する。
---認可エンドポイントを通過して、redirectエンドポイントに遷移する。

-ログイン後
--redirectエンドポイント(response_type=code)
---サーバー側でcodeをaccess_tokenに変換、access_token中のflagを確認。
---flagがある場合、Redirectで[[外部ブラウザからネイティブ(ハイブリッド)に戻る>#x3de6a6c]]
--redirectエンドポイント(response_type=token)
---クライアント側でaccess_token中のflagを確認。
---flagがある場合、JavaScriptで[[外部ブラウザからネイティブ(ハイブリッド)に戻る>#x3de6a6c]]

*サポート [#e90956c0]

**デプロイ、ストア登録手順の整備 [#f4c883a9]

***Android [#t895ac39]

***iOS [#f679addd]

**標準的?pluginの検証 [#v74e9f3b]

-既定で有効
--cordova-plugin-whitelist

-[[How to>#j607d396]]
--cordova-plugin-inappbrowser
--cordova-plugin-customurlscheme

*How to [#j607d396]


**UserAgentを書き換える。 [#l5954d08]
***OverrideUserAgent, AppendUserAgent [#b01551d2]
-config.xmlの設定ができる模様。
--OverrideUserAgent
--AppendUserAgent

-この設定は、
--内部(WebView)で開いた場合に有効。
--外部ブラウザで開いた場合は、(当然ながら)無効。

***参考 [#rf518b88]
実機の際は、以下のサイトを活用できる。

-アクセス情報一覧表示(IP,UserAgent,ブラウザ情報等) - PC雑記帳~
https://zakkiweb.net/tools/accessinfo/

**リンクを外部ブラウザで開く [#k90aabe3]
既定では、
-httpが無いとWebView内部で開く
-httpが有ると外部ブラウザで開く

***cordova-plugin-inappbrowser [#k589d5f8]
cordova-plugin-inappbrowserというpluginが利用できそう。

-cordova-plugin-inappbrowserを利用すれば、~
↓で、httpがあってもWebView内部で開く。
 window.open ('https://google.com ', '_self ');
--なお、以下のanchorタグではWebView内部で開かなかった。
 <a href="http://www.google.com/" target="_self">LINK</a>
--window.openが必要だが、[[Content-Security-Policy>https://dotnetdevelopmentinfrastructure.osscons.jp/index.php?Content-Security-Policy]]でハマる。

***参考 [#if0819fc]
-PhoneGap/Cordovaでの外部サイトリンク 内部表示/アプリ内ブラウザ/標準のブラウザ - Qiita~
https://qiita.com/tsunet111/items/272f3e052c332ddf9b9d

**外部ブラウザからネイティブに遷移 [#x3de6a6c]
ネイティブには、ハイブリッド(Cordova)を含む。

***cordova-plugin-customurlscheme [#ya159ea5]
cordova-plugin-customurlschemeというpluginが利用できそう。

-Custom URL Schemeで外部ブラウザからネイティブ(ハイブリッド)に戻れる。
-ネイティブ(ハイブリッド)側から、外部ブラウザで指定したURLを取得可能。
-以下のParameterをURLを使用して受け渡す。
--Token
--ReturnUrl

***参考 [#m0bdd50b]
-cordova-plugin-customurlscheme
--Cordova tips - Custom URL scheme に対応させよう | phiary~
http://phiary.me/cordova-tips-custom-url-scheme/
---pluginを追加する。
 cordova plugin add cordova-plugin-customurlscheme --variable URL_SCHEME=hoge --save
---urlを受け取る。
 function handleOpenURL(url) {  
   setTimeout(function() {
     alert("received url: " + url);
   }, 0);
 }

-Sencha Touch、iOS、Cordova で URL スキームを使用 « 株式会社ゼノフィ~
https://www.xenophy.com/sencha-blog/12234
--Using URL Schemes with Sencha Touch, iOS, and Cordova | Sencha.com~
https://www.sencha.com/blog/using-url-schemes-with-sencha-touch-ios-and-cordova/

-EddyVerbruggen/Custom-URL-scheme:
--Launch your Cordova/PhoneGap app by a Custom URL scheme like mycoolapp://~
https://github.com/EddyVerbruggen/Custom-URL-scheme
 <gap:plugin name="cordova-plugin-customurlscheme" source="npm">
   <param name="URL_SCHEME" value="XXXX" />
 </gap:plugin>
--Plugin won't install via Visual Studio · Issue #215~
https://github.com/EddyVerbruggen/Custom-URL-scheme/issues/215
 <vs:plugin name="cordova-plugin-customurlscheme">
   <param name="URL_SCHEME" value="XXXX" />
 </vs:plugin>

*前提 [#kc8b05be]

**認証 [#ha0c8cda]

***ログインの種類 [#cd8d0b68]
+Webアプリへのログイン~
Authenticate Code flow
+WebAPIへのログイン~
Implicit flow
+ネイティブアプリ(ハイブリットアプリ)へのログイン
--Implicit flow
--Web Storage - localStorage等に記憶

ここで、恐らく、(2), (3)は同じImplicit flowで、~
Bearer Tokenの取得後に、userinfoエンドポイントにアクセスするなどして認証完了とする。

***UX的な前提 [#lb1fb1e6]
-パスワード・マネージャ依存

--あり~
パスワード・マネージャを使用したいので、~
なるべく、外部ブラウザを選択して使用したい。

--なし~
内部(WebView)でも外部ブラウザでも手打ち可能。

-アプリからのブラウザ起動
--既定で内部(WebView)になっている人。
--既定で外部ブラウザになっている人。

*参考 [#d342b880]
**osscons.jp [#u3e64709]
***マイクロソフト系技術情報 Wiki [#k10ada62]
-Visual Studio+Apache Cordova~
https://techinfoofmicrosofttech.osscons.jp/index.php?Visual%20Studio%EF%BC%8BApache%20Cordova

***.NET 開発基盤部会 Wiki [#d1d53d6e]
-mBaaS~
https://dotnetdevelopmentinfrastructure.osscons.jp/index.php?mBaaS

--認証基盤~
https://dotnetdevelopmentinfrastructure.osscons.jp/index.php?%E8%AA%8D%E8%A8%BC%E5%9F%BA%E7%9B%A4

--外部サービス連携

---オンライン決済サービス~
https://dotnetdevelopmentinfrastructure.osscons.jp/index.php?%E3%82%AA%E3%83%B3%E3%83%A9%E3%82%A4%E3%83%B3%E6%B1%BA%E6%B8%88%E3%82%B5%E3%83%BC%E3%83%93%E3%82%B9

---プッシュ通知~
https://dotnetdevelopmentinfrastructure.osscons.jp/index.php?%E3%83%97%E3%83%83%E3%82%B7%E3%83%A5%E9%80%9A%E7%9F%A5

---位置情報(GPS)~
https://dotnetdevelopmentinfrastructure.osscons.jp/index.php?%E4%BD%8D%E7%BD%AE%E6%83%85%E5%A0%B1%EF%BC%88GPS%EF%BC%89

トップ   新規 一覧 単語検索 最終更新   ヘルプ   最終更新のRSS