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

这篇具有很好参考价值的文章主要介绍了前端调用后端接口,返回200,但是数据返回的是html标签。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

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

前端网络响应是一堆html是为什么,前端,java,spring,spring boot,elementui,html,npm

前端网络响应是一堆html是为什么,前端,java,spring,spring boot,elementui,html,npm然后我再在axios文件夹 加上一个 baseURL ,可以进axios官网去找baseURL的配置,目的是为了便于axios实例的方法传递相对URL。

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

前端网络响应是一堆html是为什么,前端,java,spring,spring boot,elementui,html,npm

前端网络响应是一堆html是为什么,前端,java,spring,spring boot,elementui,html,npm

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

前端网络响应是一堆html是为什么,前端,java,spring,spring boot,elementui,html,npm

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

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

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

前端网络响应是一堆html是为什么,前端,java,spring,spring boot,elementui,html,npm

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

前端网络响应是一堆html是为什么,前端,java,spring,spring boot,elementui,html,npm

也需要把  baseURL 改成 '/api'

前端网络响应是一堆html是为什么,前端,java,spring,spring boot,elementui,html,npm

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

前端网络响应是一堆html是为什么,前端,java,spring,spring boot,elementui,html,npm文章来源地址https://www.toymoban.com/news/detail-842279.html

到了这里,关于前端调用后端接口,返回200,但是数据返回的是html标签的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

  • vite跨域配置踩坑,postman链接后端接口正常,但是前端就是不能正常访问

    根据以下配置,发现怎么都链接不了后端地址,proxy对了呀。 仔细看,才发现host有问题  这里是本地前端访问地址配置,不设置默认http://127.0.0.1:5173/都可以访问,但是如果设置了只有设置的 http://127.0.0.1:80/或者http://localhost:80/可以访问 问题来了:设置为port80,host:0,0,0,0或者

    2024年02月08日
    浏览(47)
  • 后端接口返回文件流格式、前端如何实现文件下载导出呢?

    在项目开发过程中,难免会需要实现文件下载功能,记录下自己实际开发过程过程中遇到两种实现的方式。一种:后端直接返回加密url ,前端解密后直接使用 a标签下载就可以,这种方法相等比较简单,另一种:后端接口直接返回文件流,这种方式前端就需要单独封装对应的

    2024年02月16日
    浏览(47)
  • 前端打开后端返回的HTML格式的数据

    前端打开后端返回的 HTML格式 的数据: 注:如果后端返回的是一个网址则不使用这个方式,可以使用 iframe / 标签 在本地打开返回的网址:示例如下: iframe /  具体使用请参考

    2024年02月12日
    浏览(45)
  • 前端渲染后端返回的HTML格式的数据

    在日常开发中,经常有需要前端渲染后端返回页面的需求,对于不同数据结构,前端的渲染方式也不尽相同,本文旨在对各种情况进行总结。 数据包含html标签等元素,数据类型如下图: 前端通过 js 方式处理 前端需要渲染网址中的页面,可通过iframe实现: 数据包含部分标签

    2024年02月08日
    浏览(54)
  • 后端接口返回文件流,前端实现docx/pdf/excel等类型文件的导出功能

    最近遇到一个需求,在后端返回文件流后前端需要实现导出docx类型的文件。在网上查看了一些资料总结了两种比较常用的方法。 1、封装接口 注意:接口需要添加 responseType: “blob”,否则会出现文件下载后无法打开或者损坏的情况。 2、转换数据格式 导出word文件,需要在创

    2024年01月21日
    浏览(45)
  • 前端实现vue3使用axios调用后端接口

    作用是: 抛出基础请求方式、基础前缀、请求头信息、参数、超时时间、凭证、后端接口返回数据类型! 作用是:使用请求拦截器和响应拦截器解决下边的问题 从浏览器中创建 XMLHttpRequests 从 node.js 创建 http 请求 支持 Promise API 拦截请求和响应 转换请求数据和响应数据 取消

    2024年01月20日
    浏览(43)
  • vue前端如何去掉后端接口返回的一个字段中时间里面的时分秒 只需要年月日

    在 Vue 前端中,可以使用 JavaScript 中的 Date 对象来处理日期。对于从后端接口返回的日期字符串,可以先将其转换为 Date 对象,然后再使用 getFullYear()、getMonth()、getDate() 等方法获取年月日等信息 。 以下是一个示例函数,它接受一个日期字符串作为参数,并返回 YYYY-MM-DD 格式

    2024年02月14日
    浏览(49)
  • 前端调用后端接口,导出excel文件打开显示[object object]

      没有错误提示,输出也正常 一直是这样的,我也找了网上的十几个相同案例,但是都不能解决这个问题 后端传的代码: 未解决前的前端代码: 解决后端前端代码:  解决后:

    2024年04月15日
    浏览(38)
  • 关于前端如何下载后端接口返回content-type为application/octet-stream的文件

    后端接口定义为直接返回一个文件,如果带认证信息可以直接通过浏览器url下载,但是接口需要传headers认证信息,url上又不支持传相关信息 前端正常请求接口,设置responseType值为blob,这样取到接口返回的数据为Blob类型,之后通过由blob数据创建一个指向类型数组的URL来完成

    2024年02月03日
    浏览(51)
  • 后端返回可下载的xlsx文件,但是前端接收下载后为乱码

    我的接收数据进行处理的代码为: 确实可以下载下来,但是打开后为乱码。 解决办法: 后端传的是blob类型文件,所以前端接收时也要限制一下类型, 接收的请求代码配置为: 之后再下载就可以正确显示啦

    2024年02月12日
    浏览(48)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包