Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

HTML interface to RESTful web service *without* javascript

Even if I offer alternatives to PUT and DELETE (c.f. "Low REST"), how can I provide user-friendly form validation for users who access my web service from the browser, while still exposing RESTful URIs? The form validation problem (described below) is my current quandry, but the broader question I want to ask is: if I go down the path of trying to provide both a RESTful public interface and a non-javascript HTML interface, is it going to make life easier or harder? Do they play together at all?

In theory, it should be merely a matter of varying the output format. A machine can query the URL "/people", and get a list of people in XML. A human user can point their browser at the same URL, and get a pretty HTML response instead. (I'm using the URL examples from the microformats wiki, which seem fairly reasonable).

Creating a new person resource is done with a POST request to the "/people" URL. To achieve this, the human user can first visit "/people/new", which returns a static HTML form for creating the resource. The form has method=POST and action="/people". That will work fine if the user's input is valid, but what if we do validation on the server side and discover an error? The friendly thing would be to return the form, populated with the data the user just entered, plus an error message so that they can fix the problem and resubmit. But we can't return that output directly from a POST to "/people" or it breaks our URL system, and if we redirect the user back to the "/people/new" form then there is no way to report the error and repopulate the form (unless we store the data to session state, which would be even less RESTful).

With javascript, things would be much easier. Just do the POST in the background, and if it fails then display the error at the top of the form. But I want the app to degrade gracefully when javascript support isn't available. At the moment, I'm led to conclude that a non-trivial web app cannot implement an HTML interface without javascript, and use a conventional RESTful URL scheme (such as that described on the microformats wiki). If I'm wrong, please tell me so!

Related questions on Stack Overflow (neither of which deal with form validation):

  • How to send HTML form RESTfully?
  • How do you implement resource "edit" forms in a RESTful way?
like image 307
Todd Owen Avatar asked Aug 13 '09 03:08

Todd Owen


People also ask

Does REST API use HTML?

The www uses html for REST! There's nothing wrong with the idea at all. Personally I would congratulate you on your questioning this in the first place, many don't. Rest does not mandate an application protocol, it's just that JSON/XML has become the standard choice (as HTML is usually hard to parse).

What is RESTful web services in JavaScript?

A RESTful API is stateless, separates concerns between client-server, allows caching of data client-side and it utilizes standardized base URLs and methods to perform the actions required to manipulate, add or delete data.


2 Answers

you could have the html form post directly to /people/new. If the validation fails, rerender the edit form with the appropriate information. If it succeeds, forward the user to the new URL. This would be consistent with the REST architecture as I understand it.

I saw you comment to Monis Iqbal, and I have to admit I don't know what you mean by "non-RESTful URLS". The only thing the REST architecture asks from a URL is that it be opaque, and that it be uniquely paired to a resource. REST doesn't care what it looks like, what's in it, how slashes or used, how many are used, or anything like that. The visible design of the URL is up to you and REST has no bearing.

like image 56
Breton Avatar answered Oct 13 '22 00:10

Breton


Thanks for the responses. They have freed my mind a bit, and so in response to my own question I would like to propose an alternative set of RESTful URL conventions which actually embrace the two methods (GET and POST) of the non-AJAX world, instead of trying to work around them.

Edit: As commenters have pointed out, these "conventions" should not be part of the RESTful API itself. On the other hand, internal conventions are useful because they make the server-side implementation more consistent and hence easier for developers to understand and maintain. RESTful clients, however, should treat the URLs as opaque, and always obtain them as hyperlinks, never by constructing URLs themselves.

GET /people
    return a list of all records
GET /people/new
    return a form for adding a new record
POST /people/new
    create a new record
    (for an HTML client, return the form again if the input is invalid, otherwise redirect to the new resource)
GET /people/1
    return the first record
GET /people/1/edit
    return a form for editing the first record
POST /people/1/edit
    update the first record
GET /people/1/delete
    return a form for deleting the record
    (may be simply a confirmation - are you sure you want to delete?)
POST /people/1/delete
    delete the record

There is a pattern here: GET on a resource, e.g. "/people/1", returns the record itself. GET on resource+operation returns an HTML form, e.g. "/people/1/edit". POST on resource+operation actually executes the operation.

Perhaps this is not quite so elegant as using additional HTTP verbs (PUT and DELETE), but these URLs should work well with vanilla HTML forms. They should also be pretty self-explanatory to a human user...I'm a believer in the idea that "the URL is part of the UI" for users accessing the web server via a browser.

P.S. Let me explain how I would do the deletes. The "/people/1" view will have a link to "/people/1/delete", with an onclick javascript handler. With javascript enabled, the click is intercepted and a confirmation box presented to the user. If they confirm the delete, a POST is sent, deleting the record immediately. But if javascript is disabled, clicking the link will instead send a GET request, which returns a delete confirmation form from the server, and that form sends the POST to perform the delete. Thus, javascript improves the user experience (faster response), but without it the website degrades gracefully.

like image 23
Todd Owen Avatar answered Oct 13 '22 00:10

Todd Owen