[docs] Improve JS header/form instructions (#103)

Author: elithrar

README.md

@@ -117,7 +117,15 @@ body.
 ### JavaScript Applications
 
 This approach is useful if you're using a front-end JavaScript framework like
-React, Ember or Angular, or are providing a JSON API.
+React, Ember or Angular, and are providing a JSON API. Specifically, we need
+to provide a way for our front-end fetch/AJAX calls to pass the token on each
+fetch (AJAX/XMLHttpRequest) request. We achieve this by:
+
+- Parsing the token from the `<input>` field generated by the
+  `csrf.TemplateField(r)` helper, or passing it back in a response header.
+- Sending this token back on every request
+- Ensuring our cookie is attached to the request so that the form/header
+  value can be compared to the cookie value.
 
 We'll also look at applying selective CSRF protection using
 [gorilla/mux's](https://www.gorillatoolkit.org/pkg/mux) sub-routers,
@@ -133,12 +141,13 @@ import (
 
 func main() {
     r := mux.NewRouter()
+    csrfMiddleware := csrf.Protect([]byte("32-byte-long-auth-key"))
 
     api := r.PathPrefix("/api").Subrouter()
+    api.Use(csrfMiddleware)
     api.HandleFunc("/user/{id}", GetUser).Methods("GET")
 
-    http.ListenAndServe(":8000",
-        csrf.Protect([]byte("32-byte-long-auth-key"))(r))
+    http.ListenAndServe(":8000", r)
 }
 
 func GetUser(w http.ResponseWriter, r *http.Request) {
@@ -159,11 +168,39 @@ func GetUser(w http.ResponseWriter, r *http.Request) {
 }
 ```
 
+In our JavaScript application, we should read the token from the response
+headers and pass it in a request header for all requests. Here's what that
+looks like when using [Axios](https://github.com/axios/axios), a popular
+JavaScript HTTP client library:
+
+```js
+// You can alternatively parse the response header for the X-CSRF-Token, and
+// store that instead, if you followed the steps above to write the token to a
+// response header.
+let csrfToken = document.getElementsByName("gorilla.csrf.Token")[0].value
+
+// via https://github.com/axios/axios#creating-an-instance
+const instance = axios.create({
+  baseURL: "https://example.com/api/",
+  timeout: 1000,
+  headers: { "X-CSRF-Token": csrfToken }
+})
+
+// Now, any HTTP request you make will include the csrfToken from the page,
+// provided you update the csrfToken variable for each render.
+try {
+  let resp = await instance.post(endpoint, formData)
+  // Do something with resp
+} catch (err) {
+  // Handle the exception
+}
+```
+
 ### Google App Engine
 
 If you're using [Google App
 Engine](https://cloud.google.com/appengine/docs/go/how-requests-are-handled#Go_Requests_and_HTTP),
-which doesn't allow you to hook into the default `http.ServeMux` directly,
+(first-generation) which doesn't allow you to hook into the default `http.ServeMux` directly,
 you can still use gorilla/csrf (and gorilla/mux):
 
 ```go
@@ -180,6 +217,10 @@ func init() {
 }
 ```
 
+Note: You can ignore this if you're using the
+[second-generation](https://cloud.google.com/appengine/docs/go/) Go runtime
+on App Engine (Go 1.11 and above).
+
 ### Setting Options
 
 What about providing your own error handler and changing the HTTP header the