vue-admin-template 登录和跨域

软件发布|下载排行|最新软件

当前位置:首页IT学院IT技术

vue-admin-template 登录和跨域

CAFEBABE 34   2022-06-02 我要评论

一、下载安装项目

git地址:https://github.com/PanJiaChen/vue-admin-template.git

在这里插入图片描述

二、修改登录访问地址

找到 .env.develpment文件

# just a flag
ENV = 'development'

# base api
# VUE_APP_BASE_API = '/dev-api'
VUE_APP_BASE_API = 'http://localhost:9001'
port = 9528

设置自己的访问端口和启动端口。

找到登录页面 /src/views/login/index.vue

在这里插入图片描述

这里他会 去找到 /api/user/login

在这里插入图片描述

这里的url改成自己需要访问的页面

import request from '@/utils/request'

export function login(data) {
  return request({
    url: '/eduservice/user/login',
    method: 'post',
    data
  })
}

然后查看 @/utils/request 这个文件

在这里插入图片描述

在这里可以看到我们第一步配置的路径。

// create an axios instance
const service = axios.create({
  baseURL: process.env.VUE_APP_BASE_API, // url = base url + request url
  // withCredentials: true, // send cookies when cross-domain requests
  timeout: 5000 // request timeout
})

因为我使用了nginx做反向代理所以我访问的是 9001端口 这个可以根据自己的需要设置。

在这里插入图片描述

三、解决跨域问题

在需要访问的后端接口的controller类上加上注解即可
@CrossOrigin

在这里插入图片描述

Copyright 2022 版权所有 软件发布 访问手机版

声明:所有软件和文章来自软件开发商或者作者 如有异议 请与本站联系 联系我们