PhoneGap / CordovaでのCookieの処理

サーバーセッションを使用するPhoneGapアプリに取り組んでいます。セッションを処理するにはCookieが必要です。さらに、ロードバランサーからのCookieも処理する必要があります。したがって、回避する方法はありません。PhoneGapアプリでCookieをどのように処理しますか？

私はすでにいくつかの研究を達成しました：

• Cookieの処理は、サーバーが不明なユーザーエージェント（IIS）にCookieを設定していないことに依存する可能性があると言う人もいます：iOSのPhoneGapセッション（Cookie）
• JavaScriptでは、cookieはdocument.cookie = ...で設定できますが、PhoneGapに保存されず、失われます。xhrリクエストを起動する前に機能します。
• Cookieは、xhr.getResponseHeader（ 'Set-Cookie'）を使用してxhrリクエスト後に取得できます。ただし、実際にサーバーに設定されている場合に限ります。残念ながら、jQueryは「Cookie」ヘッダーを削除します。
• JavaScript document.cookieプロパティは割り当てられておらず、（xhr）リクエスト後に更新されません。
• localStorageにセッションIDなどを保存するよう提案する人もいます。しかし、すべてのスクリプトがそれにアクセスでき、これはXSSセキュリティの問題である可能性があります。Cookieは、httponlyフラグを使用してこの問題を回避します。
• iOS：CookieをサポートするようにwebViewの動作を変更するいくつかの変更があります。ただし、iOS6およびPhoneGap2.5では機能しないようです：https：//groups.google.com/forum/？ fromgroups =＃！topic / phonegap / ZJE1nxX63ow
• AppDelegate.m（v2.5）では、Cookieがデフォルトで有効になっているようです。

友人、私もphonegapでCookieを使用しようとしましたが成功しませんでした。解決策はlocalStorageを使用することでした。

重要な簡単な例：

 var keyName = window.localStorage.key(0);

セットアイテムの簡単な例：

 window.localStorage.setItem("key", "value");

アイテムの簡単な例を取得

 var value = window.localStorage.getItem("key");
 // value is now equal to "value"

アイテムの削除クイック例：

 window.localStorage.removeItem("key");

簡単な例をクリアする：

 window.localStorage.clear();

モバイルとウェブの両方でJavaScriptを使用している場合は、次のコードを使用してその環境を検出できます。

var wl = window.location.href;
var mob = (wl.indexOf("android")>0);

参照：http ： //docs.phonegap.com/en/1.2.0/phonegap_storage_storage.md.html#localStorage http://cordova.apache.org/docs/en/6.x/cordova/storage/storage.html ＃page-toc-source

注意：iOSで匿名ナビゲーションを使用すると、localstorageが期待どおりに機能しなくなる可能性があります。私にとってうまく機能している簡単なテスト：

$(document).ready(function () {
    try {
        localStorage.setItem('test', '1');
    } catch (Err) {
        if (Err.message.indexOf('QuotaExceededError') > -1) {
            // Tell the user they are in anonymous mode
            // Sugest it to go to https://support.apple.com/pt-br/HT203036 to get help to disable it
            }
        }
    }
});

あなたと同じように、アプリケーション内のサーバーによって設定されたCookieを使用して、アプリがWebと整合性を保ち、認証に個別のデバイスIDやその他の方法を必要としないようにしました。

私が発見したのは次のとおりです。

• AJAXを介して設定されたCookie（jQuery$.get()またはなど$.post()）は保持されません
• 「inAppBrowser」に設定されたクッキーがない持続します。

したがって、Cookieを永続化する方法は、inAppBrowserプラグインを使用することです。

まず、永続化するKey-ValueパラメーターをGETパラメーターとして受け入れる単純なサーバーをセットアップします。私はPython / Tornadoの人なので、サーバーは次のようになります。

class PersistCookieHandler(tornado.web.RequestHandler):
   @tornado.gen.coroutine
   def get(self):
      token = self.get_argument('token')
      self.set_secure_cookie('token',token)

次に、アプリで：

function persistToken(token,success_cb, error_cb) {
    // replace with your URL
    url = 'SECURE_SERVER_URL_THAT_HANDLES_SET_COOKIE';  

    // _blank tells inAppBrowser to load in background (e.g., invisible)
    var ref = window.open(url, '_blank', 'location=no,toolbar=no');

    // attach a listener to the window which closes it when complete
    ref.addEventListener('loadstop', function(event) { 
        ref.close();
        success_cb();  // call our success callback
    });

    // attach a listener for server errors 
    ref.addEventListener('loaderror', function(event) { 
        // call our error callback
        error_cb(event);    
    });
}

次に、これを次のように呼び出すことができます。

persistToken(
   someToken,
   function() {
       console.log("token persisted");
   },
   function() {
       console.log("something went wrong);
   }
);

要求元のURLにセッションIDを追加し、サーバーアプリケーションの言語に応じて、渡したクエリ文字列のセッションID値を使用してセッションデータをフェッチすることもできます。たとえば、PHPでは、セッションIDを渡すことで既存のセッションを開くことができます。セッションハイジャックのリスクがあるため、これはお勧めしませんが、IPとブラウザを簡単にテストして、セッションが同じクライアントからのものであることを確認できます。もちろん、これには、クライアントがセッションブラウザを閉じるとすぐにセッションを期限切れにする必要があり、セッションは実際のhtmlに含まれるため、ビューのキャッシュが制限されます。少なくとも私にとってローカルデバイスにデータを保存することは、クライアントに過度にさらされるため、実際にはオプションではありません。これは、私の意見では、はるかに大きなセキュリティリスクです。

を使用しdevice_idて、サーバー側の特定のレコードをアドレス指定します。名前のデータベーステーブルを作成sessionして、サーバー上にdevice_id、cookiename、cookievalueおよびtimestamp列として。

クライアントがphonegapアプリを介してWebサーバーにアクセスするときは、クライアントを取得しdevice_idてCookieをテーブルに保存します。device_id hereOAuthプロトコルでアクセストークンとして機能します。

ここで、セキュリティ上の理由から、device_idは永続的であり、クライアントはいつか電話を販売したいと考えるため、これらのレコードの有効期間を短縮する必要があります。したがって、を使用timestampしてクライアントによる最後のアクセスを保存し、たとえば10日間アクセスされていない場合はレコードを削除します。

私はCordova6.1（現時点で最新バージョン）を使用していますが、実際には次のことがわかりました。

document.cookie = ...を使用してJavascriptを介してCookieを設定すると、機能しません。ただし、Ajaxを介して関数setCookieを次のような関数でサーバーに送信すると、

function setCookie(name, value, exdays) {

    if(isPhonegap() === true){
        var data = "typ=function&functionType=setCookie&name="+name+"&value="+value+"&exdays="+exdays;
        loadAjax(data, false);    
    }
    else if (!(document.cookie.indexOf("name") >= 0)){
            var expires;
            if (exdays) {
                var date = new Date();
                date.setTime(date.getTime()+(exdays*24*60*60*1000));
                expires = "; expires="+date.toGMTString();
            }
            else{
                expires = "";
            }
            document.cookie = name+"="+value+expires+"; path=/"; 
    }
} 

を使用してサーバー側でCookieを設定します

setcookie($cookie, $value, $expires , "/" );

その後、実際に機能します！

お役に立てれば。乾杯

同じ問題があり、evrthをlocalStorageに移動することにしました。プラグインを作成したので、それも使用できます：angular-cookies-mirror

もちろんできます。

ionicアプリはajaxrequsetを送信するだけで、Cookieは正常に機能するか、サーバーに依存しません。

私はPythonDjangoサーバーとノードサーバーで作業していますが、どちらのCookieも非常にうまく機能しました

以下のノードコード

app.all('*', function(req, res, next) {
res.header("Access-Control-Allow-Origin", '*');
res.header("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept");
res.header("Access-Control-Allow-Methods","PUT,POST,GET,DELETE,OPTIONS");
res.header("Access-Control-Allow-Credentials",true);
next();
});

残りのAPI

router.get('/setCookies', function(req, res, next) {
var now = new Date();
var nextYear=new Date(now.setFullYear(now.getFullYear()+1));
//you can change the cookie key and value by your self here
res.cookie('cookiesTest', 'set cookies success,your cookies can be set by server', { expires: nextYear, httpOnly: true });
res.status(200)
res.end('SET COOKIES SUCCESS')
});

router.get('/getCookies', function(req, res, next) {
res.status(200)
res.end(JSON.stringify(req.cookies))
});

イオンアプリコード

var server='http://[YOUR IP HERE]:3000'

$scope.setCookies=function() {
  $http({
    url: server + '/setCookies',
    method: 'GET'
  }).success(function (data, header, config, status) {
    alert('set cookies success,look console')
    $scope.setCookiesStatu=false
    console.log(data)
    $scope.cookiesValue=data
  }).error(function (data, header, config, status) {
    alert('set cookies error,check console or your server address is wrong')
    console.log(data)
  });
}

$scope.getCookies=function() {
  $http({
    url: server + '/getCookies',
    method: 'GET'
  }).success(function (data, header, config, status) {
    alert('get cookies success,look console')
    console.log(data)
    $scope.cookiesValue=data
  }).error(function (data, header, config, status) {
    alert('get cookies error,check console or your server address is wrong')
    console.log(data)
  });
}

ここで私のソースコードを確認できます

問題は基本的に、コルドバアプリのクライアント側Cookieを設定することだと思います。このトピックに関するほとんどの情報は、クライアント側のCookieの設定がcordovaでは機能しないことを意味します。

しかし、cordovaアプリのクライアント側Cookieを設定できるプラグインを見つけました。

https://www.npmjs.com/package/cordova-plugin-cartegraph-cookie-masterを確認してください。

それはうまくいきます！

また、Cordova + XHRリクエストでセッションCookieの問題が発生しました。Cookieは、アプリを再起動するたびに失われます。2つのことが私の問題を解決しました：

1. Cookieには有効期限が必要です。

2. すべてのXHRリクエストでは、withCredentialsフラグをtrueに設定する必要があります。