[BB-1637] Pass the referer from the client to the YouTube API

Description

The changes introduced in https://github.com/edx/edx-platform/commit/3136b3ecd3bc0d375e8e3f47f850805dc19b70db moved the YouTube Data API call which was being made in the JavaScript code to a proxy API. Whenever the API calls were made from the client-side, the referer header was automatically set by the browser and with the move to a server-side API call, this is no longer the case. This causes the API calls using API keys requiring a referer (and often whitelisted to be allowed only from specific domains) to fail. Due to this, the courseware pages containing YouTube videos to show an alert message stating

You have been logged out of your edX account. Click Okay to log in again now. Click Cancel to stay on this page (you must log in again to save your work).

In such scenarios, a warning message is logged in the browser console and also in the LMS logs.

Below is an example message from the LMS logs

```
[views.py:301] - YouTube API request failed with status code=403 - Error message is={
"error": {
"errors": [
{
"domain": "usageLimits",
"reason": "ipRefererBlocked",
"message": "The request did not specify any referer. Please ensure that the client is sending referer or use the API Console to remove the referer restrictions.",
"extendedHelp": "https://console.developers.google.com/apis/credentials?project=XXXXXXX"
}
],
"code": 403,
"message": "The request did not specify any referer. Please ensure that the client is sending referer or use the API Console to remove the referer restrictions."

```

This PR fixes this issue by passing the referer header from the client, when available, to the server-side API call.

*JIRA tickets*: None

*Dependencies*: None

*Sandbox URL*: TBD - sandbox is being provisioned.

*Merge deadline*: None

*Testing instructions*:

  • Visit the Google Developers Console at https://developers.google.com. Log in to an existing account or create a new Google Developer account.

  • Create a new project in the Google Developers Console:
    https://console.developers.google.com/

  • Go to the APIs overview section and click the + Enable API
    button.

  • Select YouTube Data API, then click the > Enable button.

  • Click the Create Credentials button to add API credentials to your
    project. Look for the following text: "If you wish you can skip this
    step and create an API key, client ID, or service account" and click
    the API key link.

  • Enter a recognizable name, and select *HTTP referrers (web sites)
    under Key restriction. Enter appropriate wildcard pattern to only
    and allow requests from the hostname for your edxapp instance. E.g.,
    if the instance URL is www.abc.com, allow requests from:
    .abc.com/

  • Copy the generate access key and set it to the
    EDXAPP_YOUTUBE_API_KEY variable and deploy the instance without this fix.

  • Visit a courseware page with a YouTube video. The error condition mentioned above in the description occurs.

  • Apply the fix in this PR, restart the LMS.

  • Visit the same courseware page with a YouTube video.

  • Verify that it works okay and there are no error conditions or warning messages any more.

*Reviewers*

  • [ ] @viadanna

  • [ ] edX reviewer[s] TBD

Status

Assignee

David Ormsbee

Reporter

Open Source Pull Request Bot

Labels

Contributor Name

Guruprasad Lakshmi Narayanan

Repo

edx/edx-platform

Customer

Epic Link

None

OSCM Assignee

None

Priority

Unset
Configure