vuejs 解决跨域访问问题
首先:
config/index.js下面的proxyTable配置您的服务访问基本地址,将changeOrigin设置为true即可,然后在你需要访问接口的地方,这样使用,以下是我的工程代码(前提是你已经安装了vue-resource,安装方式是:
vue-resource 导入
还有elementui导入方法都是一样 这里就以vue-resource为例
npm
install
vue-resource --save
之后在需要导入的js中import还有use
import
VueResource from
'vue-resource'
Vue.use(VueResource)
// config/index.js module.exports = { // ... dev: { proxyTable: { // proxy all requests starting with /api to jsonplaceholder '/api': { target: 'http://jsonplaceholder.typicode.com', changeOrigin: true, pathRewrite: { '^/api': '' } } } }
}
/* eslint-disable */
<template>
<div class="hello" style="background: fuchsia">
<h1>您登陆{{ msg }}</h1>
<button v-on:click="showDetails">获取20服务器上接收所信息</button>
</div> </template> <script>
export default {
name: 'hello',
data () {
return {
msg: ''
}
},
methods: {
showDetails: function () {
this.$http.post('api/RMSClient/useradmin/login?password=d90b21c4a61992ff330bade33e84633d&userName=444').then(function (res) {
console.log(res) // 返回很多的数据,比如执行状态,url,data等等
console.log(res.data)// 返回的json数据
console.log(res.data.message)// json对象里面的信息
this.msg = res.data.message
})
}
}
}
</script>
vuejs 解决跨域访问问题的更多相关文章
- springboot 前后端分离开发解决跨域访问
最近新学习了Java EE开发框架springboot,我在使用springboot前后台分离开发的过程中遇到了跨域求问题.在网上寻找答案的过程中发现网上的解决方案大多比较零散,我在这里整理一个解决方 ...
- 用jQuery与JSONP轻松解决跨域访问的问题【转】
原文地址:http://www.jb51.net/article/46463.htm 好在,有jquery帮忙,跨域问题似乎没那么难缠了.这次也借此机会对跨域问题来给刨根问底,结合实际的开发项目,查阅 ...
- Axiso解决跨域访问(...XMLHttpRequest cannot load http://xxx.xxx No 'Access-Control-Allow-Origin'...)
直接访问如下:this.$axios.get("http://localhost:8089/yc/demo").then(res=>{ console.log(res) ...
- Axiso解决跨域访问
问题: 在项目中需要需要讲本地项目去请求一个URL接口获取数据 例如: 本地请求地址:http://127.0.0.1:19323/site/info.json 请求Url地址:http://www. ...
- 用jQuery与JSONP轻松解决跨域访问的问题
浏览器端的真正跨域访问,推荐的是目前jQuery $.ajax()支持get方式的跨域,这其实是采用jsonp的方式来完成的. var qsData = {'searchWord':$("# ...
- C# 和Jsonp的一个小demo 用jQuery与JSONP轻松解决跨域访问的问题
客服端: 在A项目下面 建立一个 JsonpClient.aspx页面,代码如下: <%@ Page Language="C#" AutoEventWireup=& ...
- spring boot 解决跨域访问
package com.newings.disaster.shelters.configuration; import org.springframework.context.annotation.B ...
- CORS解决跨域访问问题
简言之,CORS就是为了让AJAX可以实现可控的跨域访问而生的. Tomcat下的配置 下载cors-filter-1.7.jar,java-property-utils-1.9.jar [下载 ...
- 深入了解jsonp解决跨域访问
在这个项目中,我们做的充分利用jsonp这是一个特点跨界,完成简单的单点登录认证和权限控制的统一.道,各有各的优点.各有各的优点,选择什么方式实现全然取决于我们自己或者项目经理的开发经验,对各种框架的 ...
随机推荐
- push本地代码到github发生错误的解决办法
有一天,我在github上编写好了README.md这个文件,接着发现本地有段代码忘记上传了,于是熟练的输入git add . git commit -m "modify",以 ...
- Data truncation: Out of range value for column 'id' at row 1 ### The
org.springframework.dao.DataIntegrityViolationException: ### Error updating database. Cause: com.mys ...
- arcgis api for silverlight 3.1 更新说明
前言: 查看arcgis sl api 老版本帮助的方式:http://resources.arcgis.com/en/help/silverlight-api/3.0/xxxxxxx 新版本的帮助默 ...
- 记录code修改
package com.hesheng.myapplication; import android.content.Context;import android.graphics.Bitmap;imp ...
- Java—maven项目管理
Maven是基于项目对象模型(POM),可以通过一小段描述信息来管理项目的构建.报告和文档的软件项目管理工具. Maven环境搭建 http://maven.apache.org/download.c ...
- SiP封装成超越摩尔定律的要塞,日月光/安靠/长电科技谁将赢取IC封装的未来
来源:EEFOCUS 进入2017年,摩尔定律的脚步愈加沉重,"摩尔定律已死"的言论笼罩着整个半导体行业,超越摩尔定律发展的想法在半导体从业人员的脑海里更清晰了.在这样的大环境下, ...
- mysql中通过my.cnf设置默认字符集utf-8
选项配置 配置文件路径:/full/path/mysql/bin/my.cnf (默认为/etc/my.cnf ) [client] default-character-set=utf8 [mysql ...
- laravel5.5 自定义验证规则——手机验证RULE
相信很多小伙伴和我一样烦恼,laravel没有自带手机号的验证,每次验证手机号都要写正则这类的规则,每次都是repeat yourself!违背了编码的一个原则,就是Don't repeat your ...
- python 文件目录操作
在Python程序中执行目录和文件的操作 Python内置的os模块可以直接调用操作系统提供的接口函数 Python交互式命令行 >>> import os>>> ...
- GO语言(七)多核并行化的问题
package main import "fmt" type Vector []float64 func (v Vector) DoSome(i,n int, u Vector, ...