0

This is my JS code from LWC component.

import { LightningElement } from 'lwc';
const MY_URL = 'https://login.salesforce.com/services/oauth2/token';
const Data ='username=username.com&password=password&grant_type=password&client_id=3MVG9wt4IL4O5wvLJqYlIli4gRIGD1RyFRZnciIpY8pOnE.mDEfg8Hf.WMZM5X7JR83hX1F0i4OSwffdADfQZ&client_secret=8B8F9EA2796C23B499D6979A0EF4C97A8AF53F2C5791CE7734355317B2DBDB1DF01';
export default class GithubInfo extends LightningElement {
    user = {};
    myid;
    
    updateid(event){
        this.myid=event.target.value;
    }
    getGithubStats() {
        if(true) {
            this.user = {};
            fetch(MY_URL, {
                method:'POST',
                headers:{
                    'Content-Type': 'application/x-www-form-urlencoded',
                },
                body:Data
              })
            .then(response => {
                console.log(response);
                if(response.ok) {
                    return response.json();
                } else {
                    throw Error(response);
                }
            })
            .then(Userdata => {
                this.user = {
                    token: Userdata.access_token,
                    URL: Userdata.instance_url
                };
            })
            .catch(error => console.log(error))
        }
    }

}

I am getting error in browser console as "access to fetch at 'https://login.salesforce.com/services/oauth2/token' from origin 'https://companycom-6b-dev-ed.lightning.force.com' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. If an opaque response serves your needs, set the request's mode to 'no-cors' to fetch the resource with CORS disabled. aura_prod.js:80 POST https://login.salesforce.com/services/oauth2/token net::ERR_FAILED 200 (OK)".

I have included the url of org from I am makig api call in another orgs CORS. And even mentioned the 'https://login.salesforce.com' in trusted site and remote site setting.

1 Answer 1

0

The CORS error you're encountering is a common issue when making API calls from a web browser to a domain that is different from the one serving the web page. This is due to the browser's same-origin policy, which restricts web pages from requesting a domain other than the one that served the web page unless the server provides an explicit allowance using CORS headers.

Here are some steps you can take to resolve this issue:

  1. Check CORS Settings: Ensure that the Salesforce org you're making the API call to has the calling org's domain in its CORS allowlist. This is done in the Salesforce setup under Security > CORS.
  2. Use Named Credentials: Instead of making a direct API call from the LWC, consider using Named Credentials in Salesforce. This allows you to authenticate and make callouts to external services securely without exposing sensitive information in your JavaScript code.
  3. Apex Callout: Make the API call from an Apex class instead of directly from the LWC. Apex is not subject to the same-origin policy, so it can make callouts to other domains. You can then expose the Apex method to your LWC using the @AuraEnabled annotation.

For more detail, you can refer to Salesforce documentation on CORS and Calling APIs from LWC.

1
  • Actually I been able to do that from apex I just wanted to try using LWC. Mar 29 at 4:06

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .