解决前端调用后端接口返回200但数据返回的是html标签

 更新时间:2024年05月28日 10:52:44   作者:one shepherd  
这篇文章主要给大家介绍了关于如何解决前端调用后端接口返回200但数据返回的是html标签的相关资料,文中通过图文将解决的过程介绍的非常详细,对同样遇到这个问题的朋友具有一定的参考解决价值,需要的朋友可以参考下

这是一个前后端分离的项目,后端已经完成,后端在本地上,自动创建了数据库,前端为了完成一个注册功能,去调用后端的/registerUser接口,当输入用户名和密码的时候,我也查过csdn上其他博主的回答,但是并不能很清除的去解决我的问题,这边的bug是返回的虽然是 200 响应状态码,但是返回的数据是一串html,其实是发生了跨域问题,就是前端与后端使用的端口号不同产生的。

然后我再在axios文件夹 加上一个 baseURL ,可以进axios官网去找baseURL的配置,目的是为了便于axios实例的方法传递相对URL。

axios中文文档|axios中文网 | axios

然后我们再调用 后端的接口,然后出现了跨域的问题

然后我们应该去配置 vite.config.js中的代理。(下方是代理的官网)

开发服务器选项 | Vite 官方中文文档

然后去 vite 官网找到 配置-----服务器选项------server.proxy

复制到 vite.config.js文件中,把其中的target 改成自己后端的端口地址,也就是 刚刚设置baseURL 的地址

也需要把  baseURL 改成 '/api'

再次调用后端接口,成功解决前后端跨域问题,完成前后端接口联调

总结

到此这篇关于解决前端调用后端接口返回200但数据返回的是html标签的文章就介绍到这了,更多相关调用后端接口返回200但返回html标签内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家!

相关文章

  • vue验证码组件使用方法详解

    vue验证码组件使用方法详解

    这篇文章主要为大家详细介绍了vue验证码组件的使用方法,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2021-07-07
  • Vue使用xlsx模块实现读写Excel文档内容

    Vue使用xlsx模块实现读写Excel文档内容

    在前端项目开发中,读写Excel文件的需求变得越来越常见,本文将详细介绍如何在Vue项目中利用FileReader对象和xlsx模块来读取Excel文件的内容,需要的可以参考下
    2024-03-03
  • VUE正则表达式用法全集整理(推荐!)

    VUE正则表达式用法全集整理(推荐!)

    正则表达式是由一些特定的字符组成,代表一个规则,可以用来检验数据格式是否合法,也可以在一段文本中查找满足要求的内容,这篇文章主要给大家介绍了关于VUE正则表达式用法的相关资料,需要的朋友可以参考下
    2024-02-02
  • Vue项目中引入translate.js实现国际化自动翻译功能实例

    Vue项目中引入translate.js实现国际化自动翻译功能实例

    translate.js帮你一行代码搞定翻译,支持Google、DeepL、LibreTranslate等多个主流翻译引擎,Node.js和浏览器通用,这篇文章主要介绍了Vue项目中引入translate.js实现国际化自动翻译功能的相关资料,需要的朋友可以参考下
    2025-07-07
  • vue3如何定义变量及ref、reactive、toRefs特性说明

    vue3如何定义变量及ref、reactive、toRefs特性说明

    这篇文章主要介绍了vue3如何定义变量及ref、reactive、toRefs特性说明,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教
    2022-06-06
  • 在vue中import()语法不能传入变量的问题及解决

    在vue中import()语法不能传入变量的问题及解决

    这篇文章主要介绍了在vue中import()语法不能传入变量的问题及解决方案,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教
    2022-04-04
  • ruoyi-vue3 集成aj-captcha实现滑块、文字点选验证码功能

    ruoyi-vue3 集成aj-captcha实现滑块、文字点选验证码功能

    这篇文章主要介绍了 ruoyi-vue3 集成aj-captcha实现滑块、文字点选验证码,本文基于后端RuoYi-Vue 3.8.7 和 前端 RuoYi-Vue3 3.8.7,集成以AJ-Captcha文字点选验证码为例,不需要键盘手动输入,极大优化了传统验证码用户体验不佳的问题,感兴趣的朋友一起看看吧
    2023-12-12
  • Nuxt的动态路由和参数校验操作

    Nuxt的动态路由和参数校验操作

    这篇文章主要介绍了Nuxt的动态路由和参数校验操作,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
    2020-11-11
  • Vue cli+mui 区域滚动的实例代码

    Vue cli+mui 区域滚动的实例代码

    下面小编就为大家分享一篇Vue cli+mui 区域滚动的实例代码,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
    2018-01-01
  • Vue 实现前进刷新后退不刷新的效果

    Vue 实现前进刷新后退不刷新的效果

    这篇文章主要介绍了Vue 实现前进刷新后退不刷新的效果,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2019-06-06

最新评论