axios js请求后端的使用直接使用

2024-07-16 17:24:02
开发
15

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>

    <!-- 引入axios 使用cdn -->
    <!-- <script src="https://unpkg.com/axios/dist/axios.min.js"></script> -->
    <script src="https://unpkg.com/axios@1.1.3/dist/axios.min.js"></script>

    <!-- <script src="https://unpkg.com/axios@0.24.0/dist/axios.min.js"></script> -->
  </head>
  <body>
    <h1>每天一句土味情话</h1>
    <p>啊啊啊啊啊啊啊啊</p>
  </body>
  <script>
    const p = document.querySelector("p");
    const url = "https://v2.alapi.cn/api/qinghua";
    axios
      // 发送请求
      .get(url, {
        params: {
          // 需要2个参数，一个是token,一个是返回的数据类型
          //   在使用在线接口网站的时候，注册以后会有自己的token
          //线接口网站 https://www.alapi.cn/
          token: "Od57Mf5oIUHyW8Eu",
          //   返回的数据类型
          format: "json",
        },
      })
      //   因为axios是基于promise,所以和prmise一样的使使用.then().catch()
      .then(function (response) {
      //可以用浏览器打开看看这个response是什么console.log(response)
        // 用浏览器打开console.log(response)是一个对象，我们要的是在这个对象里面的一句话
        // 再把对象里面这一句话添加到P节点
        p.innerHTML = response.data.data.content;
      })
      //   如果有错误，就打印错误
      .catch(function (error) {
        console.log(error);
      });
  </script>
</html>

原文地址:https://blog.csdn.net/liuchenbaidu/article/details/140469048 本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如若转载，请注明出处：https://www.suanlizi.com/kf/1813142535632195584.html 如若内容造成侵权/违法违规/事实不符，请联系《酸梨子》网邮箱：1419361763@qq.com进行投诉反馈，一经查实，立即删除！

阅读全部

axios js请求后端的使用直接使用

相关推荐

最近更新

热门阅读