首页 > 其他分享 >解决vue用axiso两次访问后台api,发现后台的sessionID不一致

解决vue用axiso两次访问后台api,发现后台的sessionID不一致

时间:2024-01-18 16:13:57浏览次数:16  
标签:vue builder options Services sessionID session 后台 true app

我用的是ASP.NET Core7.0做的后台api,在解决了跨域问题(这个问题在官网上就有答案https://learn.microsoft.com/zh-cn/aspnet/core/security/cors?view=aspnetcore-7.0)

为了方便 阅读,我再讲一下

在里progam里面增加代码(黄色代码),代码格式我就把不变的放到一起了

解决完这个之后,因为要用session所以又增加了对session的支持(绿色部分),这个也可以在官网或者其他地方找到

然后解决需要session 的id 一致问题,首选在服务端放开带cookie的验证,红色部分,由于加了验证,导致AllowAnyOrigin()错误,所以改成了.SetIsOriginAllowed(_ => true),

这样服务端就解决了

var MyAllowSpecificOrigins = "_myAllowSpecificOrigins";

var builder = WebApplication.CreateBuilder(args);

builder.Services.AddCors(options => {

options.AddPolicy(name: MyAllowSpecificOrigins,

policy =>
{
policy.WithOrigins("*", "*", "*")
//.AllowAnyOrigin()
.SetIsOriginAllowed(_ => true)
.AllowAnyHeader()
.AllowAnyMethod()
.AllowCredentials();
});

builder.Services.AddDistributedMemoryCache();//添加session支持,同时要加这句
///设置session
builder.Services.AddSession(options =>
{

options.IdleTimeout = System.TimeSpan.FromSeconds(120);//设置session的过期时间
//options.Cookie.Name = ".AdventureWorks.Session";
//options.Cookie.HttpOnly = true;
options.Cookie.HttpOnly = true;//设置在浏览器不能通过js获得该cookie的值
options.Cookie.IsEssential = true;
});

///下面这些不用的可以去掉

 

builder.Services.TryAddSingleton<IHttpContextAccessor, HttpContextAccessor>();
builder.Services.AddHttpContextAccessor();  
builder.Services.AddMvc();

 

builder.Services.AddControllers();

var app = builder.Build();     app.UseHttpsRedirection();    app.UseStaticFiles();     app.UseRouting();

app.UseCors(MyAllowSpecificOrigins);

app.UseAuthorization();   

  app.UseSession();//UseSession配置在UseMvc之前  

  app.MapControllers();     app.Run();

 

然后是在vue+axiso的时候遇到问题

首先在axiso引用的地方增加 以下代码,

axios.defaults.withCredentials =true;   很多地方都写这样就直接可以解决,然后我试了之后,发现如果直接调用后端地址进去之后发现session的Id问题还是未解决 最后又是跟踪文件头又是返回的跟踪还是没解决, 最后无奈之下还是试了试代理 在vue.config.js 中增加代理,如下代码后,问题解决 ,最后我想问一下这问题产生的原理是啥啊,哪位大神看到的话给个答案
module.exports = {     devServer: {         proxy: {             '^/api': {                 target: 'https://localhost:7164',                  pathRewrite: {'^/api': ''}                  ,ws: true                  ,changeOrigin: true             }         }     },.........后面代码省了  

 

标签:vue,builder,options,Services,sessionID,session,后台,true,app
From: https://www.cnblogs.com/dugubingxun/p/17972689

相关文章

  • 异步加载树形组件(antd-vue)
    1、html<a-directory-tree:tree-data="useDataSourceTreeList"v-model:selectedKeys="selectedKey"v-if="datasourceId"blockNodeclass="tree-card":showIco......
  • 使用JSZip库解压后台返回的Blob格式文件,并回显到element-ui的el-upload组件
    有一个报告列表,点击编辑的时候需要回显新建时上传的附件。后台提供了一个下载接口,但是会将所有上传的文件打包为一个压缩的blob。类似这种:leturlArr=[];urlArr=urlArr.concat(this.downLoadUrl.split(";"));this.$http.downLoadFile({url:urlArr.......
  • Vue3.0 路由动画(页面跳转)
    前言vue3.0的页面组件之前切换的动画效果,在移动端H5页面,交互体验比较好,就是带Vue3的Transition组件 之前的写法是 Transition的组件要包在routerView外面,但是3.0的语法就是要在在里面了,不然会黄色警告<divclass="animation"><RouterViewv-slot="{Component,......
  • 记一个vue2中使用路由时,在同一个页面跳转,但是url参数不同,不会重新渲染页面的问题
    vue2中使用路由时,页面自己跳转自己,但是携带的参数不一样预期想要的结果是:感冒2会跟随着url的参数进行变化,但是并没用 解决方法: 在App.vue这个页面中的router-view添加  :key="$route.fullPath"结果在自己跳转自己之后会刷新页面 达成:参考:https://blog.csdn.ne......
  • HBuilderX mac M1 打包 vite/vue3 报错处理办法(pnpm)
    项目运行h5的时候都没有问题,但是要运行到微信开发者工具的时候打包报11:40:54.480Specificallythe"esbuild-darwin-arm64"packageispresentbutthisplatform11:40:54.480needsthe"esbuild-darwin-64"packageinstead.Peopleoftengetintothis很好看去论......
  • vue+tsc+noEmit导致打包报TS类型错误问题及解决方法
    当我们新建vue3项目,package.json文件会自动给我添加一些配置选项,这写选项基本没有问题,但是在实际操作过程中,当项目越来越复杂就会出现问题。本文列举一个目前我遇到的一个问题:打包后报了一堆TS类型错误,怎么消除这些错误?项目环境:Vue3+Vite+TS当项目进行打包时候,突然发现终端......
  • vue3+lottie-web加载json格式动画
    项目中要用动画设计说gif会失真,用json格式动画吧。我虎躯一震,json格式动画什么鬼?lottie库什么鬼。。。。不废话,直接上重点环境:编辑器webstorm,前端技术栈vue3+vite+ts安装lottie-webyarnaddlottie-web引入lottie,引入json格式动画文件.importlottiefrom'lott......
  • vue-element-admin/litemall后端,超过两级嵌套路由无法缓存的问题
    本文主要针对的是litemall后端,vue-element-admin只需稍作修改应该也可以适用。路由扁平的思路主要来源于https://blog.csdn.net/weixin_40119256/article/details/111475571,另外解决面包屑显示问题,此文章作记录以供有需要的同行参考。keep-alive用于缓存不活跃的组件实例,避免重......
  • vue-element-admin关闭标签跳转到前一个标签,而不是最近的标签
    vue-element-admin中关闭标签跳转到前一个标签,而不是最近的标签。场景:先后打开A和B标签,接着从A标签页面内部跳转到C标签(A和C存在紧密关系)。这时如果关闭C标签,默认跳转到最近的B标签而不是A标签。如果A和C中间隔着很多标签,这种场景很难在找回A标签的位置。期望跳转时从A跳转到C处......
  • 你不知道的vue3:使用runWithContext实现在非 setup 期间使用inject
    前言日常开发时有些特殊的场景需要在非setup期间调用inject函数,比如app中使用provide注入的配置信息需要在发送http请求时带上传给后端。对此我们希望不在每个发起请求的地方去修改,而是在发起请求前的拦截进行统一处理,对此我们就需要在拦截请求的函数中使用inject拿到app注入的......