Text Diff API

Last Revised: September 18th, 2024

Usage

POST https://api.staging.diffchecker.com/public/text

Parameters

NameTypeInRequiredDescription
output_typestringquerySpecifies the type of output you receive in the response body. Value must be one of 'json', 'html', or 'html_json'. - json: (Content-Type: application/json) Row metadata generated from diff computation - html: (Content-Type: text/html) Same html/css you see on Diffchecker site - html_json: (Content-Type: application/json) Same html/css you see on Diffchecker site, but split up and embedded in JSON
diff_levelstringquerySpecifies whether you want to diff by word or character. Value must be one of 'word' or 'character'. Default is 'word'.
leftstringbodyLeft text you want to diff.
rightstringbodyRight text you want to diff.

Examples

curl --location --request POST 'https://api.staging.diffchecker.com/public/text?output_type=html&diff_level=word&email=YOUR_EMAIL' \
  --header 'Content-Type: application/json' \
  --data-raw '{
    "left": "roses are red\nviolets are blue",
    "right": "roses are green\nviolets are purple"
    }'

JSON Responses

output_type=json

{
  "rows": [
    {
      "end": false,
      "left": {
        "chunks": [
          {
            "value": "roses are ",
            "type": "equal"
          },
          {
            "value": "red",
            "type": "remove"
          }
        ],
        "line": 1
      },
      "right": {
        "chunks": [
          {
            "value": "roses are ",
            "type": "equal"
          },
          {
            "value": "green",
            "type": "insert"
          }
        ],
        "line": 1
      },
      "insideChanged": true,
      "start": true
    },
    {
      "end": true,
      "left": {
        "chunks": [
          {
            "value": "",
            "type": "remove"
          },
          {
            "value": "violets are ",
            "type": "equal"
          },
          {
            "value": "blue",
            "type": "remove"
          }
        ],
        "line": 2
      },
      "right": {
        "chunks": [
          {
            "value": "",
            "type": "insert"
          },
          {
            "value": "violets are ",
            "type": "equal"
          },
          {
            "value": "purple",
            "type": "insert"
          }
        ],
        "line": 2
      },
      "insideChanged": true
    }
  ],
  "added": 3,
  "removed": 3
}

output_type=html_json

{
  "html": "<table class=\"diff-table\"><thead><tr><td class=\"line-number-header\"></td><td class=\"side-content-header\"></td><td class=\"line-number-header\"></td><td class=\"side-content-header\"></td></tr></thead><tbody><tr class=\"diff-row\"><td data-content=\"1\" class=\"diff-line-number\"></td><td class=\"diff-line start diff-line-modified diff-line-with-removes\"><span class=\"diff-chunk diff-chunk-equal diff-chunk-modified\">roses are </span><span class=\"diff-chunk diff-chunk-removed diff-chunk-modified\">red</span></td><td data-content=\"1\" class=\"diff-line-number\"></td><td class=\"diff-line start diff-line-modified diff-line-with-inserts\"><span class=\"diff-chunk diff-chunk-equal diff-chunk-modified\">roses are </span><span class=\"diff-chunk diff-chunk-inserted diff-chunk-modified\">green</span></td></tr><tr class=\"diff-row\"><td data-content=\"2\" class=\"diff-line-number\"></td><td class=\"diff-line end diff-line-modified diff-line-with-removes\"><span class=\"diff-chunk diff-chunk-removed diff-chunk-modified\"></span><span class=\"diff-chunk diff-chunk-equal diff-chunk-modified\">violets are </span><span class=\"diff-chunk diff-chunk-removed diff-chunk-modified\">blue</span></td><td data-content=\"2\" class=\"diff-line-number\"></td><td class=\"diff-line end diff-line-modified diff-line-with-inserts\"><span class=\"diff-chunk diff-chunk-inserted diff-chunk-modified\"></span><span class=\"diff-chunk diff-chunk-equal diff-chunk-modified\">violets are </span><span class=\"diff-chunk diff-chunk-inserted diff-chunk-modified\">purple</span></td></tr></tbody></table>",
  "css": "\n.diff-table {\n  font-family: monospace;\n  background: #FFFFFF;\n  font-size: 0.8125rem;\n  border-collapse: collapse;\n}\n.side-content-header {\n  width: 50%;\n}\n.diff-row {\n}\n.diff-line-number {\n  color: #999;\n  padding: 0 8px 0 5px;\n  text-align: right;\n  vertical-align: top;\n}\n.diff-line-number:before {\n  content: attr(data-content);\n}\n.diff-line {\n  white-space: pre-wrap;\n  word-break: break-all;\n  overflow-wrap: break-word;\n  line-height: 1rem;\n  padding-right: 20px;\n}\n.diff-line-inserted {\n  background: #B5EFDB;\n}\n.diff-line-removed {\n  background: #FFC4C1;\n}\n.diff-line-empty {\n  background: #EAEEF0;\n}\n.diff-line-modified.diff-line-with-inserts {\n  background: #B5EFDB;\n}\n.diff-line-modified.diff-line-with-removes {\n  background: #FFC4C1;\n}\n.diff-chunk-inserted {\n  background: #6BDFB8;\n}\n.diff-chunk-removed {\n  background: #FF8983;\n}\n"
}