How does a user login to a couchapp that has a reader role defined?

I deployed my a开发者_开发技巧pplication 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)?

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 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);};