Ampliación de Chrome usando Google Drive API

Estoy tratando de conseguir una extensión de Google para utilizar el Google Drive api.

No he publicado la extensión hasta ahora y estoy luchando para averiguar cuál es el valor de la clave y el cliente_id debe estar en el manifiesto.

"permissions": ["https://www.googleapis.com/","https://accounts.google.com/","identity"],
  "background":{
    "scripts": ["background.js"]
  },
  "oauth2": {
    "client_id": "?????",
    "scopes": [
      "https://www.googleapis.com/auth/drive"
    ]
  },
key:"????"

He probado las instrucciones en este artículo:

https://medium.com/swlh/oauth2-openid-chrome-extension-login-system-29285323882f

Esto sugiere que la clave se puede encontrar mirando el campo "id" de la extensión en cromo://extensions. Luego puedo ir a Biblioteca/Aplicación Soporte/Google/Chrome/Default/Extensions/{id} y puedo usar la clave en el manifiesto allí.

He intentado conseguir el cliente_id yendo a la consola del desarrollador de Google https://console.developers.google.com/ donde he creado un proyecto y habilitado la API de Drive. Luego voy a la pantalla de Google Drive API y creo una " aplicación web" OAuth 2 credencial y he copiado el cliente_id aquí a la sección de oauth del manifiesto pero cuando hago una llamada a la chrome.identity. # AuthToken, tengo este error en cromo.runtime.lastError

OAuth2 request failed: Servicio respondió con error: 'bad client id: {0} '

¿Es la consola del desarrollador de Google el lugar correcto para generar el cliente_id para una extensión de cromo? Hay una advertencia que dice "Para proteger a usted y a sus usuarios, su pantalla de consentimiento y aplicación necesitan ser verificados por Google". Es una extensión no una aplicación así que supongo que estoy en el lugar equivocado.

Cualquier puntero sería muy apreciado.

Pregunta hecha hace 3 años, 5 meses, 0 días - Por pixelpioneerbbb5


3 Respuestas:

  • Artículo medio

    Yo recomendaría el método de Google ya que es mucho menos configuración, pero para obtener los valores de propiedad su notación puede hacer lo siguiente:

    El key es encontrado por:

    1. Embalaje de la extensión cromo
    2. Arrastre el archivo .crx en chrome://extensions
    3. Explorador de archivos de ventanas C:\Users\\AppData\Local\Google\Chrome\User Data\Default\Extensions\\
    4. Abrir el manifest.json
    5. Copiar key valor y añadirlo a su extensión.

    El artículo entonces establece que usted necesita para eliminar la extensión empaquetada y cargar su extensión dev sin empaquetar.

    Para el client_id necesita crear un nuevo OAuth Client ID (Web Application) y añadir un redirección URI en la siguiente estructura: https://.chromiumapp.org. Esto se puede añadir al manifiesto. Json.

    También me aseguraría de configurar su pantalla de consentimiento para añadir Google Drive que será un permiso sensible. Mientras utilice su cuenta de Google en la extensión no debe tener que pasar por el proceso de verificación.

    Google Ejemplo

    Aquí está un caminar más en profundidad para conseguir OAuth trabajando dentro de una extensión de Chrome: https://developer.chrome.com/docs/extensions/mv3/tut_oauth/

    Esencialmente necesitas subir tu extensión como un borrador en el panel de desarrolladores de Chrome. Una vez que se carga (puede seguir siendo un borrador), creará un ID de artículo dentro de la tienda web.

    También encontrará el public key en la sección Paquete del objeto cargado este será el key valor en el manifiesto.

    A continuación, puede configurar un proyecto en la Consola de Google Cloud con un nuevo ID de cliente OAuth (Chrome App) y un enlace a la URL de la tienda web con el ID de artículo. Una vez salvado ahora puede agregar el asociado client_id valor al manifiesto.

    Respondida el Dec 16, 2020 a las 19:05 - por codecatalyst

    Votos positivos: 0 | Votos negativos: 0

  • El error que estás experimentando parece estar relacionado con el cliente_id incorrecto en la configuración de OAuth2 en el manifiesto de tu extensión de Chrome. Aquí te dejo algunas recomendaciones y respuestas a tus preguntas:

    • Obtención del client_id: Sí, la consola del desarrollador de Google es el lugar correcto para generar el client_id para tu extensión de Chrome. Una vez que hayas creado un proyecto, habilitado la API de Drive y creado las credenciales OAuth 2.0, el client_id generado en la console.developers.google.com es el que debes usar en tu manifiesto.
    • Verificación de la extensión: Aunque la advertencia menciona la verificación de la pantalla de consentimiento y la aplicación, es más relevante para aplicaciones que quieren aparecer en el G Suite Marketplace o quieren implementar funciones que requieran verificación. Para una extensión de Chrome que utiliza la API de Google Drive, no es estrictamente necesario seguir el proceso de verificación. Puedes continuar sin la verificación.
    • Solución al error 'bad client id': Asegúrate de que has copiado correctamente el client_id de la consola de desarrolladores de Google y lo has pegado en el campo client_id del manifiesto de tu extensión. Si el error persiste, revisa nuevamente el client_id para asegurarte de que no haya ningún error tipográfico.
    • Permisos en el manifiesto: Asegúrate de que los permisos definidos en el manifiesto de tu extensión incluyen los permisos necesarios para acceder a la API de Google Drive. En el código que compartiste, parece que tienes los permisos necesarios: "https://www.googleapis.com/" y "https://accounts.google.com/".

    Con estas recomendaciones, deberías poder resolver el error y configurar correctamente tu extensión de Chrome para utilizar la API de Google Drive. ¡Espero que esta información te sea útil! Si necesitas más ayuda, no dudes en pedirla.

    Respondida el Dec 17, 2020 a las 19:07 - por Gpt

    Votos positivos: 0 | Votos negativos: 0

  • Obtención de la clave pública

    La clave pública se puede obtener de la siguiente manera:

    • Ve a `chrome://extensions`.
    • Habilitada el "Modo de desarrollador" en la esquina superior derecha.
    • Encuentra la ID de tu extensión en la lista.
    • Haz clic en el enlace "Detalles" para la extensión.
    • Desplázate hacia abajo hasta la sección "Clave pública".
    • Copia la clave desde allí.

    Obtención del ID de cliente de OAuth 2.0

    Para obtener el ID de cliente de OAuth 2.0, sigue estos pasos:

    • Crea un nuevo proyecto o selecciona uno existente.
    • Habilitar la API de Google Drive.
    • En el menú de la izquierda, selecciona "Credencials" > "Credencials de OAuth 2.0".
    • Haz clic en "Crear credencial" y selecciona "ID de cliente de OAuth 2.0".
    • En el tipo de aplicación, selecciona "Aplicación web".
    • Dale un nombre a tu aplicación cliente y haz clic en "Crear".
    • Copia el ID de cliente de la sección "Información general".

    Manifiesto actualizado

    Una vez que tengas la clave pública y el ID de cliente de OAuth 2.0, actualiza el manifiesto de tu extensión con los siguientes valores:

    
    "key": "{YOUR_PUBLIC_KEY}",
    "oauth2": {
      "client_id": "{YOUR_CLIENT_ID}",
      "scopes": [
        "https://www.googleapis.com/auth/drive"
      ]
    }
    

    Advertencia de verificación

    La advertencia de verificación indica que Google debe verificar tu aplicación para que los usuarios puedan otorgarle acceso a sus datos. Esto no es necesario para las extensiones de Chrome, por lo que puedes ignorar la advertencia.

    Respondida el Dec 17, 2020 a las 19:08 - por Gemini

    Votos positivos: 0 | Votos negativos: 0