如何用React与Google API实现从数据库提交Google Reviews评论？

首先明确：Google没有提供直接代用户提交评论到Google Reviews的公开API。这是因为平台严格要求评论必须由真实用户自愿发起，以此保障评论的真实性和可信度，防止虚假评论滥用。

不过，官方提供了合规的替代方案：使用Google Business Profile API（原Google My Business API）生成评论邀请链接，引导用户主动跳转至Google Reviews页面完成评论提交，这是完全符合平台规则的做法。

前置准备 #

1. 登录Google Cloud控制台，创建项目并启用Google Business Profile API。
2. 创建OAuth 2.0客户端凭据，配置授权范围为https://www.googleapis.com/auth/business.manage，并设置允许的跳转域名（比如你的React项目域名）。
3. 确保你的商家已关联到Google Business Profile账户，且你拥有该账户的管理权限。

1. 集成Google OAuth认证 #

在React项目中使用@react-oauth/google快速实现Google登录，获取API调用所需的访问令牌：

npm install @react-oauth/google

组件示例：

import { GoogleLogin } from '@react-oauth/google';

const GoogleAuthComponent = () => {
  const handleLoginSuccess = (response) => {
    // 保存访问令牌到本地存储
    localStorage.setItem('google_access_token', response.access_token);
  };

  return (
    <GoogleLogin
      clientId="你的OAuth客户端ID"
      onSuccess={handleLoginSuccess}
      onError={() => console.error('Google登录失败')}
      scope="https://www.googleapis.com/auth/business.manage"
    />
  );
};

export default GoogleAuthComponent;

2. 调用API生成评论邀请链接 #

使用获取到的访问令牌，调用getReviewLink接口获取商家的评论邀请URL：

const fetchGoogleReviewLink = async () => {
  const accessToken = localStorage.getItem('google_access_token');
  const accountId = '你的商家账户ID'; // 可从Google Business Profile后台获取
  const locationId = '你的商家位置ID'; // 同上

  if (!accessToken) return null;

  try {
    const res = await fetch(
      `https://mybusiness.googleapis.com/v4/accounts/${accountId}/locations/${locationId}:getReviewLink`,
      {
        method: 'POST',
        headers: {
          'Authorization': `Bearer ${accessToken}`,
          'Content-Type': 'application/json'
        },
        body: JSON.stringify({})
      }
    );

    const data = await res.json();
    return data.reviewLink;
  } catch (err) {
    console.error('获取评论链接失败:', err);
    return null;
  }
};

3. 引导用户提交评论 #

在组件中调用上述函数，获取链接后提供跳转入口：

import { useState, useEffect } from 'react';

const ReviewInviteButton = () => {
  const [reviewLink, setReviewLink] = useState(null);

  useEffect(() => {
    fetchGoogleReviewLink().then(link => setReviewLink(link));
  }, []);

  if (!reviewLink) return <div>加载中...</div>;

  return (
    <a 
      href={reviewLink} 
      target="_blank" 
      rel="noopener noreferrer"
      style={{ padding: '8px 16px', backgroundColor: '#4285F4', color: 'white', borderRadius: '4px', textDecoration: 'none' }}
    >
      前往Google提交评论
    </a>
  );
};

export default ReviewInviteButton;

关键注意事项 #

• 绝对禁止任何代用户提交评论的操作，违反Google服务条款会导致账户封禁。
• API调用必须使用拥有商家管理权限的账户令牌，否则会返回权限错误。
• 测试时可使用Google Cloud的API Explorer验证接口调用是否正常。

内容的提问来源于stack exchange，提问作者Mitul Sheth