最近在从0开始学习构建vue项目,偶尔记录笔记。首先我们知道跨域是浏览器为了安全而做出的限制策略,保证浏览器的请求只能遵循同源策略:同域名、同端口、同协议。常用的解决跨域问题的方法有CORS跨域、JSONP跨域、代理跨域等。其中CORS跨域只需要后端进行修改即可,但后端方面改动会略为麻烦;JSONP跨域的话前后端都需要修改,前端不仅要另外下载jsonp插件,并且不能使用axios来进行请求,后期修
转载
2024-01-29 15:55:39
125阅读
比如 我要请求的地址是
原创
2022-09-01 20:27:50
219阅读
config里面的index.js dev => proxyTable '/abc':{ target: 'http://localhost:8083', changeOrigin: true, //可由后端通过request.getHeader('Host')获取请求地址 pathRewrite: ...
转载
2021-08-12 16:22:00
376阅读
2评论
前言工作中用到了消息推送功能,之前了解过SOCKET 无意中了解到即时通讯框架SocketIO 简单说两句Socket.IO 是什么Socket.IO是一个库,基于 Node.js 的实时应用程序框架。可以在浏览器和服务器之间实现实时,双向和基于事件的通信。它适用于每个平台、浏览器或设备,同样注重可靠性和速度。Socket.IO 起源WebSocket 的产生源于 Web 开发中日益增长的实时通信
转载
2024-08-12 21:08:50
79阅读
一.什么是跨域 跨域问题的出现是因为浏览器的同源策略问题,所谓同源:就是两个页面具有相同的协议(protocol),主机(host)和端口号(port),它是浏览器最核心也是最基本的功能,如果没有同源策略我们的浏览器将会十分的不安全,随时都可能受到攻击。 当我们请求一个接口的时候,出现如:Acces ...
转载
2021-09-13 16:03:00
275阅读
2评论
跨域的含义 跨域的本质就是浏览器基于同源策略的一种安全手段。所谓同源就是必须有以下三个相同点:协议相同、主机相同、端口相同。如果其中有一项不同,即出现非同源请求,就会产生跨域。 跨域实际上是浏览器的限制,开发中使用 postman请求接口能够获得数据就印证了跨域是浏览器的限制这个问题。解决方法 一般前端中解决跨域问题的方法有 JSONP,CROS,Proxy等,这里我们主要讲解一下在 vue中常
转载
2023-08-21 13:45:15
14阅读
Vuejs由1.0更新到了2.0版本。HTTP请求官方也从推荐使用Vue-Resoure变为了
axios
。接下来我们来简单地用axios进行一下异步请求。(阅读本文作者默认读者具有使用npm命令的能力,以及具备ES6的能力,以及等等。。。) 首先我们来安装Vue-Cli开发模板(这个模板可以快速生成vuejs的运行配置环境,可以使新手快速免除配置搭建出运行界面),这里我使
转载
2024-08-30 16:44:33
41阅读
文章目录一、什么是Axios?1.前置知识2.vue中使用axios3.Axios两种请求方式①.调用接口②.传入对象3.Axios支持的请求类型①.get请求②.post请求③.put请求④.patch请求⑤.delete请求二、跨域问题解决方案1.什么是跨域问题?2.解决方案一:在Vue中进行配置3.解决方案二:使用Nginx转发4.解决方案三:后端配合三、项目中对Axios对象进行封装1.
转载
2024-07-17 13:29:37
691阅读
1.安装安装命令:cnpm install axios --save。2.配置在项目src目录中新建axios/index.js文件,用以专门抽取配置axios。 axios/index.jsimport axios from 'axios';
// axios 配置
var instance = axios.create({
headers:{
post:{'Content-Typ
转载
2023-08-31 20:03:01
167阅读
Vue项目配置代理 前端向服务器发送请求时,经常会遇到跨域问题,那么什么是前端跨域呢?在vue项目中如何利用代理解决呢?1. 这里以axios发请求为例axios.get("/abc/def");
axios.get("/abc/ghi");
axios.post("/abc/jkm");axios发送的请求是本地的服务器地址拼接上发送的请求,如 http://localhost:808
转载
2023-08-23 20:42:25
537阅读
跨域问题网上搜索很多,感觉情况都不一样,我这里说说我遇到得问题,记录下。先说说上传吧,我使用element框架,刚开始以为简单得使用<el-upload>就行了,其实这个别人封装好的,但你上传的时候还需要一个接收用的服务,这个文件接收的服务是同事用C#写的,我就不过多阐述。我所了解得跨域就是两个,要么后端修改,要么前端修改,我看都是需要修改的,改需要根据具体情况修改。问题抛出我们上传文
转载
2024-01-07 12:56:24
100阅读
vue项目中,前端与后台进行数据请求或者提交的时候,如果后台没有设置跨域,前端本地调试代码的时候就会报“No 'Access-Control-Allow-Origin' header is present on the requested resource.” 这种跨域错误。要想本地正常的调试,解决的办法有三个:一、关闭谷歌浏览器的同源策略,这样就不存在跨域问题了。 window新建一个 chr
转载
2023-12-06 21:08:55
195阅读
一、为什么会出现跨域的问题?跨域:浏览器从一个域名的网页去请求另一个域名的资源时,域名、端口、协议任一不同,都是跨域。 在前后端分离的模式下,前后端的域名是不一致的,此时就会发生跨域访问问题。跨域问题来源于JavaScript的同源策略,即只有 协议+主机名+端口号(如存在)相同,则允许相互访问。也就是说JavaScript只能访问和操作自己域下的资源,不能访问和操作其他域下的资源。跨域问题是针对
转载
2023-10-30 17:22:59
5阅读
最近在项目中需要用到axios,所以就恶补一下这个axios到底是什么东东。越来它是vue-resource的替代品,官网也说了,以后都用axios,vue-resource不在维护。那么这个axios怎么用呢,上网搜索了一大堆,基本上都是雷同,我也不知道那些作者有没有在本地测试过。至少我按照网上的做法,总不能成功。经过几天的奋斗,我终于把它搞清楚了,为了不让其他的小伙伴们走弯路,我把
转载
2023-07-04 02:19:16
255阅读
1、跨域 是因为浏览器的同源策略引起的,是浏览器加的安全限制 -- 所以我们需要去解决这个问题同源策略 拥有相同的协议、域名、端口号的网址间才可以相互访问资源。 解决跨域问题方法 &
转载
2023-08-31 19:32:38
322阅读
跨域是什么跨域本质是浏览器基于同源策略的一种安全手段同源策略(Sameoriginpolicy),是一种约定,它是浏览器最核心也最基本的安全功能所谓同源(即指在同一个域)具有以下三个相同点 ● 协议相同(protocol) ● 主机相同(host) ● 端口相同(port)反之非同源请求,也就是协议、端口、主机其中一项不相同的时候,这时候就会产生跨域一定要注意跨域是浏览器的限制,你用抓包工具抓取接
转载
2023-11-03 14:16:33
25阅读
目录一、使用axios发送ajax请求1、在项目工程根目录中安装全局axios2、在App组件中发送ajax请求二、使用vue脚手架配置代理服务器解决【跨域问题】1、配置【单个】proxy(方法一)2、配置【多个】proxy(方法二)总结 一、使用axios发送ajax请求1、在项目工程根目录中安装全局axiosnpm i axios -g2、在App组件中发送ajax请求在浏览器控制台中查看即
转载
2023-07-04 02:18:09
174阅读
在 Vue.js 开发过程中,跨域问题通常出现在前端请求 API 时,因浏览器的 同源策略(Same-Origin Policy)而受到限制。跨域问题会导致浏览器阻止前端应用访问与其域名不同的服务器资源。这是因为同源策略要求,只有当网页与资源共享相同的协议、域名和端口时,才允许访问。为什么会跨域?跨域问题发生的原因是浏览器的 同源策略,它是为了 安全性 考虑,防止恶意网站通过 JavaScript
  ![](https://
原创
2021-07-13 16:56:30
435阅读
1、配置vue.config.js devServer: { port: port, // open: true, overlay: { warnings: false, errors: true }, proxy: { '/api': { target: '://xx.xx.xxx.xx: ...
转载
2021-07-19 16:21:00
615阅读