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的更多相关文章

  1. vue跨域访问

    第一次创建vue项目,画完静态页面一切顺利,准备和后台进行联调,问题来了,无论怎么调试使用Axios,jQuary还是使用原生的Ajax请求都访问不通(前提条件,另外一个人的电脑当成服务器,进行访问) ...

  2. Vue跨域访问,axios&cors

    先安装node.js和npm,这个不用说了,直接在创建vue项目,然后实践一下跨域访问. 如果npm安装较慢,可安装淘宝镜像,执行下面命令: npm install -g cnpm --registr ...

  3. .net core webapi+vue 跨域访问

    最近在做一个前后端分离的示例,以下代码完美解决跨域的问题 一.后端服务 1.首先我们建一个.net core webapi的项目 2.项目引用Microsoft.AspNetCore.Cors 包 3 ...

  4. nginx部署VUE跨域访问api

    H5端配置跨域 nginx跨域配置 server { listen 80; charset utf-8; server_name you_dome_name;#location /tasklist.j ...

  5. vue + vue-resource 跨域访问

    使用vue + vue-resource进行数据提交,后台使用RESTful API的方式存取数据,搞了一天,终于把后台搞好了.进行联合调试时,数据不能提交,报403错误: XMLHttpReques ...

  6. Vue用axios跨域访问数据

    Vue用axios跨域访问数据axios是vue-resource的替代品,vue-resource不再维护.安装axios:npm install axios使用vue-cli开发时,由于项目本身启 ...

  7. vue ui九宫格、底部导航、新闻列表、跨域访问

    一.  九宫格 九宫格:在mint-ui组件库基于vue框架 mui不是基于vue框架 只是css/js文件 (1)官方网站下载安装包 (2)copy css js fonts[字体图标] src/l ...

  8. 解决vue+springboot前后端分离项目,前端跨域访问sessionID不一致导致的session为null问题

    问题: 前端跨域访问后端接口, 在浏览器的安全策略下默认是不携带cookie的, 所以每次请求都开启了一次新的会话. 在后台打印sessionID我们会发现, 每次请求的sessionID都是不同的, ...

  9. Vue开发环境跨域访问

    Vue开发环境跨域访问其他服务器或者本机其他端口,需要配置项目中config/index.js文件,修改如下 module.exports = { dev: { // Paths assetsSubD ...

随机推荐

  1. ZeroClipboard 简单应用

    ZeroClipboard.config({ swfPath: "/scripts/ZeroClipboard.swf" }); var client = new ZeroClip ...

  2. java调接口

    package util; import java.io.BufferedReader; import java.io.DataOutputStream; import java.io.InputSt ...

  3. git教程4-创建分支与删除分支

    一.分支的理解 分支,即branch,用于从主分支(master)中新开辟出一个分支,用于对文件进行修改.这部分修改的内容在新的分支未融合到主分支的情况下,主分支是看不见的.新的分支相当于开辟了新的修 ...

  4. 深入探索C++对象模型 读书笔记

    第1章 关于对象 1.C++在布局以及存取时间上的主要的额外负担是由virtual引起的,包括: a.virtual function机制,引入vptr以及vtbl,支持一个有效率的"执行期 ...

  5. [转]C++ 智能指针详解

    转自:http://blog.csdn.net/xt_xiaotian/article/details/5714477 C++ 智能指针详解 一.简介 由于 C++ 语言没有自动内存回收机制,程序员每 ...

  6. mysql-jdbc创建connection理解

    jdbc源码分析(http://blog.csdn.net/brilliancezhou/article/details/5499738) 创建JDBC连接代码 Class.forName(" ...

  7. 19年博客flag

    目录 为什么没有年终总结 为什么今天更新了 19年博客flag 个人博客链接:我在马路边 https://hhongwen.cn 更好的阅读体验点击查看原文:19年博客flag 原创博客,转载请注明出 ...

  8. Oracle 存储过程_(收集)

    oracle 存储过程的基本语法 1.基本结构 CREATE OR REPLACE PROCEDURE 存储过程名字(    参数1 IN NUMBER,    参数2 IN NUMBER) IS变量 ...

  9. 使用Jsonp实现跨域请求

    来自百度百科的一段话: JSONP(JSON with Padding)是JSON的一种“使用模式”,可用于解决主流浏览器的跨域数据访问的问题.由于同源策略,一般来说位于 server1.exampl ...

  10. 媒体查询ipad,pc端

    媒体查询 /* 判断ipad */ @media only screen and (min-device-width : 768px) and (max-device-width : 1024px){ ...