Logowanie do Facebooka i udostępnianie nie działa w rozszerzeniu Chrome z powodu domeny aplikacji

Question

Jestem nowy w tworzeniu rozszerzeń, więc proszę o zachowanie mnie. Próbuję utworzyć rozszerzenie, które udostępnia bieżący adres URL strony za pośrednictwem Facebooka. Postępowałem zgodnie z instrukcjami na stronie deweloperów Facebooka i utworzyłem projekt, ale nie wiem, co napisać jako domena aplikacji, ponieważ host lokalny działa, ale rozszerzenie chrome: // "id" nie działa.

Po kliknięciu przycisku Udostępnij pojawia się błąd "Nie można załadować adresu URL: domena tego adresu URL nie jest zawarta w domenach aplikacji. Aby móc załadować ten adres URL, dodaj wszystkie domeny i subdomeny aplikacji do Pole Domeny aplikacji w ustawieniach aplikacji. " Co mogę umieścić jako domenę aplikacji i adres URL?

Answer 1

Miałem ten sam problem. To jest moje rozwiązanie:

1. Włącz wbudowanej przeglądarce OAuth logowania w ustawieniach Facebook login (https://developers.facebook.com/apps/ -> wybierz swoją aplikację -> Dodaj produkt)
2. Wdrożenie ręcznie zalogować przepływu (https://developers.facebook.com/docs/facebook-login/manually-build-a-login-flow). Otwórz URL oauth w nowej karcie, nasłuchuj zmian, a następnie, gdy aktualizacja karty do strony powodzenia pobiera się z tokenu dostępu do url, zapisz token do przechowywania i usuń kartę.
3. użytkownika facebook graph api (https://developers.facebook.com/docs/graph-api)

Answer 2

Zastosowanie chrome.identity api, aby uniknąć problemu protokołu. Wygląda to tak:

let options = { 
    interactive: true, 
    url: 'https://www.facebook.com/dialog/oauth?' + 
     stringifyQuery(Object.assign({ 
     app_id: 'your app id here', 
     redirect_uri: `https://${chrome.runtime.id}.chromiumapp.org/provider_cb`, 
     response_type: 'token', 
     access_type: 'online', 
     })) 
    }; 

    chrome.identity.launchWebAuthFlow(options, function (redirectUri) { 
    if (chrome.runtime.lastError) { 
     callback(new Error((chrome.runtime.lastError as string))); 
     return; 
    } 
    const response = parseUrl(redirectUri); 
    access_token = response[`#access_token`]; 
    callback(null, access_token); 
    });