React Native 应用程序中的 Axios 请求响应 401，但在 Postman 和浏览器中工作？

Question

请求失败，状态代码为 401 这是我在响应本机应用程序中响应此 api 调用时遇到的错误

     const fetchData = async () => {
            try {
                const response = await axios.get(`${API_URL}/general-setting`, {
                    headers: {
                        'Accept': 'application/json',
                    }
                });
                const generalSetting = response.data.data.general_setting;
                const newTheme = {
                    baseColor: `#${generalSetting.base_color}`,
                    secondColor: `#${generalSetting.secondary_color}`,
                };
                setTheme(newTheme);
            } catch (error) {
                Alert.alert('Error Fetching Theme', 'Please check your internet connection and try again.');
            }
        };

但在邮递员或浏览器中我得到了正确的响应。这里是 邮递员中的 Api 响应

我在浏览器中尝试了相同的 api，它也可以在那里工作，但不能在我的 React Native 应用程序中

Answer 1

在标头部分必须有受保护路由的授权令牌。在邮递员中看到标题部分，应该有授权令牌（假设不记名令牌）。复制它并在 .env 或 .env.local 中将其粘贴为

AUTH_TOKEN=<Copied-token>

并在标题中添加

Authorization: `Bearer ${process.env.AUTH_TOKEN}`,

注意：这只是临时解决方案。对于永久解决方案，登录时将使用令牌值设置 cookie，并将其附加到受保护路由的每个请求中。