Question: I deployed my application via Couchapp, which means that the whole application is being served out of the database. I don't want the data in the Couchdb database to publicly available, so I specified a reader role that a user must have before I server him data. When I go to the application, however, all I can get is:

```
{"error":"unauthorized","reason":"You are not authorized to access this db."}

```

Because it can't even serve up the login page that uses jquery.couch.js. 

Any ideas on how to provide an in-app login (ie, login not using Futon for a user that needs data read access)?

Answer: 
At this time, the solution requires a little bit of work. (There is pressure in the community to improve this, but I will explain the present answer instead of describing proposals or vaporware.)

Make a "welcome mat" database, with the following features:

* Has an admin user ("jtsnake"): `_security.admins = {"names":["jtsnake"], "roles":[]}`
* Publicly-readable: `_security.readers = {"names":[], "roles":[]}}`
* Has a design document with a `.validate_doc_update` function. Allow **no changes** except by the admin:

```
function(newDoc, oldDoc, userCtx, secObj) {
    // _design/welcome_mat .validate_doc_update

    if(! userCtx.name)
      throw {"unauthorized": "Please log in to change the welcome mat"};
    if(userCtx.roles.indexOf("_admin") === -1)
      throw {"forbidden": "Only the admin can change the welcome mat"};
    log("Allowing welcome mat update by: " + userCtx.name);
}

```
* Finally, place your *public* content such as the welcome screen, login screen, etc. in this database. Private data can go in the private database once a user has logged in.
For the specific case that you and people you can talk directly to only users of this application (like a personal or internal thing), a quick solution that works well is to have a [bookmarklet](http://en.wikipedia.org/wiki/Bookmarklet) that creates a user login form, establishes the session and refreshes the page:

```
var form = '<div style="position: absolute; left: 50%; top: 50%; margin-left: -150px; margin-top: -100px; width:3 00px; height: 200px;">'
         + '  <form id="loginForm">'
         + '    <input placeholder="nome" name="name">'
         + '    <input placeholder="senha" type="password" name="password">'
         + '    <button onclick="login(event)">OK</button>'
         + '  </form>'
         + '</div>';

document.write(form);

function login(event) {
    event.preventDefault();
    event.returnValue = false;
    var form = document.getElementById('loginForm');
    var xhr = new XMLHttpRequest();
    xhr.onreadystatechange = function () {
        if (xhr.readyState === 4) {
            location.reload();
        }
    };
    xhr.open('POST', '/_session', true);
    xhr.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
    xhr.send('name=' + form.name.value + '&password=' + form.password.value);
};

```

I don't know about other browsers, but in Chrome, create a bookmark and use this string as the URL:

`javascript: var form = '<div style="position:absolute;left:50%;top:50%;margin-left:-150px;margin-top:-100px;width:300px;height:200px;"><form id="loginForm"><input placeholder="nome" name="name"><input placeholder="senha" type="password" name="password"><button onclick="login(event)">OK</button></form></div>';document.write(form);function login(event) { event.preventDefault(); event.returnValue = false; var form = document.getElementById('loginForm'); var xhr = new XMLHttpRequest(); xhr.onreadystatechange = function () { if (xhr.readyState === 4) { location.reload(); }}; xhr.open('POST', '/_session', true); xhr.setRequestHeader("Content-type", "application/x-www-form-urlencoded"); xhr.send('name=' + form.name.value + '&password=' + form.password.value);};`