权限相关，个人自己参考

最新推荐文章于 2022-06-15 22:21:15 发布
最新推荐文章于 2022-06-15 22:21:15 发布
阅读量346 收藏
点赞数
分类专栏： 私人专栏 文章标签： vue
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_44684668/article/details/110099709
版权

文章目录

前端

request axios 的拦截器
// 封装axios
import axios from 'axios'

import {Message, MessageBox} from 'element-ui'

// 创建一个axios对象
const instance = axios.create();

instance.defaults.baseURL = 'http://localhost:8080';
instance.defaults.headers.post['Content-Type'] = 'application/x-www-form-urlencoded';
// instance.defaults.withCredentials = true;
// 配置拦截器
instance.interceptors.request.use(function (config) {
      // 在发送请求之前做些什么
      config.headers['token'] = window.sessionStorage.getItem('token')
      return config;
    },
    function (error) {
      // 对请求错误做些什么
      return Promise.reject(error);
    }
);


instance.interceptors.response.use(
    function (res) {
      if (res.data.code == 200) {
        return res;
      }
      // 判断是否有权限
      if (res.data.code == 401) {
        Message({
          message: '没有权限',
          type: 'error'
        })
      } else {
        Message({
          message: res.data.message,
          type: 'error'
        })
      }
    },
    function (error) {
      console.log(arguments)
      MessageBox.alert(error.message, '系统提示', {
        confirmButtonText: '确定',
        type: 'error'
      })
      return Promise.reject(error);
    }
);
export default instance;
Login.vue
<template>

  <div class="center-container">
    <el-card style="width: 500px;">
      <div slot="header">
        登陆
      </div>

      <el-form ref="loginForm" :model="loginForm" :rules="loginFormRules">

        <el-form-item prop="account">
          <el-input v-model="loginForm.account" placeholder="账号/手机/邮箱">
            <template slot="prepend">
              <i class="fa fa-user"></i>
            </template>
          </el-input>
        </el-form-item>

        <el-form-item prop="password">
          <el-input v-model="loginForm.password" placeholder="密码" show-password>
            <template slot="prepend">
              <i class="fa fa-lock"></i>
            </template>
          </el-input>
        </el-form-item>

        <el-form-item>
          <el-button type="primary" style="width: 100%" @click="submitLoginForm">登陆</el-button>

          <!--router-link方式-->
          <router-link to="/index.html">router-link链接方式</router-link><br>

          <a href="index.html">直接使用超链接a标签</a>

        </el-form-item>

      </el-form>

    </el-card>
  </div>

</template>

<script>
  import qs from 'qs'

  export default {
    name: "Login",
    data() {
      return {

        loginForm: {
          account: 'admin',
          password: '123456'
        },
        loginFormRules: {
          account: [
            {required: true, message: '账号必填'}
          ],
          password: [
            {required: true, message: '密码必填'}
          ]
        }

      };
    },
    watch: {
      'loginForm.account'() {
        console.log(this.loginForm)
      }
    },
    methods: {
      submitLoginForm() {
        this.$refs.loginForm.validate((valid) => {
          if (!valid) {
            return false;
          }
          // 发送ajax请求执行登陆
          // 构建一个axios使用get请求的配置对象
          // let config = {
          //   params: this.loginForm
          // };
          this.axios.post('/api/login.json',qs.stringify(this.loginForm)).then(res=>{
            console.log(res)
            let result = res.data;
            if(result.code == 200){
              console.log(result.data);

              window.sessionStorage.setItem('loginUser',JSON.stringify(result.data));
              window.sessionStorage.setItem('token',result.token);
              // 使用提示框完成显示
              // 跳转到首页
              // 使用代码的方式跳转地址
              this.$router.push('/index.html');
              // // query中的对象会直接拼接到url地址后面，类似于get请求
              // this.$router.push({path:'/index.html',query:{id: 12}});
              // // params中对象不会拼接到url地址后面,类似于post请求的参数
              // this.$router.push({path:'/index.html',params:{id: 12}});
              // this.$router.push({name:'test',query:{id: 12}})
              // this.$router.push({name:'test',params:{id: 12}})

            }else{
              // 使用提示框完成显示
              this.$message({
                message: result.message,
                type: 'error'
              });
            }
          })


        });

        console.log(this.loginForm)
      }
    }

  }
</script>

<style >

  .center-container{
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-around;
  }
  .center-container .el-form-item__error{
    padding-left: 55px;
  }

</style>

后端

Authorization
package com.xuetang9.frame.uam.intercepter;

import java.lang.annotation.ElementType;
import java.lang.annotation.Retention;
import java.lang.annotation.RetentionPolicy;
import java.lang.annotation.Target;

/**
 * @author 洋葱
 * @version 1.0.0
 * @date 2020/6/17 15:10
 * @copyright 老九学堂
 */
@Target(value = {ElementType.METHOD,ElementType.TYPE}) // 注解的位置
@Retention(RetentionPolicy.RUNTIME) // 注解存在的时机
public @interface Authorization {

    /**
     * session范围的key值
     * @return
     */
    String scope() default "SESSION_LOGIN_TICKET";

    /**
     * 是重定向还是转发
     * @return
     */
    boolean forward() default true;
    /**
     * 重定向的地址
     * @return
     */
    String redirect() default "/no_authorization";
}
AuthorizationInterceptor
package com.xuetang9.frame.uam.intercepter;

import com.fasterxml.jackson.databind.ObjectMapper;
import com.xuetang9.frame.uam.util.JsonResult;
import com.xuetang9.frame.uam.util.Token;
import org.springframework.web.method.HandlerMethod;
import org.springframework.web.servlet.HandlerInterceptor;
import org.springframework.web.servlet.ModelAndView;

import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import java.util.HashMap;

/**
 * 身份授权校验
 * @author 洋葱
 * @version 1.0.0
 * @date 2020/6/17 14:43
 * @copyright 老九学堂
 */
public class AuthorizationInterceptor implements HandlerInterceptor {
    /**
     * 请求处理之前
     * @param request
     * @param response
     * @param handler
     * @return
     * @throws Exception
     */
    @Override
    public boolean preHandle(HttpServletRequest request, HttpServletResponse response, Object handler) throws Exception {
        System.out.println("进入了拦截器");
        System.out.println("当前正在执行的handler");
        System.out.println(handler);
        System.out.println(handler.getClass());
        // 处理方法级的处理器（值当前处理的是Controller中方法）
        if( !(handler instanceof HandlerMethod)){
           return true;
        }
        // 转换类型
        HandlerMethod handlerMethod = (HandlerMethod)handler;
        // 配合注解来使用
        // 获取表示验证的注解
        Authorization authorization = handlerMethod.getMethodAnnotation(Authorization.class);
        // 如果方法上没有注解，就获取类上的注解
        if(authorization == null){
            authorization = handlerMethod.getBeanType().getAnnotation(Authorization.class);
        }
        // 如果注解对象仍然为null，就表示不要验证
        if(authorization == null){
            return true;
        }
        // 进入验证
        // 获取session中保存的信息
        Object ticket = request.getSession().getAttribute(authorization.scope());
        System.out.println("--------------- interceptor ---" + request.getSession().getId());
        if(ticket == null){
            // 从请求头中获取token
            String token = request.getHeader("token");
            System.out.println("token ---------" + token);
            // 校验token
            ObjectMapper objectMapper = new ObjectMapper();
            Token tokenObj = objectMapper.readValue(token, Token.class);
            long interval =tokenObj.getInterval();
            long time = tokenObj.getCurrentTime();
            if(time + interval > System.currentTimeMillis()){
                // 过期
                return true;
            }
            // 转发还是重定向
            if(authorization.forward()){
                request.getRequestDispatcher(authorization.redirect()).forward(request, response);
            }else {
                response.sendRedirect(request.getContextPath() + authorization.redirect());
            }
            return false;
        }
        return true;
    }

    /**
     * 处理请求完成渲染之前
     * @param request
     * @param response
     * @param handler
     * @param modelAndView
     * @throws Exception
     */
    @Override
    public void postHandle(HttpServletRequest request, HttpServletResponse response, Object handler, ModelAndView modelAndView) throws Exception {

    }

    /**
     * 请求完成之后
     * @param request
     * @param response
     * @param handler
     * @param ex
     * @throws Exception
     */
    @Override
    public void afterCompletion(HttpServletRequest request, HttpServletResponse response, Object handler, Exception ex) throws Exception {

    }
}
AppController
package com.xuetang9.frame.uam.web;

import com.fasterxml.jackson.core.JsonProcessingException;
import com.fasterxml.jackson.databind.ObjectMapper;
import com.xuetang9.frame.uam.domain.User;
import com.xuetang9.frame.uam.domain.query.LoginQuery;
import com.xuetang9.frame.uam.intercepter.Authorization;
import com.xuetang9.frame.uam.service.UserService;
import com.xuetang9.frame.uam.util.JsonResult;
import com.xuetang9.frame.uam.util.Token;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.http.HttpStatus;
import org.springframework.web.bind.annotation.*;

import javax.servlet.http.HttpSession;
import java.util.HashMap;
import java.util.Map;

/**
 * @author 洋葱
 * @version 1.0.0
 * @date 2020/6/12 14:26
 * @copyright 老九学堂
 */
@RestController
@RequestMapping("/api")
@CrossOrigin
public class AppController {

    private static final String SESSION_LOGIN_TICKET = "SESSION_LOGIN_TICKET";

    @Autowired
    private UserService userService;

    @PostMapping("/login.json")
    public JsonResult login(LoginQuery query, HttpSession session) throws JsonProcessingException {
        // 创建一个用于响应JSON结果的对象
        JsonResult jsonResult = new JsonResult();

        // 执行登陆业务并得到登陆后的用户信息
        User loginUser = userService.login(query);
        // 判断登陆是否成功
        if(loginUser == null){
            jsonResult.setCode(9999);
            jsonResult.setMessage("账号或者密码错误");
        }else{
            // 保存登陆信息到session中
            session.setAttribute(SESSION_LOGIN_TICKET, loginUser);

            // 计算一个登陆的凭证
            Token tokenObj = new Token();
            tokenObj.setId(loginUser.getId().toString());
            tokenObj.setInterval(1000 * 60 * 10L);
            tokenObj.setCurrentTime(System.currentTimeMillis());

            // 转换一个JSON对象
            String token = new ObjectMapper().writeValueAsString(tokenObj);
            jsonResult.setToken(token);

            // 设置响应的信息
            jsonResult.setCode(HttpStatus.OK.value());
            // 设置登陆的信息
            jsonResult.setData(loginUser);
        }

        // 返回JSON数据
        return jsonResult;
    }

}
AuthorizationController
package com.xuetang9.frame.uam.web;

import com.xuetang9.frame.uam.util.JsonResult;
import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.RestController;

/**
 * @author 洋葱
 * @version 1.0.0
 * @date 2020/6/17 17:24
 * @copyright 老九学堂
 */
@RestController
public class AuthorizationController {

    @GetMapping("/no_authorization")
    public JsonResult unAuthor(){
        JsonResult jsonResult = new JsonResult();
        jsonResult.setCode(401);
        jsonResult.setMessage("没有权限访问");
        return jsonResult;
    }
}
ResourceController
package com.xuetang9.frame.uam.web;

import com.xuetang9.frame.uam.domain.Resource;
import com.xuetang9.frame.uam.domain.User;
import com.xuetang9.frame.uam.intercepter.Authorization;
import com.xuetang9.frame.uam.service.ResourceService;
import com.xuetang9.frame.uam.util.JsonResult;
import com.xuetang9.frame.uam.util.NodeMapper;
import com.xuetang9.frame.uam.util.TreeNode;
import com.xuetang9.frame.uam.util.TreeUtils;
import io.swagger.annotations.Api;
import io.swagger.annotations.ApiOperation;
import io.swagger.annotations.ApiParam;
import lombok.extern.slf4j.Slf4j;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.http.HttpStatus;
import org.springframework.web.bind.annotation.*;

import javax.servlet.http.HttpSession;
import java.util.ArrayList;
import java.util.List;

/**
 * 用来访问操作资源信息
 * @author 洋葱
 * @version 1.0.0
 * @date 2020/6/9 16:16
 * @copyright 老九学堂
 */
@RestController
@Slf4j
@Authorization
@CrossOrigin
@RequestMapping("/api")
public class ResourceController {

    @Autowired
    private ResourceService resourceService;


    /**
     * 添加一个资源信息
     * @param resource
     * @return
     */
    @ApiOperation(value = "添加资源",httpMethod = "post",response = JsonResult.class)
    @PostMapping("resources")
    public JsonResult add(@ApiParam Resource resource){
        // 创建一个新增响应的JSON结果
        JsonResult jsonResult = new JsonResult();
        try {
            resourceService.save(resource);
            jsonResult.setCode(HttpStatus.OK.value());
            jsonResult.setData(resource);
        }catch (Exception e){
            jsonResult.setCode(HttpStatus.INTERNAL_SERVER_ERROR.value());
            jsonResult.setError(e);
        }
        return jsonResult;
    }


    @DeleteMapping("resources/{id}")
    public JsonResult remove(@PathVariable int id){
        // 创建一个JSON结果对象
        JsonResult jsonResult = new JsonResult();
        try{
            boolean success = resourceService.deleteById(id);
            if(success){
                jsonResult.setCode(HttpStatus.OK.value());
            }else{
                jsonResult.setCode(10000);
            }
        }catch (Exception e){
            jsonResult.setCode(HttpStatus.INTERNAL_SERVER_ERROR.value());
            jsonResult.setError(e);
        }


        return jsonResult;
    }

    @PostMapping("resources/{id}")
    public JsonResult update(@PathVariable int id, Resource resource){
        log.debug(resource.toString());
        // 创建一个JSON结果对象
        JsonResult jsonResult = new JsonResult();
        try {
            resource.setId(id);
            boolean success = resourceService.updateByIdWithoutNull(resource);
            if(success){
                jsonResult.setCode(200);
            }else{
                jsonResult.setCode(10001);
                jsonResult.setData(resource);
            }
        }catch (Exception e){
            jsonResult.setCode(HttpStatus.INTERNAL_SERVER_ERROR.value());
            jsonResult.setError(e);
        }

        return jsonResult;
    }

    @GetMapping("resources/{id}")
    public JsonResult get(@PathVariable int id){
        JsonResult jsonResult = new JsonResult();
        try {
            Resource resource = resourceService.getById(id);
            jsonResult.setCode(HttpStatus.OK.value());
            jsonResult.setData(resource);
        }catch (Exception e){
            jsonResult.setCode(HttpStatus.INTERNAL_SERVER_ERROR.value());
            jsonResult.setError(e);
        }
        return jsonResult;
    }
    /**
     * 用来返回一个资源树的json数据
     * @return
     */
    @GetMapping("/resources")
    public JsonResult listTree(){
        JsonResult jsonResult = new JsonResult();
        // 获取资源数据的集合
        List<Resource> resources = resourceService.listAll();
        // 把集合数据转换为树形结构
        List<TreeNode> tree = TreeUtils.listToTree(resources, create());
        // 把树形数据保存到JSON数据中
        jsonResult.setData(tree);
        jsonResult.setCode(HttpStatus.OK.value());
        return jsonResult;
    }

    @GetMapping("/menus")
    public JsonResult listMenus(HttpSession session){

        System.out.println("---------- menu ----" + session.getId());
        JsonResult jsonResult = new JsonResult();
        try {
//            User user = (User)session.getAttribute("SESSION_LOGIN");
//            List<Resource> resources = resourceService.listMenus(user.getId());
            List<Resource> resources = resourceService.listMenus(3);
            // 构建一棵树
            List<TreeNode> tree = TreeUtils.listToTree(resources, create());

            jsonResult.setData(tree);
            jsonResult.setCode(HttpStatus.OK.value());

        }catch (Exception e){
            jsonResult.setCode(HttpStatus.INTERNAL_SERVER_ERROR.value());
            jsonResult.setError(e);
            jsonResult.setMessage(e.getMessage());
        }
        return jsonResult;
    }

    @GetMapping("resources/roles/{id}")
    public JsonResult listRoleResources(@PathVariable int id){
        JsonResult jsonResult = new JsonResult();
        List<Resource> list = resourceService.listByRoleId(id);
        jsonResult.setCode(HttpStatus.OK.value());
        jsonResult.setData(list);
        return jsonResult;
    }

    private NodeMapper<Resource> create(){
        return new NodeMapper<Resource>() {
            @Override
            public TreeNode objectMapper(Resource object) {
                TreeNode node = new TreeNode();
                node.setId(object.getId());
                node.setText(object.getName());
                node.setPid(object.getParentId());
                node.setHref(object.getUrl());
                node.setIcon(object.getIcon());
                node.setRaw(object);
                return node;
            }
        };
    }


}
Token
package com.xuetang9.frame.uam.util;

import lombok.Data;

import java.io.Serializable;

/**
 * @author 洋葱
 * @version 1.0.0
 * @date 2020/6/17 18:00
 * @copyright 老九学堂
 */
@Data
public class Token implements Serializable {
    private String id;

    private Long interval;

    private Long currentTime;
}
NodeMapper
package com.xuetang9.frame.uam.util;

/**
 * @author 洋葱
 * @version 1.0.0
 * @date 2020/6/9 16:39
 * @copyright 老九学堂
 */
public interface NodeMapper<T> {

    /**
     * 把一个对象转换为节点的数据对象
     * @param object
     * @return
     */
    TreeNode objectMapper(T object);
}
TreeNode
package com.xuetang9.frame.uam.util;

import lombok.Data;

import java.util.List;

/**
 * 用来定义一个树形节点的数据
 * @author 洋葱
 * @version 1.0.0
 * @date 2020/6/9 16:19
 * @copyright 老九学堂
 */
@Data
public class TreeNode<T> {

    private Integer id;

    private String text;

    private String icon;

    private String href;

    private Integer pid;

    private Integer depth;

    private Boolean expanded;

    private Boolean checked;
    
    private List<TreeNode> children;

    private T raw;

}
TreeUtils
package com.xuetang9.frame.uam.util;

import java.util.ArrayList;
import java.util.List;

/**
 * @author 洋葱
 * @version 1.0.0
 * @date 2020/6/9 16:25
 * @copyright 老九学堂
 */
public class TreeUtils {

    public static <T> List<TreeNode> listToTree(List<T> list, NodeMapper<T> mapper){

        List<TreeNode> nodes = new ArrayList<>();

        for(T row : list){
            // 把集合中的数据转换为树形节点数据
            TreeNode node = mapper.objectMapper(row);
            nodes.add(node);
        }

        // 构建一个具有层次结构的树
        List<TreeNode> tree = new ArrayList<>();
        // 循环获取根节点
        for(TreeNode node : nodes){
            if(node.getPid().equals(0)){
                tree.add(node);
                node.setDepth(0);
                // 每个节点查找子节点
                findChildNodes(node, nodes);
            }
        }

        return tree;
    }

    public static void findChildNodes(TreeNode parentNode, List<TreeNode> nodes){
        for(TreeNode child: nodes){
            // 找到子节点
            if(parentNode.getId().equals(child.getPid())){
                // 判断父节点中的子节点集合是否为空
                if(parentNode.getChildren() == null){
                    parentNode.setChildren(new ArrayList<>());
                }
                // 设置子节点的相关计算数据
                child.setDepth(parentNode.getDepth() + 1);
                // 将子节点添加到父节点的子节点集合中
                parentNode.getChildren().add(child);

                // 查找子节点包含的子节点
                findChildNodes(child, nodes);
            }
        }

    }

}
Sichon
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
专栏目录
vuex模块化
qq_41091678的博客
07-07 270
import Vue from 'vue' import Vuex from 'vuex' import getters from './getters' Vue.use(Vuex) // https://webpack.js.org/guides/dependency-management/#requirecontext const modulesFiles = require.context('./modules', true, /\.js$/) // you do not need `impor
【vue】状态管理
诗与浪子的博客
03-15 830
状态管理 vuex mutations //定义 function set_value(state, number) { state.num } //调用 this.$store.commit('add', 2) actions //定义 function change_num(store, number) { setInterval
axios发请求报错
weixin_46787337的博客
04-07 972
instance.defaults.withCredentials = true; instance.defaults.headers.common["Authorization"] = AUTH_TOKEN!; axios这两个属性一起使用会报错 平时应该只设置其中一个用与验证 如果要用cookie+session的形式验证的话 instance.defaults.withCredentials = true; 这个属性必须设置 后台必须把下面的响应头都设置上 response.statusCod
vue中的全局变量 this.$store.state 的取值与赋值
coldriversnow的专栏
06-16 2万+
一、定义 全局变量 注：如果不在store目录下的 index.js 定义 则 在其它 ***.vue 页面 代码中赋值，其它页面的这个全局变量，是不会变化的。
vue axios 封装时如何写死cookie
weixin_43245037的博客
01-24 1003
// 创建axios实例 var instance = axios.create({ timeout: 1000 * 300 }); instance.defaults.withCredentials = true; 设置 instance.defaults.withCredentials = true; 然后 document.cookie = "SESSION=5edq1cd9-3437-4214f-87s51-5f8qq38wew0q;"; 在本地开发的时候，就可以写死cookie，绕过后.
aut权限权限参考代码
08-13
"aut权限权限参考代码"可能是指一个用于自动化管理权限的代码库或者是一份指导文档，它涉及到如何在特定环境下设定和管理用户权限。在这个场景下，"aut"可能是一个缩写，代表自动化（Automation）或者特定的权限系统...
公司信息化系统用户权限管理制度MicrosoftOfficeWord文档参考.pdf
03-05
个人权限账户丢失、泄漏，被他人利用进行非法操作的，考核责任人300-500 元，造成不良影响的，视情况加重考核。盗用他人系统权限进行非法操作的，每次考核责任人 2000 元，造成不良影响的，视情况加重考核。 六、...
权限管理系统参考源码及网页
12-29
在本文中，我们将深入探讨权限管理系统的概念、设计、实现以及相关技术。 首先，权限管理系统的核心目标是确保数据安全性和隐私保护，通过授权机制来控制用户对系统资源的访问。这通常涉及到三个主要概念：用户、...
基于vue3.0 + vite 开发的后台管理系统，包含权限路由、权限按钮、个人中心等基础功能.zip
最新发布
01-04
Vue3，springboot，element-ui使用技巧，实战应用开发小系统参考资料，源码参考。 详细介绍了一些Qt框架的各种功能和模块，以及如何使用Qt进行GUI开发、网络编程和跨平台应用开发等。 适用于初学者和有经验的开发者...
springboot个人理财管理系统【完整sql+参考源码】
08-28
用户：个人理财管理：零钱理财，工资理财，期限理财，基金理财，银行推荐 金融工具：资金记录往来，网贷申请 个人中心：我的理财，我的...权限管理：用户权限，管理员权限 网贷管理：网贷审核，网贷信息查看，到期提醒
vue封装axios
qq_41756580的博客
04-28 305
在VUE开发过程中免不了使用axios，官方的axios使用在项目中使用起来还是不怎么方便的，例如对于异步的处理并不完美、请求参数的加密等。 话不多说，直接上代码： import axios from "axios"; import store from "store/"; import qs from "qs"; // 序列化传参，以&符号连接 import md5 from "m...
axios.defaults.withCredentials
wuyulkl的博客
06-15 973
withCredentials:默认情况下，跨源请求不提供凭据(cookie、HTTP认证及客户端SSL证明等)。通过将withCredentials属性设置为true，可以指定某个请求应该发送凭据。
Vue学习笔记（二）------axios学习
weixin_34234721的博客
04-20 174
axios 是一个基于 promise 的 HTTP 库，可以用在浏览器和 node.js 中。 axios的功能和特征： 从浏览器中创建XMLHttpRequests 从node.js中创建http请求 支持PromiseAPI 拦截请求和响应 转换请求数据和响应数据 取消请求 自动转化JSON数据 客户端支持防御XSRF 在项目中安装axois 使用npm npm install...
前后端分离的情况下,vue保存cookie时碰到的坑! (axios.defaults.withCredentials = true；) 前方巨坑,请小心!!!
寻觅的博客
08-19 1万+
文章目录一号坑问题描述解决方案二号坑问题描述解决方法总结 一号坑 问题描述 当我们的项目是前后端分离的模式时,vue不会自动帮我们保存后端传来的cookie! 解决方案 我们需要在main中添加axios.defaults.withCredentials = true 二号坑 问题描述 如果你之前处理过跨域方面的问题,应该会记得你曾经在后端请求头添加了一句response['Access-Control-Allow-Origin'] = "*" 我当前用的是django作为后端,如果你是用的是其他的后端
Vue在跨域请求时携带cookie的配置withCredentials: true
生有涯，知无涯
06-17 3万+
Vue在发起跨域请求时，后端已经开启CORS，前端需要也携带cookie，此时需要在前端请求头加上withCredentials: true，表示请求可以携带cookie，例如以下为用户注册部分代码。 axios.post(this.host + '/users/', { username: this.username, ...
axios.defaults.withCredentials = true 前端跨域传递Cookie设置
热门推荐
xiaoyuer_2020的博客
10-10 3万+
登录之后的请求会带登录用户信息，需要把登录时的cookie设置到之后的请求头里面。而跨域请求要想带上cookie，必须要在vue的main.js里加上axios.defaults.withCredentials = true。withCredentials 属性是一个Boolean类型，它指示了是否该使用类似cookies,authorization，headers(头部授权)或者TLS客户端证书这一类资格证书来创建一个跨站点访问控制（cross-site Access-Control）请求。 axi.
项目中的axios简单封装
qq_42514643的博客
05-14 241
简单的axios封装，用于平时的项目，虽然简单但基本够用，仅供自己参考 // 此文件叫http.js，主要用于封装axios 里面用到的axios 和 qs 都需要自己npm安装 import axios from 'axios' import qs from 'qs' // 默认配置 // axios.defaults.xxx // 拦截器处理 // axios.interceptors.request // axios.interceptors.response // 创建一个实例，可以用于多.
axios.defaults.withCredentials跨域携带cookie
05-13 1619
withCredentials:默认情况下，跨源请求不提供凭据(cookie、HTTP认证及客户端SSL证明等)。前端通过将withCredentials属性设置为true指定某个请求应该发送凭据 withCredentials默认值为false。 true：在跨域请求时，会携带用户凭证 false：在跨域请求时，不会携带用户凭证；返回的 response 里也会忽略 cookie 注意：当配置了 withCredentials = true时，必须后端配置增加 response 头信息Access-
App系统权限申请使用指南：保护个人信息安全
《网络安全标准实践指南—移动互联网应用程序系统权限申请使用指引》是一份重要的参考材料，它不仅为App开发者提供了实用的指导，也为监管机构和用户提供了衡量应用权限管理是否合理的重要依据，共同维护移动互联网...
评论 1
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值