{"action":"created","issue":{"url":"https://api.github.com/repos/Flipboard/react-canvas/issues/109","labels_url":"https://api.github.com/repos/Flipboard/react-canvas/issues/109/labels{/name}","comments_url":"https://api.github.com/repos/Flipboard/react-canvas/issues/109/comments","events_url":"https://api.github.com/repos/Flipboard/react-canvas/issues/109/events","html_url":"https://github.com/Flipboard/react-canvas/pull/109","id":102566081,"number":109,"title":"Fix #108: add crossOrigin prop on Image to allow getImageData/WebGL","user":{"login":"gre","id":211411,"avatar_url":"https://avatars.githubusercontent.com/u/211411?v=3","gravatar_id":"","url":"https://api.github.com/users/gre","html_url":"https://github.com/gre","followers_url":"https://api.github.com/users/gre/followers","following_url":"https://api.github.com/users/gre/following{/other_user}","gists_url":"https://api.github.com/users/gre/gists{/gist_id}","starred_url":"https://api.github.com/users/gre/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/gre/subscriptions","organizations_url":"https://api.github.com/users/gre/orgs","repos_url":"https://api.github.com/users/gre/repos","events_url":"https://api.github.com/users/gre/events{/privacy}","received_events_url":"https://api.github.com/users/gre/received_events","type":"User","site_admin":false},"labels":[],"state":"open","locked":false,"assignee":null,"milestone":null,"comments":6,"created_at":"2015-08-22T20:48:10Z","updated_at":"2015-08-24T16:32:06Z","closed_at":null,"pull_request":{"url":"https://api.github.com/repos/Flipboard/react-canvas/pulls/109","html_url":"https://github.com/Flipboard/react-canvas/pull/109","diff_url":"https://github.com/Flipboard/react-canvas/pull/109.diff","patch_url":"https://github.com/Flipboard/react-canvas/pull/109.patch"},"body":"This fixes issue #108,\r\n\r\nIt enables `crossOrigin` on all `Image` (see [CORS enabled image](https://developer.mozilla.org/en-US/docs/Web/HTML/CORS_enabled_image)).\r\n\r\n\r\nWithout crossOrigin=true, if you try this code on any `react-canvas` app that uses images:\r\n\r\n```js\r\nvar c = document.createElement(\"canvas\");\r\nctx = c.getContext(\"2d\");\r\npage=document.querySelector(\"canvas\");\r\nc.width=page.width;\r\nc.height=page.height;\r\nctx.drawImage(page, 0, 0);\r\nctx.getImageData(0, 0, page.width, page.height); // Screenshot the app :)\r\n```\r\n\r\nthere will be following exception:\r\n\r\n```\r\nUncaught DOMException: Failed to execute 'getImageData' on 'CanvasRenderingContext2D': The canvas has been tainted by cross-origin data.\r\n```\r\n\r\nYou need this feature when:\r\n\r\n- you want to use getImageData to screenshot/video capture the application canvas.\r\n- you want to draw the Canvas into WebGL (e.g: to add a cool effect on it). (this second reason brought me here :) )"},"comment":{"url":"https://api.github.com/repos/Flipboard/react-canvas/issues/comments/134291299","html_url":"https://github.com/Flipboard/react-canvas/pull/109#issuecomment-134291299","issue_url":"https://api.github.com/repos/Flipboard/react-canvas/issues/109","id":134291299,"user":{"login":"gre","id":211411,"avatar_url":"https://avatars.githubusercontent.com/u/211411?v=3","gravatar_id":"","url":"https://api.github.com/users/gre","html_url":"https://github.com/gre","followers_url":"https://api.github.com/users/gre/followers","following_url":"https://api.github.com/users/gre/following{/other_user}","gists_url":"https://api.github.com/users/gre/gists{/gist_id}","starred_url":"https://api.github.com/users/gre/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/gre/subscriptions","organizations_url":"https://api.github.com/users/gre/orgs","repos_url":"https://api.github.com/users/gre/repos","events_url":"https://api.github.com/users/gre/events{/privacy}","received_events_url":"https://api.github.com/users/gre/received_events","type":"User","site_admin":false},"created_at":"2015-08-24T16:32:06Z","updated_at":"2015-08-24T16:32:06Z","body":"Both done, thanks :)"}}