[Bug] Fails to reach Pinecone on iOS / macOS in V1 and V2 from ReactJS Browser

[JonathanAsbury-Dovaxis]

Is this a new bug?

• [X] I believe this is a new bug
• [X] I have searched the existing issues, and I could not find an existing issue for this bug

Current Behavior

When calling pinecone in ReactJS from the browser, the application works on Windows and Android devices but times out on iOS and macOS with an error at pincone-generated-ts-fetch runtime 206:69. We've tried passing in additionalHeaders with no change. Sure, moving calls to server-side processing is more secure and preferable, but this slows down some rapid development for early experimentation.
Please note, our development is going against a gcp_starter instance. We typically develop against than then push code to paid instances.

Expected Behavior

Requests through pinecone-ts-client from macOS and iOS return results rather than times out like when running on a Windows OS or Android Device.

Steps To Reproduce

1. In a ReactJS based webpage instantiate a pinecone-ts-client and query docs

2. Configure:

   V1: const pinecone = new Pinecone( { apiKey: {myKey}, environment: {myEnv}, additionalHeaders: {'Access-Control-Allow-Origin': {myDomain}} } V2: { apiKey: {myKey}, additionalHeaders: {'Access-Control-Allow-Origin': {myDomain}} } );

Relevant log output

Request failed to reach Pinecone. This can occur for reasons such as incorrect configuration (environment, project id, index name), network problems that prevent the request from being completed, or a Pinecone API outage. Check your client configuration, check your network connection, and visit https://status.pinecone.io/ to see whether any outages are ongoing.
pincone-generated-ts-fetch runtime 206:69

Environment

- **OS**: macOS, iOS
- **Language version**: JavaScript
- **Pinecone client version**: v1.x or v2.x

Additional Context

It works oneverywhere else.

[wcohnshb]

In case it helps with this bug, I believe I'm seeing the same bug in my ReactJS app on IOS (Chrome and Safari) and macOS (Safari). It looks like @pinecone-database/pinecone (2.2.0) is setting the User-Agent HTTP header to: User-Agent: @pinecone-database/pinecone v2.1.1; lang=typescript,

which causes this exception:

[Error] Request header field User-Agent is not allowed by Access-Control-Allow-Headers.

[Error] Fetch API cannot load https://YOUR-PINECONE-VECTORDB-ID.pinecone.io/query due to access control checks.

[Error] Failed to load resource: Request header field User-Agent is not allowed by Access-Control-Allow-Headers. (query, line 0)

On MacOS Desktop Chrome the User-Agent looks normal: User-Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/122.0.0.0 Safari/537.36

[AbakirH]

I have this same issue, with my app being deployed online using firebase.

My user agent being set on mac os safari is User-Agent: @pinecone-database/pinecone v2.1.1; lang=typescript

[austin-denoble]

Hey folks, apologies for the delayed response on this, and thank you for filing.

Currently, the TypeScript SDK is intended to be used from the server context, which is why we're applying User-Agent headers to outgoing requests. It's a security concern to use the TypeScript SDK from within the browser where your API key is exposed, and can be easily extracted from source by 3rd parties giving them read/write access to your database.

We strongly recommend against using the TypeScript SDK from within the browser context, and moving relevant code to a server or edge function. If you have publicly deployed browser code which uses the SDK in this way we recommend rotating your API keys.