Having this issue which is quite intricate from STRIPE. I'm also new to full stack. Firstly, i'm receiving this error in my console network.
raw: {,…}
headers: {server: "nginx", date: "Thu, 02 Dec 2021 12:21:48 GMT", content-type: "application/json",…}
message: "You did not provide an API key. You need to provide your API key in the Authorization header, using Bearer auth (e.g. 'Authorization: Bearer YOUR_SECRET_KEY'). See https://stripe.com/docs/api#authentication for details, or we can help at https://support.stripe.com/."
statusCode: 401
type: "invalid_request_error"
rawType: "invalid_request_error"
statusCode: 401
type: "StripeAuthenticationError"
Weirdly, I can confirm that Stripe is making post requests, in fact I can see logs going to them in my account dashboard.
This is being established through the following. I set the stripeToken from the onclick, and then use a useEffect to create a post request to my endpoint. This should re-route to the success page afterward.
const cart = useSelector((state) => state.cart);
const [stripeToken, setStripeToken] = useState(null);
const history = useHistory();
const onToken = (token) => {
setStripeToken(token);
};
console.log(stripeToken)
useEffect(()=> {
const makeRequest = async () => {
try{
const res = await userRequest.post("/checkout/payment", {
tokenId: stripeToken,
amount: cart.total * 100,
})
history.push("/success", {data:res.data});
}catch{}
}
stripeToken && makeRequest();
}, [stripeToken, cart.total, history])
Furthermore, userRequest comes from the following, and this is where I think my error is. I am using my TOKEN from the login header when a user is logged in. and the URL of my port
const BASE_URL = "http://localhost:5000/api/"
const TOKEN = "eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpZCI6IjYxOTM4MTE2ZGUxMjBiNmQzZGVmOWU1NyIsImlzQWRtaW4iOnRydWUsImlhdCI6MTYzODQ0NjkyNSwiZXhwIjoxNjM4NzA2MTI1fQ.ZsozvCvkc3ewlbwjKRceERsGBVF79zEHCZvbqFZBxJg";
export const publicRequest = axios.create({
baseURL: BASE_URL,
});
export const userRequest = axios.create({
baseURL: BASE_URL,
headers: { 'Authorization': `Bearer ${TOKEN}` }
});