使用 PHPMaker 2023（對於：REST API ）詳細的解說

$("#input-id").change(function() { // Assume "input-id" is an input for key value
    let object = "<Table>", // Replace <Table> by actual table name
        key = encodeURIComponent($(this).val());
    $.get("/api/view/" + object + "/" + key, function (res) { // Get response from View page API
        if (res && res.success) {
            let row = res[object];
            alert(JSON.stringify(row)); // Show output JSON
        } else {
            alert(res.failureMessage);
        }
    });
});

{
    "success": true,
    "version": "19.0.0",
    "cars": {
        "ID": 1,
        "Trademark": 1,
        ...
    }
}

$("#btn-id").click(function() {//  Assume "btn-id" is the submit button for the add form
    let object = "<Table>", // Replace <Table> by actual table name
        data = $(this.form).serialize();
    $.post("/api/add/" + object, data, function (res) { // Get response from Add page API
        if (res && res.success) {
            let row = res[object];
            alert(JSON.stringify(row)); // Show output JSON
        } else {
            alert(res.failureMessage);
        }
    });
});

{
    "success": true,
    "version": "19.0.0",
    "cars": {
        "ID": 16,
        "Trademark": 1,
        ...
    }
}

{
    "success": false,
    "version": "19.0.0",
    "failureMessage": "<reason>"
}

let object = "<Table>", // Replace <Table> by actual table name
    exportType = "<ExportType>"; // Replace <ExportType> by actual export type (e.g. excel/word/pdf)
  // Get response from Export API (Replace <FileName> by expected file name, if any)
$.get("/api/export/" + exportType + "/" + object + "?filename=<FileName>&save=1", function (res) {
    if (res && res.success) {
        alert(res.fileId); // Get exported file ID
    } else {
        alert(res.failureMessage);
    }
});

{
  "success": true,
  "version": "19.0.0",
  "fileid": "575879b9-9c87-45de-9403-8c7e753981e5"
}

let fileId = "<FileId>"; // File Id from previous export action response
$.get("/api/export/" + fileId, function (res) { // Get file content from Export API
      // Output file content
});

{
  "success": false,
  "version": "19.0.0",
  "failureMessage": "<reason>"
}

{
  "success": true,
  "version": "19.0.0",
  "fileId": [ "575879b9-9c87-45de-9403-8c7e753981e5" ]
}

{
  "Photo": {
      "EmpID1.jpg": "http://<my_site>/api/file/employees/<encrypted_file_path>"
  },
  "version": "19.0.0"
}

{
  "success": false,
  "version": "19.0.0",
  "files": []
}

{
  "success": true,
  "userlevel": 1,
  "permissions": {
      "cars": 264,
      ...
  }
}

{
  "success": false,
  "userlevel": 1
}

$(function() {
    let store = store || {};
    // Store JWT
    store.setJWT = function (data) {
        this.JWT = data;
    }
    // Login
    $("#frm-login").submit(function (e) {
        e.preventDefault();
        let data = $("#frm-login").serialize();
        $.post("/api/login", data, function (data) {
            $("button").removeAttr("disabled");
            store.setJWT(data.JWT);
        }).fail(function (xhr, status, error) {
            alert("login failed. status: " + status + ", error: " + error);
        });
    });
    // Get protected resource
    let getProtectedResource = function (e) {
        e.preventDefault();
        $.ajax({
            url: "/api/view/orders/10248",
            type: "GET",
            success: function (data, status, xhr) {
                let out = (data && typeof data === 'object') ? JSON.stringify(data) : data;
                alert(out);
            },
            error: function (xhr, ajaxOptions, thrownError) {
                alert("status: " + xhr.status + ", error: " + thrownError);
            },
            beforeSend: function (request) { // Set JWT header
                request.setRequestHeader('X-Authorization', 'Bearer ' + store.JWT);
            }
        });
    }
    $("#btn-with-token").click(getProtectedResource);
});

<form id="frm-login" method="post">
    <input type="text" name="username" value="admin">
    <input type="text" name="password" value="master">
    <input type="submit" value="Login">
</form>
<button id="btn-with-token" type="button" disabled>Get order record</button>

<input type="file" id="id" name="name" onchange="uploadFiles(this);">

<input type="file" id="id" name="name[]" multiple onchange="uploadFiles(this);">

// Upload files
function uploadFiles(el) {
    let files = el.files, // Get FileList object
        name = el.name,
        url = "/api/upload",
        xhr = new XMLHttpRequest(),
        fd = new FormData();
    xhr.responseType = "json";
    xhr.open("POST", url, true);
    xhr.onreadystatechange = function() {
        if (xhr.readyState == 4 && xhr.status == 200 && xhr.response) { // Files uploaded
            if (xhr.response.filetoken) // Check file token
                console.log(xhr.response.filetoken);
        }
    };
    Array.from(files).forEach(file => fd.append(name, file)); // Append File object to form data
    xhr.send(fd);
}

function Api_Action($app)
{
    $app->get('/hello/{name}', function ($request, $response, $args) {
        $name = $args["name"] ?? null; // Get the input value
        if ($name !== null) {
            $response = $response->write("Hello, " . $name); // Write to response
        }
        return $response; // Return Psr\Http\Message\ResponseInterface object
    });
}

function Api_Action($app)
{
    $app->get('/getProductByName/{name}', function ($request, $response, $args) {
        $name = $args["name"] ?? null; // Get the input value
        if ($name !== null) {
            $response = $response->withJson(ExecuteRow("SELECT * FROM products WHERE ProductName = '" . AdjustSql($name) . "'")); // Select the record by name and return as JSON
        }
        return $response; // Return Psr\Http\Message\ResponseInterface object
    });
}

$.get("/api/getProductByName/Chai", function (res) {
    console.log(res); // Show the result in console
});