Proxy配置跨域代理

327 阅读1分钟

### 最近在使用Macbookpro时,因为没有安装phpstudy等软件,所以做项目时就会产生跨域的问题,搜素了很多文章,视频,整理有效的解决方法,

  • 第一步 在vue.config.js中
    •  module.exports={
      
    •  //如果是使用的是vue 2的话devServer 换成 dev,前端单词一定要打对,很多时候都出在单词字母错误或者大小写上
      
    • devServer: {
    • proxy: {
      
    •   '/API': {    // 定义代理的名称
      
    •     changeOrigin: true,  // 是否启动代理
      
    •     // secure: false, 如果是https接口,需要配置这个参数
      
    •     //ws: true, 如果要代理 websockets,配置这个参数
      
    •     target: 'http://hmmm.itheima.net/#/logins', // 代理的域名
      
    •      pathRewrite: {'^/API','/'} // 如果你的真实的api路径中没有/API这一个路径,把这句加上,如果本来就有/API这一路径的话,这句一定要去掉,要不然会导致域名找不到的
    •   }
      
    • }
      
    }, 第二步: 在对应的请求基地址中配置 baseURL: 'hmmm.itheima.net/' 以为问题解决了吗?没有刚刚开始 1.去掉图上圈中内容

image.png

简洁代码如下 image.png

将baseUrl换成 baseURL: 'api/#/logins'

image.png 此时也不一定是百分百OK的 运行线上地址在多个页面间切换会发现

image.png

image.png 此时我们将代理地方换上hmmm-api.itheima.net/

重点在于要多跑几遍,你的对应部分不一定要加,也不一定是api,重点在与灵活多变

我是前端小白,关注我,我们一起学前端

天下事败与懒与私,只要有恒心,不怕迟的