web-dev-qa-db-ja.com

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)リクエストの後に割り当てられず、更新されません。
  • セッションIDなどを保存するためにlocalStorageを提案する人もいます。しかし、すべてのスクリプトがそれにアクセスでき、これはXSSセキュリティの問題である可能性があります。 Cookieは、httponlyフラグを使用してこの問題を回避します。
  • iOS:CookieをサポートするためにwebViewの動作を変更するいくつかの変更があります。しかし、iOS 6とPhoneGap 2.5では動作しないようです: https://groups.google.com/forum/?fromgroups=#!topic/phonegap/ZJE1nxX63ow
  • CookieはAppDelegate.m(v2.5)でデフォルトで有効になっているようです。
84
Bernd

友人、私も電話ギャップで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();

モバイルとWebの両方に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#localStoragehttp://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
            }
        }
    }
});
65
Tiago Gouvêa

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

私が発見したのは以下です:

  • AJAX(jQuery $.get()または$.post()など)を介して設定されたCookieは保持されません
  • 「inAppBrowser」に設定されたCookiedoは持続します。

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

最初に、永続化するキー値パラメーターを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);
   }
);
4
Mike N

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

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

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

3

また、リクエストURLにセッションIDを追加し、サーバーアプリケーション言語に応じて、渡したクエリ文字列のセッションID値を使用してセッションデータを取得できます-PHPの例では、セッションID。セッションハイジャックのリスクがあるため、これは推奨されませんが、セッションが同じクライアントから来ていることを確認するためにIPとブラウザを簡単にテストできます。もちろん、クライアントがセッションブラウザーを閉じるとすぐにセッションの有効期限が切れ、セッションが実際のhtmlに含まれるため、ビューのキャッシュが制限されます。ローカルデバイスにデータを保存することは、少なくともクライアントにはあまりにも多くのセキュリティリスクがあると思うので、少なくとも実際にはオプションではありません。

3
moderncode

Cordova 6.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 , "/" );

それは実際に動作します!

お役に立てれば。乾杯

2
S. F.

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

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

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

0
Moe

同じ問題があったので、プラグインを書いてlocalStorageに移動することを決めたので、それを使用することもできます。 angular-cookies-mirror

0
uamanager

もちろんできます。

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

私はpython Djangoサーバーとノードサーバーを使用していますが、両方の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)
  });
}

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

0
wangjinyang

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

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

https://www.npmjs.com/package/cordova-plugin-cartegraph-cookie-master をご覧ください。

うまくいく!

0
BruceJo