2

Connecting to infura.io is working fine when using chrome on desktop, however when using safari I get CORS issues. Also the mobile versions of the page don't even load on the device. The following messages appear in the console.

Failed to load resource: Origin http://website.com is not allowed by Access-Control-Allow-Origin.
Fetch API cannot load https://ropsten.infura.io/[ID]/. Origin http://website.com is not allowed by Access-Control-Allow-Origin.

I am using Amazon s3 so I tried to change the CORS configuration settings to something like this, but still no effect.

<?xml version="1.0" encoding="UTF-8"?>
<CORSConfiguration xmlns="http://s3.amazonaws.com/doc/2006-03-01/">
<CORSRule>
    <AllowedOrigin>http://*</AllowedOrigin>
    <AllowedOrigin>https://*</AllowedOrigin>
    <AllowedMethod>GET</AllowedMethod>
    <AllowedMethod>HEAD</AllowedMethod>
    <MaxAgeSeconds>3000</MaxAgeSeconds>
    <AllowedHeader>Authorization</AllowedHeader>
    <AllowedHeader>x-requested-with</AllowedHeader>
    <AllowedHeader>origin</AllowedHeader>
</CORSRule>
</CORSConfiguration>

Is this a common issue with infura.io? Is there anything else that I am missing?

Improve this question
4
  • Is this with react? I believe react test dev environment has issues with cors
    – AnAllergyToAnalogy
    Sep 13 '18 at 13:26
  • Yes it is a react project deployed to amazon s3. What sort of issues? What can I do to resolve it?
    – koukotsu
    Sep 14 '18 at 19:43
  • I'm not sure, I don't really know react, but I think this is a React issue, not an Infura issue.
    – AnAllergyToAnalogy
    Sep 17 '18 at 15:27
  • I have faced the exact same issue, the app is working on Chrome on PC but not working on any mobile browser or Safari on PC. Did you resolve the problem? I have a working version which runs on web3.0.26 but after I've updated to web3.1, it failed to run on the browsers mentioned above
    – Mehmet Doğan
    Nov 29 '18 at 7:48
1

I have faced the same issue in my angular 7 project, I was used web3 js version 1.0.0-beta.37".

Once downgrade the version to web3 1.0.0-beta.34,

It works fine in all browsers including desktop and mobile (android & ios devices).

Additionally you have to install "eth-lib": "0.2.7", if you are not installed.

import web3 like below in .ts file,

import Web3 from "web3";

  public web3;

constructor() {
 this.web3 = new Web3(
  new Web3.providers.HttpProvider(environment.transferWeb3ApiUrl)
);
}
Improve this answer
0

I have found the following issues that matches the exact same problem you have mentioned above :

request.withCredentials is added on web3 1.0.36 beta.

You can find the related change in this commit.

Hope the above links can help

Improve this answer

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.