VUE3报错 GET http://localhost:8000/api/info/?token=eyJ***** 401 (Unauthorized)

最新推荐文章于 2024-06-07 10:46:12 发布

原创最新推荐文章于 2024-06-07 10:46:12 发布 · 788 阅读

1 ·

CC 4.0 BY-SA版权

文章标签：

#http #vue #前端框架

博客记录了一个HTTP请求报错，报错信息为401 (Unauthorized)，原因是未鉴权，header里的token格式不对。原来是浏览器做数据请求时token格式有误，将其改成config.headers['Authorization'] = 'Bearer '+localStorage.getItem('Authorization')后请求成功。

报错原文：

GET http://localhost:8000/api/info/?token=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJ0b2tlbl90eXBlIjoiYWNjZXNzIiwiZXhwIjoxNjgyNzMxMTcwLCJpYXQiOjE2Nzc1NDcxNzAsImp0aSI6IjZhNTkwZGJkZTU0MzRiNzE5NjlhOWFhMzdmMzQ1M2QzIiwidXNlcl9pZCI6MX0.C4JeWWsra9sUBy_zDOsNUd28LTCVgwJCr82nlONomgM 401 (Unauthorized)

报错原因：未鉴权，header里面的token格式不对

原来是浏览器做数据请求的时候，

此时的token如下图：

改成config.headers['Authorization'] = 'Bearer '+localStorage.getItem('Authorization')之后，成功：

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

Felix51

关注关注

1
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
分享

复制链接

分享到 QQ

分享到新浪微博

扫一扫
举报

举报

登陆成功，接口扔报401。vue.config.js 配置代理请求，携带cookie

qq_28918357的博客

04-12

2446

前端登陆成功，但其他接口仍报401。解决方法，vue.config.js 配置代理请求时携带cookie，供前后端采用cookie验证机制的系统在开发阶段参考

fasthttp mysql_GitHub - zhongzhongBaby/FastapiMysqlDemo: 这是使用FastApi+mysql 快速生成web后端接口框架的一个demo项目，初学...

weixin_36169116的博客

01-26

551

FastApi+mysql 快速搭建web后端接口框架项目地址：项目描述：最近从java转来学习FastApi，想要快速搭建一个FastApi+mysql的后端接口框架，但是网上没有找到demo，所以自己简单写了一个，做了一些简单的封装，希望对和我一样的新学者有所帮助。功能涵盖：1.使用数据源访问mysql2.实现中文api文档3.请求参数数据验证4.使用jwt实现Token登录验证5.不同环境(...

参与评论您还未登录，请先登录后发表或查看评论

vue3 vite项目一运行就401(Unauthorized)

LlanyW的专栏

03-02

1197

项目之前是正常运行的，没有问题，回溯刚刚改动，还原之后发现是把.env.development的基本路径置空导致的。问题：项目一执行： pnpm run dev, 启动就出错，

记录解决报错--vue前后端分离，接口401(Unauthorized)

qq_42977853的博客

01-30

4610

④我接口认证的ip是192.168.101.29，vue前端页面访问的是http://localhost:8011，认证成功后，认证信息保留在192.168.101.29里面，所以localhost里面没有认证信息，所以认证完后访问接口还是401错误。于是，将vue前端页面访问ip改为局域网的http://192.168.101.29:8011。查看.env.development配置，VUE_APP_URL = ‘http://127.0.0.1:9000’。②查看vue.config.js配置。

vue/javascript前端直接连接neo4j-错误401unauthorized

minosisterry的博客

08-03

1993

neo4j的样例数据如下：访问的返回值：实现的代码如下： let query = 'MATCH (n:case) RETURN n, labels(n) as l LIMIT {limit}' let params = {limit: 10} // let cb = function (err, data) { console.log(JSON.stringify(data)) } this.cypher(query, params) 函数： ..

Vue3 axios响应拦截器处理接口返回401未登录跳转登录页

weixin_45323842的博客

11-16

5078

【代码】Vue3 axios响应拦截器处理接口返回未登录返回登录页。

POST http://10.0.0.23/csc/admin/user/login?username=admin&password=dc483e80a7a0bd9ef71d8cf973673924&code=11&uuid=9f720a4a48edd64b4301b9275c53c372 HTTP/1.1 Host: 10.0.0.23 Connection: keep-alive Content-Length: 0 User-Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/137.0.0.0 Safari/537.36 Accept: application/json, text/plain, */* X-VISITOR-ID: 6b6685974d74b7b235e4e6dc7f5f6131 Origin: http://10.0.0.23 Referer: http://10.0.0.23/admin/ Accept-Encoding: gzip, deflate Accept-Language: zh,zh-CN;q=0.9,bm;q=0.8 Cookie: vue_user_csc_admin_template_token_time=undefined; _c_WBKFRo=dQl8qclAp1iBqAssZlvENzD0hjzIK9nF8vVn89FT; _nb_ioWEgULi=; sidebarStatus=0; username2=admin; password2=a123456; rememberMe=true; vue_user_csc_admin_template_token_usename=admin; vue_user_shop_template_token_web=eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJsb2dpblR5cGUiOiJsb2dpbiIsImxvZ2luSWQiOjE5MzI0MDA0ODcwODM3NDUyODAsInJuU3RyIjoiaWxrWWNvNm82eUlHOFpDeFY3SEl2alBVWFNZU3NhM2UiLCJVTkFNRSI6ImFiYmJiYmJiYmJiYmJiY2NjY2NjY2NAMTIzLmNvbSJ9.ZuF_zmCqgyKKC8cn1AF4LPyDjthGehALj6R1ysW_JWQ; vue_user_shop_template_token_webuser=abbbbbbbbbbbbbcccccccc@123.com

最新发布

06-11

如果 Token 已过期或无效，服务器可能会拒绝请求并返回 `401 Unauthorized` 错误。此时，可以实现 Refresh Token 机制，通过 Refresh Token 获取新的 Access Token： ```javascript function refreshAccessToken...

export default function ({ params, data, headers, url, method }) { // 设置请求query、请求体、请求头 Headers:{eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJ1c2VySWQiOjEsInJvbGVOYW1lIjoiYWRtaW4iLCJpYXQiOjE3NDg4MzgyMzcsImV4cCI6MTc1MTQzMDIzN30.DgI6H4CffoxW9DAoxo0gbUAPE70XqZY1h47HkkeqeXU} return { params, data, headers, url, method }; } 这个格式对吗

06-03

前端学习（1857）vue之电商管理系统电商系统之配置api接口服务器并用postman调试接口

歌谣的博客

08-05

1090

# 1. 电商管理后台 API 接口文档 ## 1.1. API V1 接口说明 - 接口基准地址：`http://127.0.0.1:8888/api/private/v1/` - 服务端已开启 CORS 跨域支持 - API V1 认证统一使用 Token 认证 - 需要授权的 API ，必须在请求头中使用 `Authorization` 字段提供 `token` 令牌 - 使用 HTTP Status Code 标识状态 - 数据返回格式统一使用 JSON ### 1.1.1. 支持的请求方法.

JWT功能开发-后端生成token

pansuyong的博客

04-22

718

JWT 基本概念详见 jwt 生成 JWT Token 安装 jsonwebtoken npm i -S jsonwebtoken 使用 const jwt = require('jsonwebtoken') const { PRIVATE_KEY, JWT_EXPIRED } = require('../utils/constant') login(userna...

Vue:请求401 没有权限退出登录

qq_45061461的博客

07-06

4501

在项目中,每个用户登录之后都会有一个token,一般token都会设置过期时间,如果在规定的时间内用户没有任何操作请求后端接口,就会导致用户的token过期,在过期后再次请求后端数据的话,一般接口就会返回状态码:401 标识没有权限.正常情况下接口请求后端数据,请求头携带用户token,接口返回状态: 200 表示请求成功,但是如果用户的token过期,用户就没有权限在去访问后端的数据,此时后端就会在接口的状态中返回:401。那么在这种情况下,用户状态过期,就需要咱们用户重新登录,拿到最新的token.

laravel passport 401 Unauthorized vue

迷失的鱼的博客

10-12

3736

Authorization:'Bearer '.$accessToken 将这个加入请求头部本人踩得坑就是没有加'Bearer '

.NET CORE API访问401错误

Ben的专栏

02-16

2078

问题描述：一台windows服务器使用IIS托管了两个.net core API，均采用windows认证模式。 API A去访问B时，一直返回401错误，接口访问使用default方式。 this._client = new HttpClient(new HttpClientHandler() { UseDefaultCredentials = true }); 原因分析： there is a windows security setting preventloopbackmessages th

Tomcat ：“localhost:8080”报错401：Unauthorized

韩小兔修媛史的博客

09-03

3226

总结一下第一次遇到的Unauthorized：401错误，其实呢很简单的一个错：运行tomcat的时候，当我输入localhost：8080时，弹出一个提示框：需要用户名密码登录，也就是没有访问权限，点击取消时：报错401：Unauthorized 分析任何客户端 ( 例如您的浏览器) ，都需要通过以下循环：从站点的 IP 名称 ( 即您站点的网址-URL, 不带起始的 ‘http://’) 获得一个 IP 地址。这个对应关系 ( 即由 IP 名称向 IP 地址转换的对应关系 ) 由域名服务器 (

vue3登录401的时候，返回登录页，登录成功以后在返回之前的页面

weixin_70243424的博客

07-24

1378

【代码】vue3登录401的时候，返回登录页，登录成功以后在返回之前的页面。

http 401错误解析