Google People API空Referer报错：已在云控制台设置仍异常求助

Hey there, let's work through this frustrating empty Referer issue you're facing with the Google People API on your App Engine app. Since it was working before and suddenly broke, we'll cover configuration checks, code fixes, and potential environment changes that might be causing this.

1. Double-Check Your Cloud Console Referer Configuration #

First, let's rule out any misconfigurations in the Google Cloud Console—sometimes settings can get altered accidentally, or take time to propagate:

• Navigate to APIs & Services > Credentials and find the API key you're using for the People API.
• Verify the HTTP referrers (web sites) restrictions include your full App Engine domain(s), formatted correctly:
  • For default App Engine domains: https://[your-project-id].appspot.com/*
  • For custom domains: https://your-custom-domain.com/*
• Ensure you haven't missed the https:// prefix or the trailing * wildcard (this is a common mistake!). Also, note that changes to these restrictions can take 5-10 minutes to take effect globally.

2. Manually Add the Referer Header to gapi Requests #

If the console configuration looks solid, the issue might be that the gapi.js library isn't automatically sending the Referer header (especially in SPAs or with certain routing setups). Here's how to fix this:

Option 1: Add Headers to Individual Requests #

When making direct API calls with gapi.client.request, explicitly include the Referer in the request headers:

gapi.client.request({
  path: '/v1/people/me',
  method: 'GET',
  headers: {
    'Referer': window.location.origin + '/' // Matches your App Engine domain
  }
}).then(response => {
  // Handle successful response
  console.log('User data:', response.result);
}).catch(error => {
  console.error('API Error:', error);
});

Option 2: Set Global Headers for All gapi Requests #

If you're using pre-built People API methods (like gapi.client.people.people.get), set a global Referer header after initializing gapi:

function initGapi() {
  gapi.client.setApiKey('YOUR_API_KEY');
  // Add global Referer header to all subsequent requests
  gapi.client.request.addGlobalHeaders({
    'Referer': window.location.origin + '/'
  });
  // Load the People API client
  gapi.client.load('people', 'v1', () => {
    // Your API calls here
  });
}

3. Investigate Why It Suddenly Stopped Working #

Since the feature was functional before, consider these recent changes that could trigger the issue:

• gapi.js Version Updates: If you're using an unversioned script tag (e.g., <script src="https://apis.google.com/js/api.js">), Google might have rolled out an update that changed Referer handling. Try locking to a stable version, like <script src="https://apis.google.com/js/api.js?v=1.1" async defer></script>.
• App Engine Configuration Changes: Did you enable HTTPS enforcement, add a CDN, or modify your app's routing? These can alter or strip the Referer header. For example, if you switched from HTTP to HTTPS but your console restrictions still list HTTP domains, that would cause a mismatch.
• Browser Privacy Updates: Some modern browsers or privacy extensions block Referer headers by default in certain contexts. Test your app in a clean browser session (no extensions) to rule this out.

4. Debug with Browser DevTools #

To confirm exactly what's happening with your requests:

1. Open your browser's DevTools (F12) and go to the Network tab.
2. Trigger the API call that throws the error.
3. Find the People API request (look for paths starting with /v1/people/), click on it, and check the Request Headers section.
   • If the Referer header is missing: The issue is on the frontend—your code isn't sending it.
   • If the Referer is present but doesn't match your console restrictions: Adjust your console rules to match the actual header value.

内容的提问来源于stack exchange，提问作者Yvonne Aburrow