zoukankan      html  css  js  c++  java
  • webpack+vue-cli中代理配置(proxyTable)

    在做vue的项目时,用到webpack打包工具,我们会发现本地开发开启的node服务地址请求接口的地址存在跨域问题。本地开启的服务地址是

    http://localhost:8080

    而服务器的地址是

    http://192.168.28.92:9096/api/

    如果在你的axios请求中直接写服务器的地址进行请求,就会发生跨域的问题。如下

    这就需要webpack中的proxytable代理进行配置,来解决这个跨域的问题。

    在config/index.js文件中:

    dev: {
    
        // Paths
        assetsSubDirectory: 'static',
        assetsPublicPath: '/',
        proxyTable: {
          '/api':{
            target: 'http://192.168.28.92:9096',
         // secure: false,// 如果是https接口,需要配置这个参数 changeOrigin:
    true,//接口跨域,则需要进行这个参数配置
         //pathRewrite: {
         // '^api': '' //如果接口本身没有/api,则需要通过pathRewrite来重写
         //} } }, }

    当你的服务器接口地址是:

    http://120.79.61.208:36912/shop/

    此时接口地址中没有/api

    则需要通过pathRewrite对接口进行重写

    proxyTable: {
          '/api':{
            target: 'http://192.168.28.92:9096',
         // secure: false,// 如果是https接口,需要配置这个参数
            changeOrigin: true,//接口跨域,则需要进行这个参数配置
         pathRewrite: {
          '^api': '' //如果接口本身没有/api,则需要通过pathRewrite来重写
         }
          }

    则在axios请求中的url:

  • 相关阅读:
    jQuery before 和 after
    pm2常用的命令
    git 常见命令
    Number 和 parseInt 区别
    枚举创建单例模式 安全 而且利用反射也读不到
    spring 的数据库工具类 JDBCTemplate
    阿里druid数据库连接及配置文件
    java C3P0连接数据库
    JDBC利用.properties文件连接数据库
    JDBC工具类的使用
  • 原文地址:https://www.cnblogs.com/zengfp/p/9648031.html
Copyright © 2011-2022 走看看