请求的接口信息: "image.png" (https://wmprod.oss-cn-shanghai.aliyuncs.com/images/20250112/84f3cd1ac0a11ea6c8f3b396f9ca3c2d.png) 没有返回东西: "image.png" (https://wmprod.oss-cn-shanghai.aliyuncs.com/images/20250112/c819d4f886fa55961a9bad4861c44060.png) 控制台报错: "image.png" (https://wmprod.oss-cn-shanghai.aliyuncs.com/images/20250112/068fbd186f9f50585d7d15da43ebe707.png) 前端代码: import axios from 'axios' import { baseURL, taskURL } from './resource' // 3.ES6 Promise 封装方式 export function request(options) { return new Promise((resolve, reject) => { // 1.创建 axios 的实例对象 const instance = axios.create({ baseURL: baseURL, // method:"post", timeout: 300000, withCredentials: true // timeout: 50000 }) // alert( baseURL) // 3.过滤器(拦截器) instance.interceptors.response.use(res => { return res.data }, err => { console.log('来到了response拦截failure中'); console.log('err', err); if (err && err.response) { switch (err.response.status) { case 400: err.message = '请求错误' break case 401: err.message = '未授权的访问' break } } return err }) // 2.通过实例发送网络请求 instance(options).then(res => { resolve(res) }).catch(err => { reject(err) }) }) } 求大家帮个忙看看到底是哪里问题,要怎么修改,谢谢
vue 3.0 +axios 跨域情况下无法携带cookie cooKie 是本地写入缓存的 axios已设置withCredentials=true; const $axios = axios.create({ baseURL: url, withCredentials: true, crossDomain: true }) // 发起跨域请求 $axios.get('/picture/upload', { headers: { 'Content-Type': 'application/json' } }).then(response => { console.log(response.data) }).catch(error => { console.error(error) }) 后端也加了 access-control-allow-credentials: true access-control-allow-origin: http://localhost:8080 发起请求时 查看请求头还是无法携带cookie
axios响应数据类型怎么定义? 相关代码 type TResponse = ? // 应该怎么定义 service.interceptors.response.use((response : TResponse) => { const res = response.data // 这个结构是固定的 {code:number;msg:string;data:T} if (res.code !== 0) { return Promise.reject(new Error(res.message || "Error")) } else { return res } }, (error) => { return Promise.reject(error) } ) // 这里code会报错 TS2339: Property code does not exist on type AxiosResponse getTableData(fileData).then(({ code, data }) => { if (code !== 0) return })
当前有个很纠结的问题,我想封装一个axios请求工具,想作为一个独立工具使用,但如果把loading组件(很多第三方UI组件库都有提供)封进去,这样就会破坏这个axios工具的独立性,因为你需要依赖某一个第三方UI组件库提供的loading组件,如果axios请求工具不提供loading功能,感觉有点封的不完整,请问大神们,你们到底如何解决的呢?麻烦指点下小白的我,谢谢
如何通过浏览器访问ipv6网络,axios 是否支持 ipv6 网络 希望使用axios访问ipv6请求
这是我的axios依赖: "axios": "^1.4.0", 这是我的代码 const source = axios.CancelToken.source(); data = { ...data, ...JSON.parse(localStorage.getItem('_TT_token')), cancelToken: source.token } const xhr = axios.post(url,data) // 如果xhrMap中存在该url请求,则执行取消操作 if (xhrMap[url]) { source.cancel('Operation canceled by the user.') } xhrMap[url] = xhr xhr.then( (response) => { resolve(response.data); }, (err) => { if (axios.isCancel(err)) { console.log('Request canceled:', err.message); } else { reject(err); } } ); 这段代码有什么问题么?请求并不会取消
多个axios请求怎么按顺序实现?我写的是哪里出问题了,打印的res值都是来自第一个post请求的返回结果,第二个get请求里的res值没有获取到? axios({ method: 'POST', url: 'https://openspeech.bytedance.com/api/v1/tts_async/submit', headers: { 'Content-Type': 'application/json', 'Resource-Id': 'volc.tts_async.default', 'Authorization': 'Bearer;CiWImuQXN_xzNTZ5YyC5r' }, data: { "appid": "5565218", "reqid": nanoid(30), "text": '这是一段测试文字!', "format": "wav", "voice_type": "BV705_streaming" } }).then(function (res) { console.log('post', res.data) return axios({ method: 'GET', headers: { 'Content-Type': 'application/json', 'Resource-Id': 'volc.tts_async.default', 'Authorization': 'Bearer;CiWI1f4XN_xzNTZ5YyC5r' }, url: `https://openspeech.bytedance.com/api/v1/tts_async/query?appid=5568&task_id=${res.data.task_id}` }) }).then(function (res) { console.log('get', res.data) }).catch(err => { console.log('get:err') }) 把第二个then放里面也是一样, axios({ method: 'POST', url: 'https://openspeech.bytedance.com/api/v1/tts_async/submit', headers: { 'Content-Type': 'application/json', 'Resource-Id': 'volc.tts_async.default', 'Authorization': 'Bearer;CiWImuQZhWXN_xzNTZ5YyC5r' }, data: { "appid": "556218", "reqid": nanoid(30), "text": '这是一段测试文字!', "format": "wav", "voice_type": "BV705_streaming" } }).then(function (res) { console.log('post', res.data) axios({ method: 'GET', headers: { 'Content-Type': 'application/json', 'Resource-Id': 'volc.tts_async.default', 'Authorization': 'Bearer;CiWImuQC1f4XN_xzNTZ5YyC5r' }, url: `https://openspeech.bytedance.com/api/v1/tts_async/query?appid=556218&task_id=${res.data.task_id}` }).then(function (res) { console.log('get', res.data) }) }).catch(function (err) { console.log(err) }) 前端新手,请多指教
axios 取消上一次重复请求如何封装?
nuxt.config.ts 中的 ssr 也是 true 自己写的后台接口 页面显是正常的,但是右键, 查看源代码后里面没有请求回来的数据呀! 这能 SEO ? 是哪里还需要配置下吗? nuxt.config.ts代码: export default defineNuxtConfig({ app: { head: { charset: 'utf-8', viewport: 'width=device-width, initial-scale=1', } }, devtools: {enabled: false}, //关闭遥测数据 telemetry: false, modules: ['@pinia/nuxt'], css: [ "@/assets/style/style.css" //配置使用的样式 ], ssr:true, }) 页面代码: 0"> {{row.title}} {{dateDisplay(row.created_at)}} 默认分类 {{row.views}} 阅读 评论 标签: {{tag}} 没有了 没有了 import {onMounted,ref} from "vue"; import {getArticleDetail} from "~/api/article"; import type {ApiResponse,ArticleItem} from "~/types/intreface"; import {dateDisplay} from "~/utils/date"; import {_length} from "~/utils"; import { useRoute } from '#app'; const route = useRoute(); const params = route.params; const id = ref(params.id); const loading = ref(false); const row = ref(); onMounted(async()=>{ await fetchData(); }) const fetchData = async()=>{ try { loading.value = true; const data:ApiResponse = await getArticleDetail({id:id.value}); if(data.code!==0){ return Promise.reject(data.message); } row.value = data.data as ArticleItem; if(_length(row.value.url)===0){ row.value.url = '/archives/'+row.value.slug; } useHead({ title: row.value.title, meta: [ { name: 'description', content: '我的神奇网站。' } ], bodyAttrs: { class: 'test' }, script: [ { innerHTML: 'console.log(\'Hello world\')' } ] }) }catch (e) { loading.value = false; } }
请问为什么我用vue3写项目的时候设置了接口的请求超时,在本地生效,上线后无效了?! 无论是在vue.config.js里配置还是直接在页面请求里添加timeout都失效.在开发环境下没问题,但是上线后这个设置就会失灵? devServer: { host: IP, proxy: { '/api': { target: 'http://10.10.1.90:8008/',//这里填入你要请求的接口的前缀 ws: true,//代理websocked changeOrigin: true,//虚拟的站点需要更管origin secure: true, //是否https接口 pathRewrite: { '^/api': ''//重写路径 }, timeout: 20 * 60 * 1000, // 设置超时 proxyTimeout: 20 * 60 * 1000, // 设置代理超时 }}} const axiosConfig = { headers: { "Content-Type": "application/json", }, timeout: 20 * 60 * 1000, // 设置超时为 20 分钟 }; // 发送 Axios 请求 axios .post( "/api/MappingExport", JSON.parse(str), axiosConfig ) .then((res) => { if (res.data) { This.loading("正在导入...", false); This.Bullet("成功", "导入成功", "success"); } else { This.loading("正在导入...", false); This.Bullet("失败", "数据格式出错", "error"); } }) 会不会随时后端的问题?但我询问后端,后端说他也设置了相应的请求超时.那问题是出现在服务器上?服务器有个检测api前缀然后代理转发的过程