Stripe error : unable to perform color detection

Question

im currently attempting to integrate Stripe into a little website.

I can see within Firebug, that this get request runs correctly

https://checkout.stripe.com/api/bootstrap?locale=en&key=******************

However another request comes back with a NetworkError : 400 Bad Request

https://checkout.stripe.com/api/color?image_url=https%3A%2F%2Fwww.*******.com%2Fassets%2Fimages%2Flayout-images%2Fstripe-logo.jpg&key=

The JSON response when opening the URL in a browser is

{
"error": {
"type": "invalid_request",
"message": "Unable to perform color detection."
}
}

some posts on the message indicate that it shouldnt be worried about. but I havent been able to find anything really informative on the specific error. Does anyon ehappen to know what is causing this error ?

Answer 1

This can happen if the image URL is not publicly accessible, as Stripe has to be able to request the image from their servers. This can happen if you are running a local copy of the application which isn't accessible from the outside world, or if it is behind a VPN or authentication.

Answer 2

So I changed the handler to include another paramter of color and it appears to have resolved the issue.

  var handler = StripeCheckout.configure({
    key: '******************',
    image: '/assets/images/layout-images/stripe-logo.jpg',
    color: 'black',
    token: function(token) {
      // Use the token to create the charge with a server-side script.
      // You can access the token ID with `token.id`
    }
  });

weird as im not quite sure why it wasnt included in the docs.

Answer 3

I got the same error and setting color didn't work for me. I changed the path of the image to the one given in Stripe documentation:

Changed

https://stripe.com/template/img/documentation/checkout/marketplace.png

to

https://stripe.com/img/documentation/checkout/marketplace.png