各种获取数据接口

各种获取数据免费接口

1.音频接口

  • 代理配置
javascript 复制代码
   '/music-api':{
        target:'https://api.cenguigui.cn/',
        changeOrigin:true,
        rewrite:(path)=>path.replace(/^\/music-api/,''),
        secure:false
      }
  • axios全局配置
java 复制代码
import axios from 'axios';

const MusicClient = axios.create({
    baseURL: '/music-api',
    withCredentials: false,
    headers: {
        'Content-Type': 'application/json',
    }
});
export default MusicClient;
  • 定义响应式变量接收路径参数
javascript 复制代码
const musicUrl = ref('');
  • 发送请求,获取数据
javascript 复制代码
// 获取音乐
const getMusic = async () => {
  try {
    const res = await musicApi.get('/api/netease');
    musicUrl.value = res.data.data.play_url;
    console.log(musicUrl);
  } catch (e) {
    console.error("Error fetching music:", e);
  }
}

2.视频接口

  • 代理配置
javascript 复制代码
    // 配置视频动态代理
      '/video-api':{
        target:'https://tools.mgtv100.com',
        changeOrigin:true,
        rewrite:(path)=>path.replace(/^\/video-api/,''),
        secure:false
      },
  • axios全局配置
javascript 复制代码
import axios from 'axios';

const VideoClient = axios.create({
    baseURL: '/video-api',
    withCredentials: false,
    headers: {
        'Content-Type': 'application/json',
    }
});

export default VideoClient;
  • 定义响应式变量,接收参数
javascript 复制代码
const videoUrl = ref('');
  • 发送axios请求获取数据
javascript 复制代码
import axios from 'axios';

const VideoClient = axios.create({
    baseURL: '/video-api',
    withCredentials: false,
    headers: {
        'Content-Type': 'application/json',
    }
});

export default VideoClient;

3.图片接口

  • 代理配置
javascript 复制代码
      // 为 dmoe.cc 的 API 请求创建一个代理规则
      '/dmoe-api': {
        target: 'https://www.dmoe.cc',
        changeOrigin: true,
        rewrite: (path) => path.replace(/^\/dmoe-api/, ''),
        secure: false
      },
  • axios全局配置
javascript 复制代码
import axios from 'axios';

const ApiClient = axios.create({
    baseURL: '/dmoe-api', // 这个路径会根据Vite配置自动代理到dmoe.cc
    withCredentials: false,
    headers: {
        'Content-Type': 'application/json',
    }
});

export default ApiClient;
  • 定理响应式变量,接收路径参数
javascript 复制代码
const imgUrl = ref('');
  • 发送axios请求,获取路径参数
javascript 复制代码
// 获取随机图片
const getImage = async () => {
  try {
    const res = await ApiClient.get('/random.php?return=json');
    imgUrl.value = res.data.imgurl;
    console.log(res.data);
  } catch (error) {
    console.error("Error fetching image:", error);
  }
};

4.文字接口

  • 代理配置
javascript 复制代码
      //配置文字动态代理
      '/text-api':{
        target:'https://api.uomg.com/',
        changeOrigin:true,
        rewrite:(path)=>path.replace(/^\/text-api/,''),
        secure:false
      },
  • axios全局配置
java 复制代码
import axios from 'axios';

const TextClient = axios.create({
    baseURL: '/text-api',
    withCredentials: false,
    headers: {
        'Content-Type': 'application/json',
    }
});
export default TextClient;
  • 定义响应式变量,接收请求参数
javascript 复制代码
const TextUrl = ref('');
  • 发送axios请求接收文字路径参数
java 复制代码
// 获取随机文字
const getText = async () => {
  try {
    const res = await textApi.get('/api/rand.qinghua');
    TextUrl.value = res.data.content;
    console.log(res.data);
  } catch (e) {
    console.error("出现错误", e);
  }
}

5.向tomcat服务器发送请求获取员工数据

  • 配置代理
javascript 复制代码
      '/api':{
        target:'http://localhost:8080',
        changeOrigin:true,
        rewrite:(path)=>path.replace(/^\/api/,'')
      },
  • 配置axios全局请求
javascript 复制代码
import axios from "axios";
export const instance= axios.create({
    baseURL:'/api',
    timeout:3000
})
  • 发送axios请求,获取数据
javascript 复制代码
// 定义获取账户信息的方法
const getAccount = async () => {
  try {
    const response = await instance.get('/account');
    tableData.value = response.data.data;
    console.log(tableData);
  } catch (error) {
    console.error('Error fetching account data:', error);
  }
};
相关推荐
DDDDDouble3 分钟前
<二>Sping-AI alibaba 入门-记忆聊天及持久化
java·人工智能
小赖同学啊4 分钟前
光伏园区3d系统管理
前端·javascript·3d
木叶丸11 分钟前
编程开发中,那些你必须掌握的基本概念
前端·数据结构·编程语言
前端进阶者12 分钟前
js通知提醒
前端·javascript
拖孩17 分钟前
微信群太多,管理麻烦?那试试接入AI助手吧~
前端·后端·微信
一切顺势而行21 分钟前
kafka总结
java
乌兰麦朵34 分钟前
Vue吹的颅内高潮,全靠选择性失明和 .value 的PUA!
前端·vue.js
Goodbaibaibai34 分钟前
创建一个简洁的Vue3 + TypeScript + Vite + Pinia + Vue Router项目
javascript·vue.js·typescript
Code季风34 分钟前
Gin Web 层集成 Viper 配置文件和 Zap 日志文件指南(下)
前端·微服务·架构·go·gin
蓝倾34 分钟前
如何使用API接口实现淘宝商品上下架监控?
前端·后端·api