zoukankan      html  css  js  c++  java
  • vue axios 跨域

    qs是一个npm仓库所管理的包,可通过npm install qs命令进行安装. 
    1. qs.parse()将URL解析成对象的形式

    2. qs.stringify()将对象 序列化成URL的形式,以&进行拼接

                var params = {
                        categoryId: this.value,
                        startTime: this.Date2Str(new Date(this.value4[0]), "yyyy MM dd hh:mm:ss"),
                        endTime: this.Date2Str(new Date(this.value4[1]), "yyyy MM dd hh:mm:ss"),
                        actionCount: this.inputAccount,
                        actionDesc: this.textarea3,
                        actionPrice: this.inputPrice,
                        state: this.value3 ? 1 : 0,
                        //actionImg: this.actionImg,
                        currentNum: this.currentNum,
                        successNum: this.successNum,
                        actionCreateTime: this.Date2Str(new Date(), "yyyy MM dd hh:mm:ss")   
                }
                console.log(params);
                this.axios.post('http://192.168.2.88:8080/lbsSharing/action/addAction', qs.stringify(params)).then(function (response) {
                    that.$router.push({path: '/activeList'})
                }).catch(function (response) {
                    console.log(response);
                }); 
    在axios-cross 项目中安装http-proxy-middleware中间件作为代理
      npm install -S http-proxy-middleware
    为http-proxy-middleware这个中间件进行本地代理配置,在axios-cross 项目中找到config/index.js
    'use strict'
    // Template version: 1.2.6
    // see http://vuejs-templates.github.io/webpack for documentation.
    
    const path = require('path')
    
    module.exports = {
      dev: {
    
        // Paths
        assetsSubDirectory: 'static',
        assetsPublicPath: '/',
        proxyTable: { // 在这里配置如下代码
            '/api': {
                target:'http://api.jisuapi.com/XXXXX', // 你请求的第三方接口
                changeOrigin:true, // 在本地会创建一个虚拟服务端,然后发送请求的数据,并同时接收请求的数据,这样服务端和服务端进行数据的交互就不会有跨域问题
                pathRewrite:{  // 路径重写,
                    '^/api': '/api'  // 替换target中的请求地址,也就是说以后你在请求http://api.jisuapi.com/XXXXX这个地址的时候直接写成/api即可。
                }
            }
        },
     jsonpData: function() {
                        var url = '/api'; // 这里就是刚才的config/index.js中的/api
                        this.$axios.get(url)
                            .then(function(response) {
                                console.log(response);
                            })
                            .catch(function(error) {
                                console.log(error);
                            });
                            // 或者使用以下代码也可
                            /*this.$axios({
                                method: "get",
                                url: url,
                                data: {
                                    name: "axios",
                                    id: "1"
                                }
                            })
                            .then(function(res) {
                               console.log(res);
                           })
                            .catch(function(err) {
                               console.log(err);
                           });*/
    
        }
  • 相关阅读:
    Java实现二叉排序树
    servlet/filter/listener/interceptor区别与联系
    Java中创建对象的5种方式
    字符串练习
    成员变量、类变量、局部变量的区别
    强制清除gradle 缓存
    XML
    jQuery
    JavaScript
    CSS
  • 原文地址:https://www.cnblogs.com/hzx-5/p/9475549.html
Copyright © 2011-2022 走看看