跨域问题解决

明梦爽

2021-11-10 88589c5cb3db76197fd0748152c84b87c671a5d9

跨域问题解决

 src/components/Login.vue

@@ -44,8 +44,8 @@
    return {
      // 这是登录表单的数据绑定对象
      loginForm: {
        account: 'admin',
        password: '123456'
        account: '181360226',
        password: 'pyb***20000112'
      },
      // 这是表单的验证规则对象
      loginFormRules: {
@@ -80,9 +80,9 @@
    login() {
      this.$refs.loginFormRef.validate(async (valid) => {
        if (!valid) return
        const { data: res } = await this.$http.post('/login', this.loginForm)
        // console.log(res)
        if (res.meta.status !== 200) return this.$message.error('登录失败！')
        const { data: res } = await this.$http.post('login', this.loginForm)
        console.log(res)
        if (res.code !== 200) return this.$message.error('登录失败！')
        this.$message.success('登录成功')
        // console.log(res)
        // 1. 将登录成功之后的 token，保存到客户端的 session Storage 中

 src/main.js

@@ -10,9 +10,9 @@

import axios from 'axios'
// 配置请求的跟路径
axios.defaults.baseURL = 'http://10.2.41.131:8080'
axios.defaults.baseURL = 'http://10.2.33.200:8081'
axios.interceptors.request.use(config => {
  console.log(config)
  // console.log(config)
  config.headers.Authorization = window.sessionStorage.getItem('token')
  return config
})

 src/router.js

@@ -21,7 +21,7 @@

const router = new Router({
  routes: [
    { path: '/', redirect: '/home' },
    { path: '/', redirect: '/login' },
    { path: '/login', component: Login },
    { 
      path: '/home', 

 vue.config.js

New file
@@ -0,0 +1,17 @@
const webpack = require('webpack');
module.exports = {
  configureWebpack: {
    devServer: {
      proxy: {
        '/api': {
          target: 'http://10.2.33.200',
          changeOrigin: true,
          ws:true,
          pathRewrite: {
            '^/api':'/'
          }
        }
      }
    }
  }
}