xhr 类型的 Ajax 调用请求需要更长的时间来执行

问题描述 投票:0回答:0

在 MVC 和 knockout.js 应用程序调用中使用以下函数进行

GetCalendar: function (monthYear) {
    var html = '';
    $.ajax({
        url: baseURL + 'ajax/GetCalendarHTML',
        type: 'GET',
        cache: true,
        data: {
            month: monthYear.month, year: monthYear.year
        },
        success: function (cal) {
            $('#cal' + monthYear.month + monthYear.year).html(cal);
        },
        error: function (data) {

        }
    });
    return html;
}

这会以 json 形式将数据转换为 HTML,如下所示

<table cellspacing='0' class='calendar'><thead> <tr class='month-year'><th colspan='7'><span class='month'>March</span><span class='year'>2023</span></th></tr><tr class='weekdays'> <td>Sun</td> <td>Mon</td> <td>Tue</td> <td>Wed</td> <td>Thu</td> <td>Fri</td> <td>Sat</td></tr></thead><tbody border='1'><tr><td class='premonth'></td><td class='premonth'></td><td class='premonth'></td><td style='background-color:#886B29'>1</td><td style='background-color:#886B29'>2</td><td style='background-color:#886B29'>3</td><td style='background-color:#886B29'>4</td></tr><tr><td>5</td><td>6</td><td>7</td><td>8</td><td>9</td><td>10</td><td>11</td></tr><tr><td style='background-color:#FEF200'>12</td><td style='background-color:#FEF200'>13</td><td style='background-color:#FEF200'>14</td><td style='background-color:#FEF200'>15</td><td style='background-color:#FEF200'>16</td><td style='background-color:#FEF200'>17</td><td style='background-color:#FEF200'>18</td></tr><tr><td style='background-color:#FEF200'>19</td><td>20</td><td>21</td><td>22</td><td>23</td><td>24</td><td style='background-color:#a02647'>25</td></tr><tr><td style='background-color:#a02647'>26</td><td style='background-color:#a02647'>27</td><td style='background-color:#a02647'>28</td><td style='background-color:#a02647'>29</td><td style='background-color:#a02647'>30</td><td style='background-color:#a02647'>31</td></tr></tbody></table>

但是这些请求每个月都会发送,并且由于某种原因需要很长时间。一些用户报告长达 5-7 分钟,但对我来说,它在 1 分钟内下载,这仍然很慢。

功能可以换成新的可以更快下载数据的东西

ajax/GetCalendarHTML?month=2&year=2023

这是6-7年前开发的老应用

我将其转换为 Fetch 请求,但这不起作用

async function GetCalendar(monthYear) {
  try {
    const response = await fetch('${baseURL}ajax/GetCalendarHTML?month=${monthYear.month}&year=${monthYear.year}', {
      cache: 'default',
      method: 'GET'
    });

    if (!response.ok) {
      throw new Error('Network response was not ok');
    }

    const cal = await response.text();
    $('#cal' + monthYear.month + monthYear.year).html(cal);
    return cal;
  } catch (error) {
    console.error('Error fetching calendar:', error);
  }
}
javascript ajax asp.net-mvc knockout.js xmlhttprequest
© www.soinside.com 2019 - 2024. All rights reserved.