Веб-инструмент с использованием RESTful API, JSON и JavaScript

В этом примере показано, как создать веб-приложение, которое вычисляет цену облигации из простой формулы. Он использует API MATLAB ® Production Server™ RESTful и JSON Representation of MATLAB Data Types для отображения сквозного рабочего процесса использования сервера MATLAB Production Server. Этот пример выполняется путем ввода в веб-интерфейс следующих известных значений:

Номинальная стоимость (или стоимость облигации на момент погашения) - M
Купонная выплата - C
Количество платежей - N
Процентная ставка - i

Приложение вычисляет цену (P) на основе следующего уравнения:

P = C * ( (1 - (1 + i)^-N) / i ) + M * (1 + i)^-N

Используйте ползунки в веб-приложении, чтобы оценить различные облигации.

Шаг 1: Запись кода MATLAB
Шаг 2: Создание развертываемого архива с помощью приложения компилятора Production Server
Шаг 3. Размещение развертываемого архива на сервере
Шаг 4. Включение общего доступа к ресурсам (Cross-Origin Resource Sharing, CORS) на сервере
Шаг 5: Запись кода JavaScript с помощью API RESTful и JSON
Шаг 6: Встраивание JavaScript в HTML-код
Шаг 7: Пример выполнения

Шаг 1: Запись кода MATLAB

Запишите следующий код в MATLAB в ценовые облигации. Сохранение кода с использованием имени файла pricecalc.m.

function price = pricecalc(face_value, coupon_payment,...
                           interest_rate, num_payments)
    M = face_value;
    C = coupon_payment;
    N = num_payments;
    i = interest_rate;
    
    price = C * ( (1 - (1 + i)^-N) / i ) + M * (1 + i)^-N;

Шаг 2: Создание развертываемого архива с помощью приложения компилятора Production Server

Чтобы создать развертываемый архив для этого примера:

На вкладке Приложения выберите приложение Компилятор производственного сервера.
В списке Тип приложения выберите Развертываемый архив.
В поле Экспортированные функции добавьте pricecalc.m.
В разделе Сведения об архивировании измените pricecalc кому BondTools.
Щелкните Пакет (Package).

Созданный развертываемый архив, BondTools.ctf находится в for_redistribution папку проекта.

Шаг 3. Размещение развертываемого архива на сервере

При необходимости загрузите среду выполнения MATLAB по адресу https://www.mathworks.com/products/compiler/mcr. Дополнительные сведения см. в разделе Поддерживаемые версии среды выполнения MATLAB (производственный сервер MATLAB).
Создание сервера с помощью mps-new. Дополнительные сведения см. в разделе Создание экземпляра сервера (производственный сервер MATLAB). Если серверная среда еще не настроена, см. раздел mps-setup(Производственный сервер MATLAB) для получения дополнительной информации.
Если это еще не сделано, укажите местоположение среды выполнения MATLAB на сервере путем редактирования файла конфигурации сервера. main_config и задание пути для --mcr-root. Дополнительные сведения см. в разделе Настройка сервера (MATLAB Production Server).
Запустите сервер с помощью mps-start(Производственный сервер MATLAB) и убедитесь, что он работает с mps-status(Производственный сервер MATLAB).
Копировать BondTools.ctf в файл auto_deploy на сервере для размещения.

Шаг 4. Включение общего доступа к ресурсам (Cross-Origin Resource Sharing, CORS) на сервере

Включите общий доступ к ресурсам (Cross-Origin Resource Sharing, CORS) путем редактирования файла конфигурации сервера. main_config и определяют список источников домена, из которого могут быть сделаны запросы к серверу. Например, установка cors-allowed-origins опция для --cors-allowed-origins * разрешает запросы от любого домена для доступа к серверу. Посмотрите cors-allowed-origins(Производственный сервер MATLAB) и Настройка сервера (Производственный сервер MATLAB) для получения подробной информации.

Шаг 5: Запись кода JavaScript с помощью API RESTful и JSON

Напишите следующий код JavaScript ®, используя API RESTful и JSON Представление типов данных MATLAB в качестве руководства. Сохранить этот код как файл JavaScript с именемcalculatePrice.js.

Код:

calculatePrice.js

//calculatePrice.js : JavaScript code to calculate the price of a bond.
        function calculatePrice() 
        {
            var cp = parseFloat(document.getElementById('coupon_payment_value').value);
            var np = parseFloat(document.getElementById('num_payments_value').value);
            var ir = parseFloat(document.getElementById('interest_rate_value').value);
            var vm = parseFloat(document.getElementById('facevalue_value').value);

            // A new XMLHttpRequest object
            var request = new XMLHttpRequest();
            //Use MPS RESTful API to specify URL
            var url = "http://localhost:9910/BondTools/pricecalc";
            
            //Use MPS RESTful API to specify params using JSON
            var params = { "nargout":1,
                           "rhs": [vm, cp, ir, np] };

            document.getElementById("request").innerHTML = "URL: " + url + "<br>"
                    + "Method: POST <br>" + "Data:" + JSON.stringify(params);

            request.open("POST", url);

            //Use MPS RESTful API to set Content-Type
            request.setRequestHeader("Content-Type", "application/json");

            request.onload = function()
            {   //Use MPS RESTful API to check HTTP Status
                if (request.status == 200) 
                {
                    // Deserialization: Converting text back into JSON object
                    // Response from server is deserialized 
                    var result = JSON.parse(request.responseText);
					
                    //Use MPS RESTful API to retrieve response in "lhs"
                    if('lhs' in result)
                    {  document.getElementById("error").innerHTML = "" ;
                       document.getElementById("price_of_bond_value").innerHTML = "Bond Price: " + result.lhs[0].mwdata; }
                    else { document.getElementById("error").innerHTML = "Error: " + result.error.message; }
                }
                else { document.getElementById("error").innerHTML = "Error:" + request.statusText; }
                document.getElementById("response").innerHTML = "Status: " + request.status + "<br>"
                        + "Status message: " + request.statusText + "<br>" +
                        "Response text: " + request.responseText;
            }
            //Serialization: Converting JSON object to text prior to sending request
            request.send(JSON.stringify(params)); 
        }

        //Get value from slider element of "document" using its ID and update the value field
        //The "document" interface represent any web page loaded in the browser and
        //serves as an entry point into the web page's content.
        function printValue(sliderID, valueID) {
            var x = document.getElementById(valueID);
            var y = document.getElementById(sliderID);
            x.value = y.value;
        }
        //Execute JavaScript and calculate price of bond when slider is moved
        function updatePrice(sliderID, valueID) {
            printValue(sliderID, valueID);
            calculatePrice();
        }

Шаг 6: Встраивание JavaScript в HTML-код

Внедрите JavaScript из предыдущего шага в следующий HTML-код, используя следующий синтаксис:

<script src="calculatePrice.js" type="text/javascript"></script>

Сохранить этот код как HTML-файл с именем bptool.html.

Код:

bptool.html

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head lang="en">
    <meta charset="UTF-8">
    <title>Bond Pricing Tool</title>
</head>
<body>
    <!-- Embed the JavaScript code here by referencing calculatePrice.js -->
    <script src="calculatePrice.js" type="text/javascript"></script>
    <script>
        //Helper Code: Execute JavaScript immediately after the page has been loaded
        window.onload = function() {
            printValue('coupon_payment_slider', 'coupon_payment_value');
            printValue('num_payments_slider', 'num_payments_value');
            printValue('interest_rate_slider', 'interest_rate_value');
            printValue('facevalue_slider', 'facevalue_value');
            calculatePrice();
        }
    </script>
    <h1><a>Bond Pricing Tool</a></h1>
    <h2></h2>
    This example shows an application that calculates a bond price from a simple formula.<p>
    You run this example by entering the following known values into a simple graphical interface:<p>
      <ul>
        <li>Face Value (or value of bond at maturity) - M</li>
        <li>Coupon payment - C</li>
        <li>Number of payments - N</li>
        <li>Interest rate - i</li>
      </ul>
      The application calculates price (P) based on the following equation:<p>
      P = C * ( (1 - (1 + i)^-N) / i ) + M * (1 + i)^-N<p>
      <hr>
      <h3>M: Face Value </h3>
      <input id="facevalue_value" type="number" maxlength="4" oninput="updatePrice('facevalue_value', 'facevalue_slider')"/>
      <input type="range" id="facevalue_slider" value="0" min="0" max="10000" onchange="updatePrice('facevalue_slider', 'facevalue_value')"/>

      <h3>C: Coupon Payment </h3>
      <input id="coupon_payment_value" type="number" maxlength="4" oninput="updatePrice('coupon_payment_value', 'coupon_payment_slider')" />
      <input type="range" id="coupon_payment_slider" value="0" min="0" max="1000" onchange="updatePrice('coupon_payment_slider', 'coupon_payment_value')"/>
            
      <h3>N: Number of payments  </h3>
      <input id="num_payments_value" type="number" maxlength="4" oninput="updatePrice('num_payments_value', 'num_payments_slider')"/>
      <input type="range" id="num_payments_slider" value="0" min="0" max="1000" onchange="updatePrice('num_payments_slider', 'num_payments_value')"/>
      
      <h3>i: Interest rate </h3>
      <input id="interest_rate_value" type="number" maxlength="4" step="0.01" oninput="updatePrice('interest_rate_value', 'interest_rate_slider')"/>
      <input type="range" id="interest_rate_slider" value="0" min="0" max="1" step="0.01" onchange="updatePrice('interest_rate_slider', 'interest_rate_value')"/>

    <h2>BOND PRICE</h2>
    <p id="price_of_bond_value" style="font-weight: bold">
    <p id="error" style="color:red">

    <hr>
    <h3>Request to MPS Server</h3>
    <p id="request">
    
    <h3>Response from MPS Server</h3>
    <p id="response">
    <hr>
</body>
</html>

Шаг 7: Пример выполнения

Убедитесь, что сервер с развернутой функцией MATLAB запущен. Открытие HTML-файла bptool.html в веб-браузере. Цена облигации по умолчанию - NaN поскольку значения еще не введены. Попробуйте следующие значения, чтобы оценить облигацию:

Номинальная стоимость = $1000
Купонный платеж = $100
Количество платежей = 5
Процентная ставка = 0,08 (соответствует 8%)

Итоговая цена облигации составляет $1079,85.

Используйте ползунки в инструменте цены различных облигаций. Изменение процентной ставки приводит к наиболее резкому изменению цены облигации.

Связанные темы

Устранение ошибок API RESTful (производственный сервер MATLAB)

Документация