Can't get Yelp API working with client side code?

Question

I'm creating a React app with Firebase for basic backend functionality.

I'm trying to use the Yelp API but am always getting a MISSING_PARAMETER and CORS errors.

Here is my code:

import OAuth from 'oauth-1.0a';

const oauth = OAuth({
  consumer: {
    public: 'public',
    secret: 'secret'
  },
  signature_method: 'HMAC-SHA1'
});

const url = "https://api.yelp.com/v2/";

const token = {
  public: 'public',
  secret: 'secret'
};

class YelpWrapper {
  static prepareSearch(term, category) {
    const requestData = {
        url: url + "search/?term=" + term + "&category_filter=" + category + encodeURIComponent("&location=Los Angeles, CA"),
        method: "POST"
    };
    return {
      requestData: requestData,
      headers: oauth.toHeader(oauth.authorize(requestData, token))
    };
  }
}

export default YelpWrapper;

and this is called in

static addMemory(memory) {
    const { id, category, text, name } = memory;
    newMemoryRef(id).set(memory);

    const search = YelpWrapper.prepareSearch(name, category);
    const { url, method } = search.requestData;
    const { headers } = search;

    request({
      url: url,
      method: method,
      headers: headers
    }, (error, response, body) => {
      console.log(error);
      console.log(response);
      console.log(body);
    });
  }

Here is the missing parameter error I'm getting

{"error": {"text": "One or more parameters are missing in request", "id": "MISSING_PARAMETER", "field": "oauth_consumer_key"}}

Although when I print the headers I can see all the required headers defined in there, for some reason they don't appear in the Request Headers of Chrome Dev Tools. I think that's the reason, but I can't figure out why that is.