html5本地应用程序可以有一个asp.net会话吗？ （适用于iPhone的本地webapp）

Question

The context:

I'm actually developing a small web app (C#/MVC2). Users are going to use their iPhones (and probably Android phones in the future) to access it.

At the moment it's quite simple (it just shows some info and reports from our customer's ERP), and I decided to give a try at creating local webapp that the users could add to their iPhones, so that they had an icon for it and, most importantly, most files are locally cached, so that only the relevant data is obtained using json from the server.

The problem:

To authenticate users, a small form asks for username and password, and sends them to the server via ajax, which in turn validates the user and sets the authcookie. If the app is executed in Safari, everything works ok, but if it's executed locally (that is, in Mobile Safari directly from an icon), the server validates correctly the user, but this validation is lost when the next ajax call to recover data is made.

Does this mean that session cookies are not supported by Mobile Safari in webapps? I'm doing it wrong?

And most importantly: What's the best way to authenticate users in a local webapp that access remote data?

Answer 1

Your best bet : http://www.asp.net/web-api/overview/security/individual-accounts-in-web-api

To access a protected resource, the client includes the access token in the Authorization header of the HTTP request

Login :

var loginData = {
    grant_type: 'password',
    username: ...,
    password: ...
};

$.ajax({
    type: 'POST',
    url: '/Token',
    data: loginData
}).done(function (data) {
    // Cache the access token in session storage.
    sessionStorage.setItem(tokenKey, data.access_token);
});

Second request:

// If we already have a bearer token, set the Authorization header.
var token = sessionStorage.getItem(tokenKey);
var headers = {};
if (token) {
    headers.Authorization = 'Bearer ' + token;
}

$.ajax({
type: 'GET',
url: 'api/values/1',
headers: headers
}).done(function (data) {});

If you don't plan to use Web API, you must generate your own token and put it in every request data

Answer 2

I'm not quite sure about what do you mean by local webapp. I assume that it's an HTTP web server running on localhost.

If that's the case, you need some protocol to communicate between http://localhost and http://yourwebsite.com , and that protocol should help localhost authenticate user via yourwebsite.com. I think OAuth might be what you're looking for.

The first time the user access your local webapp, he will be redirected to yourwebsite.com for the authentication. After that, yourwebsite.com will bring him back with an OAuth token. After verifying that token is valid from yourwebsite.com, localhost can serve user on its own.

Answer 3

(I realise I'm very late to this question, but anyway…)

Mobile Safari employs a slightly different web engine to that used in "home-screen apps" (ie web pages that you bookmark as self-contained icons on the iOS home screen).

Perhaps the issue you're seeing with cookies comes from that, rather than in Mobile Safari per se ? I guess it's easy enough to test: if the app all works OK in Mobile Safari, and not from a home screen icon, there's your answer.

As an alternative take, rather than relying on authentication in the on-line version of the app, another approach that may work for you / your organisation is using the app in an unauthenticated state, but over a VPN for mobile workers? (This will still work OK as an offline web app).

Answer 4

Instead of using a cookie can't you have a ajax call to login that just returns the "authcookie"-value. The value can be saved using localStorage or similar.

http://dev.w3.org/html5/webstorage/

Later when you want to fetch something you can send this value to the server using a custom header (X-authentication or similar) or just append it as a GET-variable to the url.