JavaScript
JavaScriptでのTwitterログイン実装ガイド
11 分
twitterログイン はじめに このセクションでは、twitterログインをjavascriptプロジェクトに統合する方法を説明します。このステップバイステップガイドを完了すると、cloud codeにコードをアップロードする準備が整います。 このプロジェクトでは、新しくリリースされたバージョン3 1のparse serverを使用します。プロジェクトダッシュボードで、サーバー設定 > parse serverの管理(設定)に移動し、3 1 1を選択します。parse server 3 1 xへの移行に関する詳細は、 https //www back4app com/docs/advanced guides/parse server 3 を参照してください。 このプロジェクトのクラウドコードの構文が理解できない場合は、このガイドを参照してください。 前提条件 このチュートリアルを始めるには、次のものが必要です: back4appで作成されたアプリ。 詳細は、 https //www back4app com/docs/get started/new parse app を参照して、back4appでアプリを作成する方法を学んでください。 back4appアプリのサブドメインを設定する 詳細は、 https //www back4app com/docs/platform/activating web hosting を参照して、back4appでサブドメインを作成する方法を学んでください。 https //twitter com/ が必要で、 https //twitter com/i/flow/login?input flow data=%7b%22requested variant%22%3a%22eyjyzwrpcmvjdf9hznrlcl9sb2dpbii6imh0dhbzoi8vzgv2zwxvcgvylnr3axr0zxiuy29tl2vul3bvcnrhbc9wzxrpdglvbi9lc3nlbnrpywwvymfzawmtaw5mbyj9%22%7d を申請する必要があります。 1 新しいback4appアプリを作成する まず最初に、back4appに既存のアプリが作成されていることを確認する必要があります。ただし、新しいユーザーの場合は、 https //www back4app com/docs/get started/new parse app を確認して、アプリの作成方法を学ぶことができます。 2 アクセストークンを生成する プロジェクトでtwitterログインを機能させるためには、コンシューマキーとコンシューマシークレットが必要です。 アクセストークンキーを生成するには、twitterアプリが必要です。基本的に、2つのオプションがあります 既存のtwitterアプリがあり、それを編集したい場合は、 https //twitter com/i/flow/login?input flow data=%7b%22requested variant%22%3a%22eyjyzwrpcmvjdf9hznrlcl9sb2dpbii6imh0dhbzoi8vzgv2zwxvcgvylnr3axr0zxiuy29tl2vul2fwchmifq%3d%3d%22%7d にアクセスしてください。 新しいアプリを作成したい場合は、同じダッシュボードにアクセスできますが、承認された開発者アカウントが必要です。 ヒント 開発者アカウントのアクセスをリクエストしている間、いくつかの質問に答えるよう求められることがありますが、契約の条件に同意することを忘れないでください。 2 1 アプリの詳細を設定する このトピックでは、twitterアプリの認証情報を設定します。 このアプリケーションには webhosting を有効にする必要があることに注意し、webhostingについて詳しくは https //www back4app com/docs/platform/parse web hosting をご覧ください。 その後、 https //developer twitter com/en/apps に移動し、 アプリを作成する アプリを作成する を選択するか、既存のアプリを編集するには 詳細 詳細 > 編集 編集 > 詳細を編集 詳細を編集 を選択してください。 次の項目を記入してください アプリ名 アプリケーションの説明 このアプリがどのように使用されるか教えてください 「 ウェブサイトのurl 」はあなたの https //www back4app com/docs/platform/parse web hosting としてそのままにしておくことができ、 コールバックurl は https //www back4app com/docs/platform/parse web hosting + /twitter callback /twitter callback のようになります。以下のようになります 3 twitterの設定 twitter login for javascriptを使用するには、次の手順に従う必要があります back4appをtwitterアプリにリンクし、back4appアカウントにログインするには; アプリの サーバー設定 サーバー設定 をクリックします 次に、 設定 設定 をクリックします twitter login ブロックの。次のようになります 4 テンプレートを取得する githubリポジトリからテンプレートをダウンロードします。次のコマンドラインを使用して行うことができます curl lok https //github com/templates back4app/twitter login js/archive/master zip && unzip master zip 5 キーを置き換える 上記のプロジェクトをダウンロードした後、 /cloud/app js /cloud/app js ファイルを開き、ステップ2で生成されたキーで次の変数を置き換えます const back4appwebhostdomain = ' your back4app webhost domain your back4app webhost domain '; const consumer key = ' your consumer key your consumer key '; const consumer secret = ' your consumer secret your consumer secret '; 6 コードをback4appサーバーにアップロードする back4appでアプリをデプロイするには、コードをcloud codeにアップロードする必要があります。そのためには、以下の手順に従ってください アプリに移動して https //www back4app com/ をクリックします サーバー設定 サーバー設定 「cloud code」ブロックを見つけて 設定 設定 をクリックします。 ''cloud code''ブロックは次のようになります 3\ ファイルを選択 ファイルを選択 をクリックし、 index html index html によってインポートされたすべてのファイルを選択します。これらを public public に移動し、次に 保存 保存 をクリックします。以下のようになります 4\ あなたのファイルは次のようになります 7 完了です 上記のガイドに従った後は、作成したwebホスティングアドレスでブラウザを開くだけです。 何か助けが必要な場合や機能/リンクが動作しない場合は、チャットを通じて私たちのチームに連絡してください!