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 相关文章推荐
window.location和document.location的区别分析
Dec 23 Javascript
JQuery困惑—包装集 DOM节点
Oct 16 Javascript
javascript dom代码应用 简单的相册[firefox only]
Jun 12 Javascript
Javascript Web Slider 焦点图示例源码
Oct 10 Javascript
javascript中bind函数的作用实例介绍
Sep 28 Javascript
嵌入式iframe子页面与父页面js通信的方法
Jan 20 Javascript
javascript实现动态加载CSS
Jan 26 Javascript
Javascript中数组方法汇总(推荐)
Apr 01 Javascript
JavaScript中实现map功能代码分享
Jun 11 Javascript
js实现截图保存图片功能的代码示例
Feb 16 Javascript
JavaScript实现自动跳转文本功能
May 25 Javascript
vue+axios全局添加请求头和参数操作
Jul 24 Javascript
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 判断访客是否为搜索引擎蜘蛛的函数代码
2011/07/29 PHP
php基础教程
2015/08/26 PHP
CI框架简单分页类用法示例
2020/06/06 PHP
PHP如何使用cURL实现Get和Post请求
2020/07/11 PHP
dess中一个简单的多路委托的实现
2010/07/20 Javascript
一个简单的js动画效果代码
2010/07/20 Javascript
js中关于String对象的replace使用详解
2011/05/24 Javascript
JS中使用Array函数shift和pop创建可忽略参数的例子
2014/05/28 Javascript
JavaScript中getUTCSeconds()方法的使用详解
2015/06/11 Javascript
JavaScript动态生成二维码图片
2016/04/20 Javascript
使用vue.js实现联动效果的示例代码
2017/01/10 Javascript
Bootstarp 基础教程之表单部分实例代码
2017/02/03 Javascript
基于input动态模糊查询的实现方法
2017/12/12 Javascript
深入浅析JSONAPI在PHP中的应用
2017/12/24 Javascript
JS简单数组排序操作示例【sort方法】
2019/05/17 Javascript
使用vue实现HTML页面生成图片的方法
2020/03/12 Javascript
Element Collapse 折叠面板的使用方法
2020/07/26 Javascript
Vue解决echart在element的tab切换时显示不正确问题
2020/08/03 Javascript
[00:32]2018DOTA2亚洲邀请赛OpTic出场
2018/04/03 DOTA
Python中的自定义函数学习笔记
2014/09/23 Python
深入理解python中的atexit模块
2017/03/07 Python
Django使用httpresponse返回用户头像实例代码
2018/01/26 Python
python 字符串的驻留机制及优缺点
2020/06/19 Python
Django路由层URLconf作用及原理解析
2020/09/24 Python
使用python-cv2实现Harr+Adaboost人脸识别的示例
2020/10/27 Python
python3 os进行嵌套操作的实例讲解
2020/11/19 Python
HQhair美国/加拿大:英国化妆品、美容及美发产品商城
2019/04/15 全球购物
家长会演讲稿范文
2014/01/10 职场文书
工商治理实习生的自我评价分享
2014/02/20 职场文书
基层党组织公开承诺书
2014/03/28 职场文书
人事行政经理岗位职责
2014/06/18 职场文书
日语专业求职信
2014/07/04 职场文书
员工趣味活动方案
2014/08/27 职场文书
全国法院系统开展党的群众路线教育实践活动综述(全文)
2014/10/25 职场文书
go语言基础 seek光标位置os包的使用
2021/05/09 Golang
使用Python拟合函数曲线
2022/04/14 Python