Vue跨域请求问题解决方案过程解析


Posted in Javascript onAugust 07, 2020

一、这是我们本次要请求的url接口地址http://iwenwiki.com/api/blueberrypai/getBlueBerryJamInfo.php

Vue跨域请求问题解决方案过程解析

查看页面响应信息,提示跨域有问题

Vue跨域请求问题解决方案过程解析####

二、解决上面跨域问题:根目录写入以下vue.config.js

// vue.config.js

module.exports = {
 devServer: {
  proxy: {
   // 配置跨域
   '/api': {
    target: 'http://iwenwiki.com',
    ws: true,
    changOrigin: true,
    pathRewrite: {
     '^/api': ''
    }
   }
  }
 },
}

三、然后在发送ajax请求的地方做如下操作,使用在上面文件中配置的api。api/blueberrypai/getBlueBerryJamInfo.php是我的请求路径一部分,根据自己具体需求写。然后请求就可以成功发送。

Vue跨域请求问题解决方案过程解析

配置完成之后一定要重启(重点!!!)

Vue跨域请求问题解决方案过程解析####

四、如果想不填写其中“/api”,也可以去main.js中配置全局配置,具体如下

Vue跨域请求问题解决方案过程解析Vue跨域请求问题解决方案过程解析

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
读jQuery之八 包装事件对象
Jun 21 Javascript
javascript 使用 NodeList需要注意的问题
Mar 04 Javascript
angular.foreach 循环方法使用指南
Jan 06 Javascript
javascript跨域总结之window.name实现的跨域数据传输
Nov 01 Javascript
jQuery解决$符号命名冲突
Jun 18 Javascript
Angular.JS学习之依赖注入$injector详析
Oct 20 Javascript
AngularJS模仿Form表单提交的实现代码
Dec 08 Javascript
jquery实现放大镜简洁代码(推荐)
Jun 08 jQuery
使用vue-resource进行数据交互的实例
Sep 02 Javascript
ES6 javascript的异步操作实例详解
Oct 30 Javascript
微信小程序异步API为Promise简化异步编程的操作方法
Aug 14 Javascript
jquery轻量级数字动画插件countUp.js使用详解
Oct 17 jQuery
JQuery通过键盘控制键盘按下与松开触发事件
Aug 07 #jQuery
vue递归获取父元素的元素实例
Aug 07 #Javascript
在vue中使用Base64转码的案例
Aug 07 #Javascript
JavaScript代码模拟鼠标自动点击事件示例
Aug 07 #Javascript
使用JavaScript和MQTT开发物联网应用示例解析
Aug 07 #Javascript
vue-以文件流-blob-的形式-下载-导出文件操作
Aug 07 #Javascript
浅谈javascript如何获取文件后缀名
Aug 07 #Javascript
You might like
php 地区分类排序算法
2013/07/01 PHP
使用php显示搜索引擎来的关键词
2014/02/13 PHP
php+xml结合Ajax实现点赞功能完整实例
2015/01/30 PHP
php生成图片缩略图的方法
2015/04/07 PHP
PHP实现导出excel数据的类库用法示例
2016/10/15 PHP
搜索附近的人PHP实现代码
2018/02/11 PHP
javascripit实现密码强度检测代码分享
2013/12/12 Javascript
使用jquery局部刷新(jquery.load)从数据库取出数据
2014/01/22 Javascript
javascript获取浏览器类型和版本的方法(js获取浏览器版本)
2014/03/13 Javascript
2014 HTML5/CSS3热门动画特效TOP10
2014/12/07 Javascript
详解JavaScript中的4种类型识别方法
2015/09/14 Javascript
jQuery+CSS3实现3D立方体旋转效果
2015/11/10 Javascript
js判断输入字符串是否为空、空格、null的方法总结
2016/06/14 Javascript
JS定时器实现数值从0到10来回变化
2016/12/09 Javascript
详解angular2采用自定义指令(Directive)方式加载jquery插件
2017/02/09 Javascript
Webpack 服务器端代码打包的示例代码
2017/09/19 Javascript
基于vue实现滚动条滚动到指定位置对应位置数字进行tween特效
2019/04/18 Javascript
Vue开发之watch监听数组、对象、变量操作分析
2019/04/25 Javascript
ES6 let和const定义变量与常量的应用实例分析
2019/06/27 Javascript
详解vue-property-decorator使用手册
2019/07/29 Javascript
python实现的jpg格式图片修复代码
2015/04/21 Python
对Python3中的print函数以及与python2的对比分析
2018/05/02 Python
python机器学习之KNN分类算法
2018/08/29 Python
10分钟用python搭建一个超好用的CMDB系统
2019/07/17 Python
深入浅析Python科学计算库Scipy及安装步骤
2019/10/12 Python
python判断单向链表是否包括环,若包含则计算环入口的节点实例分析
2019/10/23 Python
H5新属性audio音频和video视频的控制详解(推荐)
2016/12/09 HTML / CSS
商场总经理岗位职责
2014/02/03 职场文书
会议室标语
2014/06/21 职场文书
企业标语大全
2014/07/01 职场文书
英文慰问信范文
2015/03/24 职场文书
车间主任岗位职责范本
2015/04/08 职场文书
保护校园环境倡议书
2015/04/28 职场文书
行政复议答复书
2015/07/01 职场文书
Golang 实现获取当前函数名称和文件行号等操作
2021/05/08 Golang
Golang中异常处理机制详解
2021/06/08 Golang