Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with
or
.
Download ZIP

Loading…

Display the API request headers and body in addition to the response #183

Merged
merged 1 commit into from

3 participants

@cjthompson

This adds a "Request Headers" and "Request Body" section to the request output. An API caller can now see exactly what the request that was made looks like so that they can implement the same request on their own.

Chris Thompson Display the API request headers and body in addition to the response
This allows an API caller to see exactly what the request looks like so
that they can implement the same request on their own.
96c1041
@alexadkins alexadkins added the UI label
@alexadkins
Owner

Hi @cjthompson thanks for the commit. I can't seem to get it working right out of the gate, what is the config you tested it with? I'd like to get this running so we can accept the pull request. Thanks!

@cjthompson

I tested it with my own config, but I also just tested it with the requestbin API. The sections show up in the response, but they are empty since it's a GET request.

The Request Body should only be populated on PUT/POST requests.

Do you have a suggestion on the changes on how to display the section headers only when there's data? Or how to hide them if there isn't? I didn't dig that deep into it.

@alexadkins
Owner

I found and fixed the bug I was getting with the Klout API. I'll test with the other default configs before merging, but it was an easy fix.

I've implemented hiding the section headers if there is no data and will be approving your request once I've thoroughly tested and debugged.

Thanks!

@alexadkins alexadkins merged commit 96c1041 into mashery:master
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Commits on May 15, 2014
  1. Display the API request headers and body in addition to the response

    Chris Thompson authored
    This allows an API caller to see exactly what the request looks like so
    that they can implement the same request on their own.
This page is out of date. Refresh to see the latest.
Showing with 37 additions and 1 deletion.
  1. +11 −1 app.js
  2. +26 −0 public/javascripts/docs.js
View
12 app.js
@@ -578,7 +578,9 @@ function processRequest(req, res, next) {
};
if (['POST','DELETE','PUT'].indexOf(httpMethod) !== -1) {
- var requestBody = query.stringify(params);
+ var requestBody;
+ requestBody = (options.headers['Content-Type'] === 'application/json') ?
+ JSON.stringify(params) : query.stringify(params);
}
if (apiConfig.oauth) {
@@ -677,6 +679,8 @@ function processRequest(req, res, next) {
}
// Set Headers and Call
+ if (options.headers) req.requestHeaders = options.headers;
+ if (requestBody) req.requestBody = requestBody;
if (response) {
req.resultHeaders = response.headers || 'None';
} else {
@@ -776,6 +780,8 @@ function processRequest(req, res, next) {
next();
} else {
+ if (options.headers) req.requestHeaders = options.headers;
+ if (requestBody) req.requestBody = requestBody;
req.resultHeaders = response.headers;
req.result = JSON.parse(data);
next();
@@ -904,6 +910,8 @@ function processRequest(req, res, next) {
}
// Set Headers and Call
+ if (options.headers) req.requestHeaders = options.headers;
+ if (requestBody) req.requestBody = requestBody;
req.resultHeaders = response.headers;
req.call = url.parse(options.host + options.path);
req.call = url.format(req.call);
@@ -988,6 +996,8 @@ app.post('/processReq', oauth, processRequest, function(req, res) {
call: req.call,
code: req.res.statusCode
};
+ if (req.requestHeaders) result.requestHeaders = req.requestHeaders;
+ if (req.requestBody) result.requestBody = req.requestBody;
res.send(result);
});
View
26 public/javascripts/docs.js
@@ -227,6 +227,12 @@
resultContainer.append($(document.createElement('h4')).text('Call'));
resultContainer.append($(document.createElement('pre')).addClass('call'));
+ resultContainer.append($(document.createElement('h4')).text('Request Headers'));
+ resultContainer.append($(document.createElement('pre')).addClass('requestHeaders'));
+
+ resultContainer.append($(document.createElement('h4')).text('Request Body'));
+ resultContainer.append($(document.createElement('pre')).addClass('requestBody'));
+
// Code
resultContainer.append($(document.createElement('h4')).text('Response Code'));
resultContainer.append($(document.createElement('pre')).addClass('code prettyprint'));
@@ -278,6 +284,26 @@
.text(response.call);
}
+ if (response.requestHeaders) {
+ $('pre.requestHeaders', resultContainer)
+ .addClass('prettyprint')
+ .text(formatJSON(response.requestHeaders));
+ } else {
+ $('pre.requestHeaders', resultContainer).hide();
+ }
+
+ if (response.requestBody) {
+ var requestBody;
+ if (response.headers['content-type'].substr(0, 16) === 'application/json') {
+ requestBody = formatJSON(JSON.parse(response.requestBody));
+ } else {
+ requestBody = response.requestBody;
+ }
+ $('pre.requestBody', resultContainer).addClass('prettyprint').text(requestBody);
+ } else {
+ $('pre.requestHeaders', resultContainer).hide();
+ }
+
if (response.code) {
$('pre.code', resultContainer)
.text(response.code);
Something went wrong with that request. Please try again.