探索高级AJAX技术：深入研究异步请求和响应处理

news2024/12/23 6:07:00

 

 

 

 大家有关于JavaScript知识点不知道可以去

🎉博客主页：阿猫的故乡

🎉系列专栏：JavaScript专题栏

🎉ajax专栏：ajax知识点

🎉欢迎关注：👍点赞🙌收藏✍️留言

目录

学习目标：

学习内容：

学习时间：

学习产出：

异步请求和响应概述

异步请求与同步请求的区别

 XMLHttpRequest对象

发送异步请求和处理响应

 Fetch API

 异步请求的进一步处理

 JSON数据的异步加载和解析

 跨域请求

进一步的案例研究和实践

学习目标：

深入研究异步请求和响应处理

学习内容：

  1. 异步请求和响应概述

  2. XMLHttpRequest对象

  3. Fetch API

  4. 异步请求的进一步处理

  5. JSON数据的异步加载和解析

  6. 跨域请求

  7. 进一步的案例研究和实践

学习时间：

提示：这里可以添加计划学习的时间

例如：

  • 周一至周五晚上 7 点—晚上9点
  • 周六上午 9 点-上午 11 点
  • 周日下午 3 点-下午 6 点

学习产出：

异步请求和响应概述

AJAX（Asynchronous JavaScript and XML）是一种在Web应用程序中使用的技术，它通过使用JavaScript和XML（或JSON）来实现在后台与服务器进行异步通信，从而实现页面内容的局部更新，而不需要完全刷新整个页面。

AJAX的基本原理和工作流程如下：

  1. 前端页面向服务器发送异步请求：当用户在前端页面上执行某个操作（例如点击按钮），JavaScript代码会创建一个XMLHttpRequest对象，然后通过该对象向后端服务器发送异步请求。

  2. 后端服务器处理请求并返回结果：服务器收到请求后，会根据请求的内容进行相应的处理。服务器可以返回HTML、XML、JSON等格式的数据。

  3. 前端页面处理返回结果：当服务器返回结果时，JavaScript代码会通过回调函数处理返回的数据。根据返回的数据，前端页面可以动态更新部分页面内容，而不需要整个页面刷新。

  4. 更新页面内容：根据返回的数据，前端页面可以使用JavaScript代码来更新页面内容。这包括更新文本内容、显示隐藏元素、修改CSS样式等。

总体来说，AJAX的工作流程可以总结为以下几个步骤：前端发送请求、后端处理请求、后端返回结果、前端处理结果。通过这种方式，实现了异步通信和局部更新页面内容的效果，提升了用户体验和性能。

异步请求与同步请求的区别

 

异步请求和同步请求是AJAX中两种常见的请求方式，它们的主要区别在于请求和处理的方式以及对页面的影响。

异步请求：

  • 异步请求是指在发送请求的同时，前端页面不会等待服务器的响应，而是可以继续执行其他操作。
  • 异步请求通过使用回调函数处理返回的结果，不会阻塞其他代码的执行。
  • 异步请求可以提高用户体验，因为页面不需要等待服务器响应就可以进行其他操作，例如用户可以继续浏览页面或者与页面进行交互。
  • 异步请求通常使用XMLHttpRequest对象或者更现代化的Fetch API来实现。

同步请求：

  • 同步请求是指在发送请求之后，前端页面会一直等待服务器的响应，期间无法进行其他操作。
  • 同步请求会阻塞其后的代码执行，直到服务器响应返回或者超时。
  • 同步请求可能会降低用户体验，因为页面在等待服务器响应时无法进行其他操作，体验会被中断。
  • 同步请求通常使用XMLHttpRequest对象的open和send方法来实现。

在实际开发中，异步请求更为常见和推荐，因为它可以提高用户体验，允许页面进行其他操作而不被阻塞。同步请求仅在特定情况下使用，例如需要确保请求的顺序和依赖关系时。

 XMLHttpRequest对象

XMLHttpRequest对象是AJAX的核心，它提供了在浏览器中与服务器进行异步数据交互的功能。

XMLHttpRequest对象具有以下一些常用的属性和方法：

属性：

  • readyState: 表示请求的状态，其值变化的顺序为 0(未初始化) -> 1(打开) -> 2(发送) -> 3(接收) -> 4(完成)。
  • status: 表示服务器响应的状态码，如200表示成功，404表示资源未找到。
  • responseText: 作为字符串表示的响应内容。
  • responseXML: 作为XML文档对象表示的响应内容。
  • onreadystatechange: 当readyState属性发生变化时触发的事件。

方法：

  • open(method, url, async): 创建一个新的请求，指定请求的方法（如GET或POST）、请求的URL和是否使用异步方式。
  • send(data): 发送请求，如果是POST请求，可以通过data参数发送数据。
  • setRequestHeader(header, value): 设置请求头，例如设置Content-Type。
  • abort(): 取消当前的请求。

示例代码：

var xhr = new XMLHttpRequest();
xhr.onreadystatechange = function() {
    if (xhr.readyState === 4 && xhr.status === 200) {
        console.log(xhr.responseText);
    }
};
xhr.open('GET', 'https://api.example.com/data', true);
xhr.send();

通过以上代码，我们创建了一个XMLHttpRequest对象并发送了一个GET请求到指定的URL。在onreadystatechange事件中，我们检查了请求的状态并判断了响应的状态码，如果请求成功，我们打印出了响应内容。

XMLHttpRequest对象是AJAX的核心，它提供了在浏览器中与服务器进行异步数据交互的功能。

XMLHttpRequest对象具有以下一些常用的属性和方法：

属性：

  • readyState: 表示请求的状态，其值变化的顺序为 0(未初始化) -> 1(打开) -> 2(发送) -> 3(接收) -> 4(完成)。
  • status: 表示服务器响应的状态码，如200表示成功，404表示资源未找到。
  • responseText: 作为字符串表示的响应内容。
  • responseXML: 作为XML文档对象表示的响应内容。
  • onreadystatechange: 当readyState属性发生变化时触发的事件。

方法：

  • open(method, url, async): 创建一个新的请求，指定请求的方法（如GET或POST）、请求的URL和是否使用异步方式。
  • send(data): 发送请求，如果是POST请求，可以通过data参数发送数据。
  • setRequestHeader(header, value): 设置请求头，例如设置Content-Type。
  • abort(): 取消当前的请求。

示例代码：

var xhr = new XMLHttpRequest();
xhr.onreadystatechange = function() {
    if (xhr.readyState === 4 && xhr.status === 200) {
        console.log(xhr.responseText);
    }
};
xhr.open('GET', 'https://api.example.com/data', true);
xhr.send();

通过以上代码，我们创建了一个XMLHttpRequest对象并发送了一个GET请求到指定的URL。在onreadystatechange事件中，我们检查了请求的状态并判断了响应的状态码，如果请求成功，我们打印出了响应内容。

发送异步请求和处理响应

创建和初始化XMLHttpRequest对象的步骤如下：

  1. 创建XMLHttpRequest对象：使用new XMLHttpRequest()创建一个新的XMLHttpRequest对象。

  2. 初始化请求：使用open()方法来初始化请求。open()方法接受三个参数：请求的方法（GET, POST等），请求的URL和是否异步发送请求的布尔值。

  3. 设置请求头：如果需要设置请求头，可以使用setRequestHeader()方法来设置。例如，如果需要发送JSON数据，可以设置请求头为'Content-Type', 'application/json'。

  4. 发送请求：使用send()方法来发送请求。对于GET请求，可以将请求参数作为URL的一部分，在open()方法中将URL和请求参数连接起来；对于POST请求，可以将请求参数作为send()方法的参数。

  5. 处理响应：可以使用onreadystatechange事件监听XMLHttpRequest对象的状态变化。当readyState状态为4（已完成）时，可以使用status属性来判断响应的状态码。如果状态码是200，表示请求成功，可以使用responseText或responseXML属性来获取响应的内容。

XMLHttpRequest对象的高级功能包括：

  1. 设置请求头：可以使用setRequestHeader()方法来设置请求头。例如，可以设置请求头为'Content-Type', 'application/json'来发送JSON数据。

  2. 发送表单数据：可以使用FormData对象来发送表单数据。可以将表单元素的值添加到FormData对象中，然后将FormData对象作为send()方法的参数进行发送。

  3. 监听进度：可以使用onprogress事件监听上传或下载的进度。可以使用loaded属性获取已经传输的数据大小，使用total属性获取总共需要传输的数据大小，从而计算出传输的百分比。

  4. 取消请求：可以使用abort()方法来取消请求。

  5. 超时处理：可以使用timeout属性来设置超时时间，如果请求超过指定的时间还没有返回，可以触发超时事件。

  6. 设置凭证：可以使用withCredentials属性将凭证（如cookie）发送给服务器，以进行身份验证或会话跟踪。

  7. 跨域请求：可以使用Access-Control-Allow-Origin响应头来允许跨域请求，或使用CORS（跨源资源共享）来处理跨域请求。

总结来说，通过创建和初始化XMLHttpRequest对象，可以发送异步请求并在响应返回后进行处理。XMLHttpRequest对象还提供了一系列的高级功能，可以根据具体的需求进行使用。

 Fetch API

Fetch API是一种用于发送和接收HTTP请求的现代浏览器API，它提供了一种更简洁、更强大的方式来处理网络请求。相比于传统的XMLHttpRequest对象，Fetch API更易于使用和理解。

Fetch API的特点包括：

  1. Promise-based：Fetch API使用Promise来处理请求和响应，使得异步操作更加方便和可控。可以使用Promise的then()和catch()方法来处理请求成功和失败的情况。

  2. 简洁的API：Fetch API提供了一组简洁而灵活的方法来进行请求和处理响应。其中最常用的方法是fetch()，它接受一个URL作为参数并返回一个Promise对象。

  3. 支持流式数据：Fetch API支持流式数据传输，可以通过使用Response对象上的body属性来处理流式数据。

  4. 可以使用Headers对象来设置请求头和处理响应头。

  5. 支持跨域请求：Fetch API默认支持跨域请求，但在发送跨域请求时需要注意设置CORS（跨源资源共享）相关的选项。

使用Fetch API发送请求的基本步骤如下：

  1. 构建请求对象：使用Request对象来构建请求，可以通过传入URL和可选的配置选项来创建Request对象。

  2. 发送请求：使用fetch()方法来发送请求，fetch()方法返回一个Promise对象，可以使用then()方法来处理响应。

  3. 处理响应：在then()方法中，可以使用Response对象来处理响应。可以通过Response对象上的一系列方法和属性来获取响应的状态码、请求头、响应头和响应体等。

  4. 处理错误：使用catch()方法来处理请求错误，例如网络错误或请求被服务器拒绝等。

当使用Fetch API发送请求时，通常会遵循以下的代码结构：

fetch(url, options)
  .then(response => {
    // 处理响应
    // 返回一个Promise对象
  })
  .catch(error => {
    // 处理错误
  });

在这个代码中，首先使用fetch()方法发送请求，它接受一个URL和可选的配置选项作为参数。fetch()方法返回一个Promise对象，允许我们使用then()和catch()方法来处理请求和响应。

在then()方法中，我们可以使用response对象来处理响应。Response对象提供了一系列的方法和属性，可以获取响应的状态码、请求头、响应头和响应体等。

fetch(url, options)
  .then(response => {
    if (response.ok) {
      // 如果响应成功（状态码为200-299），则返回响应的JSON数据
      return response.json();
    } else {
      // 如果响应失败，则抛出错误
      throw new Error('请求失败');
    }
  })
  .then(data => {
    // 处理返回的JSON数据
  })
  .catch(error => {
    // 处理请求错误
  });

上面的代码演示了如何处理响应成功和失败的情况。如果响应成功（状态码为200-299），我们可以使用response.json()方法来解析响应的JSON数据。如果响应失败，则抛出一个错误。

在catch()方法中，我们可以处理请求错误，例如网络错误或请求被服务器拒绝等。

配置选项（options）是可选的，可以用来设置请求的方法、请求头、请求体和认证信息等。一些常见的选项包括：

  • method：请求的方法，例如GET、POST等，默认为GET。
  • headers：请求头，可以使用Headers对象或者一个普通对象来设置。
  • body：请求体，可以是一个Blob、BufferSource、FormData、URLSearchParams或者一个普通对象。
  • mode：请求的模式，例如cors、no-cors、same-origin等，默认为cors。
  • credentials：请求发送时是否携带cookie等认证信息，默认为same-origin。
  • cache：请求的缓存模式，例如default、no-store、reload等，默认为default。

以上是Fetch API的基本用法，通过使用fetch()方法和Response对象，我们可以轻松地发送请求和处理响应。

 

Fetch API的优点是它提供了更简洁、更强大的API来处理网络请求，并且与现代的异步操作方法（Promise）相结合，使代码更易于理解和维护。但也需要注意兼容性问题，因为Fetch API在一些旧版本的浏览器中不被支持。可以考虑使用polyfill或者库（如axios等）来处理兼容性问题。

 异步请求的进一步处理

异步请求的进一步处理可以包括以下几个方面：

  1. 错误处理：处理请求过程中可能出现的错误，例如网络连接错误、服务器返回错误等。可以通过添加错误处理函数或使用try-catch语句来捕获并处理错误。

  2. 超时处理：如果请求处理时间过长，可以设置一个超时时间，如果请求在超时时间内没有返回结果，则可以进行相应的处理操作，例如重新发送请求、提示用户等。

  3. 进度跟踪：如果请求过程较长，可以通过回调函数或事件来跟踪请求的进度，以便在需要时更新用户界面或显示进度条等。

  4. 数据处理：根据返回的数据类型，可以进行相应的数据处理操作，例如解析JSON数据、提取关键信息等。

  5. 缓存处理：如果请求的数据可以缓存，可以在请求返回后将数据存储在本地缓存中，以便下次使用。

  6. 并发处理：如果有多个异步请求需要处理，可以使用Promise.all、async/await等方式进行并发处理，并等待所有请求都完成后再进行下一步操作。

  7. 销毁处理：如果某个异步请求不再需要，可以取消该请求，释放资源。

 

当使用异步请求时，可以使用一些进一步的处理方式来处理请求和响应。下面是一些常见的处理方式以及相关的代码解释：

  1. 错误处理：
fetch(url)
  .then(response => {
    if (!response.ok) {
      throw new Error('请求错误');
    }
    return response.json();
  })
  .catch(error => {
    console.error(error);
    // 错误处理代码
  });

在fetch请求的链式调用中，可以通过检查response.ok属性来判断响应是否成功。如果响应不成功，则可以通过throw关键字抛出一个错误。在链式调用中，可以使用.catch方法捕获并处理错误。

  1. 超时处理：
const timeoutPromise = new Promise((resolve, reject) => {
  setTimeout(() => reject(new Error('请求超时')), 5000);
});

Promise.race([fetch(url), timeoutPromise])
  .then(response => {
    // 请求完成处理代码
  })
  .catch(error => {
    console.error(error);
    // 错误处理代码
  });

在上述代码中，通过创建一个Promise来模拟超时处理。使用Promise.race方法，将fetch请求和超时Promise传入，只要其中一个完成或拒绝，就会执行相应的处理代码。

  1. 进度跟踪：
fetch(url, {
  method: 'POST',
  body: JSON.stringify(data),
  headers: {
    'Content-Type': 'application/json'
  },
  signal: controller.signal
})
  .then(response => {
    // 正常处理代码
  })
  .catch(error => {
    if (error.name === 'AbortError') {
      console.log('请求被中止');
      // 中止处理代码
    } else {
      console.error(error);
      // 错误处理代码
    }
  });

const controller = new AbortController();
const signal = controller.signal;

// 中止请求
controller.abort();

在上述代码中，可以使用AbortController和AbortSignal来中止请求。通过传递signal给fetch的options对象中的signal属性，可以中止该请求。

  1. 数据处理：
fetch(url)
  .then(response => response.json())
  .then(data => {
    // 数据处理代码
  })
  .catch(error => {
    console.error(error);
    // 错误处理代码
  });

在上述代码中，使用response.json()方法来将响应数据解析为JSON格式。通过then方法处理解析后的数据。

这些是一些常见的异步请求进一步处理方式和代码解释，可以根据实际需求进行相应的处理操作。

总之，进一步处理异步请求需要根据具体情况来确定，以上提到的是一些常见的处理方式。

 JSON数据的异步加载和解析

当需要异步加载和解析JSON数据时，可以使用Fetch API来发送异步请求，并通过Promise链式调用来处理响应数据。以下是一个示例的代码解释和注释：

fetch('http://example.com/api/data.json') // 发送异步请求获取JSON数据
  .then(response => response.json()) // 将响应数据解析为JSON格式
  .then(data => {
    // 在这里处理解析后的JSON数据
    // 可以访问和操作data对象
    console.log(data);
  })
  .catch(error => {
    console.error(error);
    // 错误处理代码
  });

这段代码使用了fetch函数来发送异步请求，其中传入的参数为JSON数据的URL。fetch返回一个Promise，可以使用.then()方法在响应成功时处理数据，使用.catch()方法处理错误。

在处理成功的响应时，通过调用response.json()方法将响应数据解析为JSON格式。这也返回一个Promise，可以在后续的.then()方法中访问和操作解析后的JSON数据。

在示例代码中，解析后的数据存储在data变量中，并通过console.log()函数打印在控制台上。你可以根据具体的需求来进一步处理数据，如显示在网页上或进行其他操作。

如果发生错误，如网络问题或解析错误，可以通过.catch()方法捕获错误并进行相应的处理。

这段代码展示了一个基本的异步加载和解析JSON数据的过程，你可以根据实际需求进行相应的修改和扩展。

 跨域请求

跨域请求是指通过JavaScript代码发送的请求，目标URL的域与当前页面所在的域不同。由于浏览器的同源策略限制，这种请求通常是不被允许的。然而，可以通过CORS（跨源资源共享）机制来实现跨域请求。下面是一个使用Fetch API发送跨域请求的代码解释和注释：

fetch('http://api.example.com/data', {
  method: 'GET',
  headers: {
    'Content-Type': 'application/json',
    'Access-Control-Allow-Origin': '*' // 允许跨域请求的来源
  }
})
  .then(response => response.json())
  .then(data => {
    // 处理响应数据
    console.log(data);
  })
  .catch(error => {
    console.error(error);
    // 错误处理代码
  });

这段代码使用fetch函数发送一个GET请求到"http://api.example.com/data"，这个URL与当前页面的域不同，因此是一个跨域请求。

在fetch函数的第二个参数中，我们可以设置请求的headers。在这个例子中，我们设置了'Content-Type'为'application/json'，并添加了'Access-Control-Allow-Origin'头部字段，其值为'*'，表示允许来自任意域的跨域请求。

在成功的响应中，使用response.json()方法将响应数据解析为JSON格式，并在.then()方法中处理解析后的数据。

如果发生错误，可以通过.catch()方法捕获错误并进行相应的处理。

需要注意的是，跨域请求需要服务器端进行相应的配置，以允许跨域请求的来源。在这个例子中，服务器需要设置允许任意域的跨域请求。具体的服务器配置可能因服务器软件和配置方式而有所不同。

这段代码展示了一个简单的跨域请求的过程，你可以根据实际情况对其进行修改和扩展。

进一步的案例研究和实践

 

下面是使用ES6语法解释的进一步案例研究和实践代码：

场景：假设我们的应用需要从一个API中获取用户的个人信息，并在页面上展示这些信息。

代码解释：

// 从另一个域的API获取用户信息
fetch('http://api.example.com/userinfo', {
  method: 'GET',
  credentials: 'include', // 发送跨域请求包含凭证信息（如cookies）
  headers: {
    'Content-Type': 'application/json',
    'Access-Control-Allow-Origin': '*' // 允许跨域请求的来源
  }
})
  .then(response => response.json())
  .then(data => {
    // 处理响应数据
    displayUserInfo(data);
  })
  .catch(error => {
    console.error(error);
    // 错误处理代码
  });

// 在页面上展示用户信息
const displayUserInfo = (user) => {
  // 创建DOM元素来展示用户信息
  const userContainer = document.createElement('div');
  userContainer.innerHTML = `
    <h2>${user.name}</h2>
    <p>Email: ${user.email}</p>
    <p>Age: ${user.age}</p>
  `;

  // 将用户信息添加到页面上
  document.body.appendChild(userContainer);
};

在这个示例中，我们使用了箭头函数来定义处理响应数据的displayUserInfo函数。箭头函数提供了更简洁和可读性更强的代码风格。

另外，在fetch请求的头部中，我们使用了对象的简写语法。这意味着我们可以直接使用键名来定义属性，而无需显式地指定键和值。

同时，我们还使用了模板字符串来创建DOM元素的innerHTML，以更方便地插入用户信息。

这些都是ES6语法中的一些特性，它们可以使代码更简洁、易读和易于维护。然而，需要注意的是，这些特性可能需要在支持ES6的环境中运行，或者通过工具（如Babel）进行转换，以使代码在旧版JavaScript环境中运行。

本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如若转载，请注明出处：http://www.coloradmin.cn/o/1312669.html

如若内容造成侵权/违法违规/事实不符，请联系多彩编程网进行投诉反馈，一经查实，立即删除！

相关文章

Docker-consul容器服务自动发现与注册

Docker-consul容器服务自动发现与注册

什么叫微服务或者注册与发现&#xff1f; 是一种分布式管理系统&#xff0c;定位服务的方法。 在传统的架构中&#xff0c;应用程序之间直连到已知的服务。 已知的服务&#xff1a;设备提供的网络、IP地址、基于tcp/ip端口 基于现微服务部署&#xff0c;服务的动态性&#…
阅读更多...
在MDK开发调试过程中，发现程序正常运行，但是打断点无法进入。

在MDK开发调试过程中，发现程序正常运行，但是打断点无法进入。

在MDK开发调试过程中&#xff0c;发现程序正常运行&#xff0c;但是打断点无法进入。 打断点无法进入&#xff1a; 程序无法进行&#xff1a; 查找问题&#xff1a;这些都已经配置 上面都已经配置&#xff0c;最终发现: 勾选后进入断点成功。
阅读更多...
以csv为源 flink 创建paimon 临时表相关 join 操作

以csv为源 flink 创建paimon 临时表相关 join 操作

目录 概述配置关键配置测试启动 kyuubi执行配置中的命令 bug解决bug01bug02 结束 概述 目标&#xff1a;生产中有需要外部源数据做paimon的数据源&#xff0c;生成临时表&#xff0c;以使用与现有正式表做相关统计及 join 操作。 环境&#xff1a;各组件版本如下 kyuubi 1.8…
阅读更多...
Redis 过期删除策略、内存回收策略、单线程理解

Redis 过期删除策略、内存回收策略、单线程理解

不知从何开始Redis的内存淘汰策略也开始被人问及&#xff0c;卷&#xff01;真的是太卷了。难不成要我们去阅读Redis源码吗&#xff0c;其实问题的答案&#xff0c;在Redis中的配置文件中全有&#xff0c;不需要你阅读源码、这个东西就是个老八股&#xff0c;估计问这个东西是想…
阅读更多...
微信小程序识别小程序码并传参

微信小程序识别小程序码并传参

一、场景 连续看到几个类似关于小程序生成二维码场景的问题&#xff0c;分销的场景和单商品购买的页面居多 二、思路 #mermaid-svg-8CjFXSzutuF1OvO8 {font-family:"trebuchet ms",verdana,arial,sans-serif;font-size:16px;fill:#333;}#mermaid-svg-8CjFXSzutuF1…
阅读更多...
中小企业业财融合策略(2)：财务赋能，如何支持业务经营？

中小企业业财融合策略(2)：财务赋能，如何支持业务经营？

上一文《中小企业业财融合(1):把财务从琐碎的凭证处理、核算中解放出来!》&#xff0c;我们提出了财务升级的背景以及必要性&#xff0c;本篇我们就财务赋能&#xff0c;如何支持业务经营&#xff1f;提出一些简要的看法&#xff0c;希望对大家有所帮助。 一、财务赋能&#x…
阅读更多...
com.sun.org.apache.xerces.internal.impl.dv.util.Base64

com.sun.org.apache.xerces.internal.impl.dv.util.Base64

com.sun.org.apache.xerces.internal.impl.dv.util.Base64 Access restriction: The type Base64 is not API (restriction on required library D:\Java\jdk1.8.0_341\jre\lib\rt.jar) Maven Update Project 虽然没错误了&#xff0c;但是有警告&#xff0c;好奇&#xff1f;…
阅读更多...
TCL实业，在智能时代风中起舞

TCL实业，在智能时代风中起舞

从惠州的一个磁带厂起步&#xff0c;成长为智能终端、半导体显示、新能源光伏三大业务齐头并进的制造业大鳄&#xff0c;TCL是中国制造业穿越周期的一面旗帜。而作为国内电视品牌中唯一拥有上游供应链自主权的企业&#xff0c;C端用户往往更熟悉那个总是在电视终端领域拿出好产…
阅读更多...
RT-DETR优化：ASF-YOLO提取多尺度特征 | 2023年12月最新成果

RT-DETR优化：ASF-YOLO提取多尺度特征 | 2023年12月最新成果

🚀🚀🚀本文改进： ASF-YOLO一种新的特征融合网络架构，该网络由两个主要的组件网络组成，可以为小目标分割提供互补的信息:(1)SSFF模块，它结合了来自u;(2)TFE模块，它可以捕获小目标的局部精细细节等 🚀🚀🚀YOLOv8改进专栏：http://t.csdnimg.cn/hGhVK 学姐带你学…
阅读更多...
网络协议 - TCP 协议详解

网络协议 - TCP 协议详解

网络协议 - TCP 协议详解 简述TCP头格式TCP的状态机数据传输中的Sequence NumberTCP重传机制超时重传机制快速重传机制SACK 方法Duplicate SACK – 重复收到数据的问题示例一&#xff1a;ACK丢包示例二&#xff0c;网络延误 TCP的RTT算法经典算法Karn / Partridge 算法Jacobson…
阅读更多...
记录 | Microsoft Remote Desktop for mac安装

记录 | Microsoft Remote Desktop for mac安装

Microsoft Remote Desktop for mac安装 网上一些教程的下载安装老是跳转来跳转去&#xff0c;而且下载了的也不一定适用于 mac&#xff0c; 这里直接提供 Microsoft Remote Desktop for mac 的安装包的下载地址&#xff1a; microsoft-remote-desktop-for-mac
阅读更多...
f盘隐藏的文件夹怎么找出来？介绍几种有效方法

f盘隐藏的文件夹怎么找出来？介绍几种有效方法

在计算机中&#xff0c;我们经常会遇到隐藏的文件或文件夹&#xff0c;在F盘中隐藏的文件夹也不例外。隐藏的文件夹可能是由系统生成的&#xff0c;或者是用户自行设定的隐私文件夹。无论是因为误操作还是出于其他原因&#xff0c;如果你想找出F盘中的隐藏文件夹&#xff0c;本…
阅读更多...
用EXCEL计算NTC、BS、电压等AD参数

用EXCEL计算NTC、BS、电压等AD参数

前言 之前计算NTC的AD值算得很麻烦&#xff0c;因为51内核的单片机不支持除法运算&#xff0c;更别说浮点运算了。 EXCEL自动算出参数就显得很方便了。 有纰漏请指出&#xff0c;转载请说明。 学习交流请发邮件 1280253714qq.com 理论基础 参考这篇文章NTC热敏电阻温度采集…
阅读更多...
数据常见的提取和筛选方法

数据常见的提取和筛选方法

平时对于一些不标准的数据&#xff0c;需要提取或者筛选其中的部分数据。本文主要分享一些常用的办法&#xff0c;同时也作为一个笔记的备份。 1. 正则表达式 正则表达式比较适合提取有明确类型的数据&#xff0c;比如字母&#xff0c;数字&#xff0c;汉字&#xff0c;日期等…
阅读更多...
从GitHub下载的Android Studio项目，在较新版本AS打开出现版本不兼容问题的解决方法。

从GitHub下载的Android Studio项目，在较新版本AS打开出现版本不兼容问题的解决方法。

在GitHub下载了一个Android Studio计算器项目&#xff0c;打开项目后出现一系列问题&#xff0c;本文简单记录出现的问题及解决方法。 1、Gradle安装目录的路径出现错误 问题描述&#xff1a;The specified Gradle installation directory G:\Android\Android Studio\gradle\…
阅读更多...
【腾讯云 HAI 域探秘】释放生产力：基于 HAI 打造团队专属的 AI 编程助手

【腾讯云 HAI 域探秘】释放生产力：基于 HAI 打造团队专属的 AI 编程助手

文章目录 前言一、HAI 产品介绍二、HAI 应用场景介绍三、HAI 生产力场景探索&#xff1a;基于 HAI 打造团队专属的 AI 编程助手3.1 申请 HAI 内测资格3.2 购买 HAI 实例3.3 下载 CodeShell-7B-Chat 模型3.4 部署 text-generation-inference(TGI)推理服务3.4.1 下载 text-genera…
阅读更多...
目标检测mAP计算以及coco评价标准

目标检测mAP计算以及coco评价标准

这篇是我对哔哩哔哩up主 霹雳吧啦Wz 的视频的文字版学习笔记 感谢他对知识的分享 讲一下目标检测中的一些常见的指标 在我们使用目标检测网络训练时 最后在验证集上会得到一个coco的评价列表 就像我们图中给的这一系列参数列表一样 我们再进一步引入两个概念 第一个叫做precisi…
阅读更多...
[已解决]HttpMessageNotReadableException: JSON parse error: Unexpected character:解析JSON时出现异常的问题分析与解决方案

[已解决]HttpMessageNotReadableException: JSON parse error: Unexpected character:解析JSON时出现异常的问题分析与解决方案

&#x1f337;&#x1f341; 博主 libin9iOak带您 Go to New World.✨&#x1f341; &#x1f984; 个人主页——libin9iOak的博客&#x1f390; &#x1f433; 《面试题大全》 文章图文并茂&#x1f995;生动形象&#x1f996;简单易学&#xff01;欢迎大家来踩踩~&#x1f33…
阅读更多...
标书明标的含义与制作要求

标书明标的含义与制作要求

一、什么是标书明标&#xff1f; 在招投标过程中&#xff0c;标书明标是一种常见的招标方式&#xff0c;它是指招标人将招标文件公开进行公示&#xff0c;以吸引投标人参与竞标。在标书明标中&#xff0c;招标文件会明确列出项目的具体要求、投标人的资格条件、技术标准等&…
阅读更多...
docker核心原理——unionfs、namespace、cgroup

docker核心原理——unionfs、namespace、cgroup

docker 核心原理 docker的核心原理其实就是cgroupnamespaceunionfs 组合实现的隔离机制&#xff0c;资源控制等。 隔离机制 在容器进程启动之前重新挂载它的整个根⽬录“/”&#xff0c;⽤来为容器提供隔离后的执⾏环境⽂件系统通过Linux Namespace 创建隔离&#xff0c;决…
阅读更多...
推荐文章
最新文章

Copyright @ 2022~2023