我使用js-cookie
包来存储和处理react应用程序中的cookie。cookie在用户首次登录时设置,并在浏览器的Applications选项卡中可见。我创建了一个服务,用于向数据库添加新产品。cookie存储jwt标记,然后在用户执行任何操作之前将其传递到后端进行验证。Cookies.get()方法在此服务中始终返回undefined。
这里是服务的代码
import axios from 'axios'
import Cookies from "js-cookie";
import { ProductTypes } from '../domain/entities/Product';
import { addProductResponse, getProductResponse } from '../domain/responses/productResponse';
const token = Cookies.get("authToken");
const instance = axios.create({
baseURL: 'http://localhost:8000/',
headers: {
"Content-type": "application/json",
"Authorization":`Bearer ${token}`
},
});
export const addProduct = async(formValues:ProductTypes):Promise<addProductResponse>=>{
console.log("token from react",token);
return await instance.post(`/products/create-product`,formValues).then(
(response:addProductResponse) => response)
}
这是它的设置方式
const setToken = (authToken: string) => {
Cookies.set("authToken", authToken, {
expires: new Date(Date.now() + 15 * 60 * 1000),
secure: true,
});
};
有没有人能好心地指出我可能做错了什么?PS:它是一个 typescript 应用程序
1条答案
按热度按时间2ul0zpep1#
实际上,您在
Cookies.set
函数中添加了secure: true
参数,并且在没有HTTPS
协议的情况下调用baseURL: 'http://localhost:8000/'
,这就是原因。因此,您只需要设置secure: false
Secure属性将Cookie的作用域限制为“安全”通道(其中“安全”由用户代理定义)。当Cookie具有Secure属性时,仅当通过安全通道(通常为HTTP over Transport Layer Security(TLS)[RFC2818])传输请求时,用户代理才会将Cookie包括在HTTP请求中。