跨域问题解决

No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:11000' is therefore not allowed access.

原因：浏览器的同源策略不允许跨域访问，所谓同源策略是指协议、域名、端口相同。

解决：采用proxyTable解决。

proxyTable是什么？

vue-cli提供的解决vue开发环境下跨域问题的方法，proxyTable的底层使用了http-proxy-middleware（https://github.com/chimurai/http-proxy-middleware），它是http代理中间件，它依赖node.js，基本原理是用服务端代理解决浏览器跨域。

cms跨域解决原理：

1、访问页面http://localhost:11000/

2、页面请求http://localhost:11000/cms

由于url由http://localhost:31001/cms...改为“http://localhost:11000/cms."，所以不存在跨域

3、通过proxyTable由node服务器代理请求 http://localhost:31001/cms.

服务端不存在跨域问题

具体的配置如下：

1）修改api方法中url的定义

请求前加/api前缀

//public是对axios的工具类封装，定义了http请求方法

import http from './../../../base/api/public'

let sysConfig = require('@/../config/sysConfig')

let apiUrl = sysConfig.xcApiUrlPre;

export const page_list = (page,size,params) => {

  return http.requestQuickGet(apiUrl+'/cms/page/list/'+page+'/'+size)

}

2）在config/index.js下配置proxyTable。

以/api/cms开头的请求，代理请求http://localhost:31001

   '/api/cms': {

        target: 'http://localhost:31001',

        pathRewrite: {

          '^/api': ''//实际请求去掉/api

        }

希望帮助到有需要的小伙伴，我是小白，求关注求辅助。