vue 跨域访问http
axios用法:
npm install axios --save-dev
2.导入:
import axios from 'axios';
3.使用($(form)需要先按装jQuery)
axios.post('http://localhost:3000/users/zhuce',$(form).serialize())
.then(function(res){
console.log(res);
alert(res.data);
})
.catch(function(err){
console.log(err);
})
4.$(form)需要先按装jQuery
npm install jquery --save-dev
5.到build/webpack.base.conf.js中,
导入:var webpack = require('webpack');
最下面添加:
plugins: [
new webpack.ProvidePlugin({
$:"jquery",
jQuery:"jquery",
"window.jQuery":"jquery"
})
]
vue文件中无需导入,可直接使用$和jQuery
1.安装
npm install vue-resource --save-dev
2.main.js中
Vue.use(require('vue-resource')); //--------添加
3.vue中使用
callKa:function(event){
this.$http.get('http://localhost:3000/',{}).then(function(data){
alert(data.body);
}).catch(function(err){
alert('出错');
for(let key in err){
console.log(key+':'+err[key]);
}
})
}
vue 跨域访问http的更多相关文章
- vue跨域访问
第一次创建vue项目,画完静态页面一切顺利,准备和后台进行联调,问题来了,无论怎么调试使用Axios,jQuary还是使用原生的Ajax请求都访问不通(前提条件,另外一个人的电脑当成服务器,进行访问) ...
- Vue跨域访问,axios&cors
先安装node.js和npm,这个不用说了,直接在创建vue项目,然后实践一下跨域访问. 如果npm安装较慢,可安装淘宝镜像,执行下面命令: npm install -g cnpm --registr ...
- .net core webapi+vue 跨域访问
最近在做一个前后端分离的示例,以下代码完美解决跨域的问题 一.后端服务 1.首先我们建一个.net core webapi的项目 2.项目引用Microsoft.AspNetCore.Cors 包 3 ...
- nginx部署VUE跨域访问api
H5端配置跨域 nginx跨域配置 server { listen 80; charset utf-8; server_name you_dome_name;#location /tasklist.j ...
- vue + vue-resource 跨域访问
使用vue + vue-resource进行数据提交,后台使用RESTful API的方式存取数据,搞了一天,终于把后台搞好了.进行联合调试时,数据不能提交,报403错误: XMLHttpReques ...
- Vue用axios跨域访问数据
Vue用axios跨域访问数据axios是vue-resource的替代品,vue-resource不再维护.安装axios:npm install axios使用vue-cli开发时,由于项目本身启 ...
- vue ui九宫格、底部导航、新闻列表、跨域访问
一. 九宫格 九宫格:在mint-ui组件库基于vue框架 mui不是基于vue框架 只是css/js文件 (1)官方网站下载安装包 (2)copy css js fonts[字体图标] src/l ...
- 解决vue+springboot前后端分离项目,前端跨域访问sessionID不一致导致的session为null问题
问题: 前端跨域访问后端接口, 在浏览器的安全策略下默认是不携带cookie的, 所以每次请求都开启了一次新的会话. 在后台打印sessionID我们会发现, 每次请求的sessionID都是不同的, ...
- Vue开发环境跨域访问
Vue开发环境跨域访问其他服务器或者本机其他端口,需要配置项目中config/index.js文件,修改如下 module.exports = { dev: { // Paths assetsSubD ...
随机推荐
- ZeroClipboard 简单应用
ZeroClipboard.config({ swfPath: "/scripts/ZeroClipboard.swf" }); var client = new ZeroClip ...
- java调接口
package util; import java.io.BufferedReader; import java.io.DataOutputStream; import java.io.InputSt ...
- git教程4-创建分支与删除分支
一.分支的理解 分支,即branch,用于从主分支(master)中新开辟出一个分支,用于对文件进行修改.这部分修改的内容在新的分支未融合到主分支的情况下,主分支是看不见的.新的分支相当于开辟了新的修 ...
- 深入探索C++对象模型 读书笔记
第1章 关于对象 1.C++在布局以及存取时间上的主要的额外负担是由virtual引起的,包括: a.virtual function机制,引入vptr以及vtbl,支持一个有效率的"执行期 ...
- [转]C++ 智能指针详解
转自:http://blog.csdn.net/xt_xiaotian/article/details/5714477 C++ 智能指针详解 一.简介 由于 C++ 语言没有自动内存回收机制,程序员每 ...
- mysql-jdbc创建connection理解
jdbc源码分析(http://blog.csdn.net/brilliancezhou/article/details/5499738) 创建JDBC连接代码 Class.forName(" ...
- 19年博客flag
目录 为什么没有年终总结 为什么今天更新了 19年博客flag 个人博客链接:我在马路边 https://hhongwen.cn 更好的阅读体验点击查看原文:19年博客flag 原创博客,转载请注明出 ...
- Oracle 存储过程_(收集)
oracle 存储过程的基本语法 1.基本结构 CREATE OR REPLACE PROCEDURE 存储过程名字( 参数1 IN NUMBER, 参数2 IN NUMBER) IS变量 ...
- 使用Jsonp实现跨域请求
来自百度百科的一段话: JSONP(JSON with Padding)是JSON的一种“使用模式”,可用于解决主流浏览器的跨域数据访问的问题.由于同源策略,一般来说位于 server1.exampl ...
- 媒体查询ipad,pc端
媒体查询 /* 判断ipad */ @media only screen and (min-device-width : 768px) and (max-device-width : 1024px){ ...