質問編集履歴

一部解決しました

2021/05/26 20:00

投稿

ryo24

スコア0

test CHANGED Viewed

File without changes

test CHANGED Viewed

@@ -1,8 +1,4 @@
 ### 前提・実現したいこと
-Next.jsにてdjango-allauthを用いて、ソーシャルログインを実装したい
-認証はToken認証ではなく、session認証(cookie)にて実装したいです。
@@ -10,252 +6,8 @@
-Docker上にてフロントはNext.js(127.0.0.1:3000)、バックエンドはDjango(127.0.0.1:8000)で開発を行っています。
-ソーシャルログインを実装するにあたり、django-allauthを用いてtwitter認証(http://127.0.0.1:8000/accounts/twitter/login/)を試みようとしています。
-今回Session認証を採用したいため、ひとまず127.0.0.1:3000でProxy(Express+http-proxy-middleware)を通して、twitterの認証画面を呼ぼうとするのですが、以下エラーが出て認証画面が出ないことが多々あります。(たまに意図通り認証画面を呼べたりする)
-http://127.0.0.1:3000/accounts/twitter/login/
-↓　　↑
-Proxy(Express+http-proxy-middleware)
-↓　　↑
-http://127.0.0.1:8000/accounts/twitter/login/(Django-allauth)
-↓　　↑★
-twitter
-・django-allauthのエラーが返ってきているので、127.0.0.1:3000→127.0.0.1:8000は（ひとまず）できてる
-・Next.js(http://127.0.0.1:3000)を経由せず直接http://127.0.0.1:8000/accounts/twitter/login/を叩くと、認証画面が返ってくる
-・django-allauthのソースコードをざっと見る限り、エラーの場合はtwitterからのレスポンス（★）が正常ではないため、エラーが出ているっぽい
-ので、http://127.0.0.1:3000から叩くにあたり、ほかに気づいていない問題点があると予想しているのですが、原因がわかっていません。
-解決策等わかる方いらっしゃったらご教授いただきたいです。
-```
-{'provider': 'twitter', 'code': 'unknown', 'exception': OAuthError('不正なレスポンスが返されたため、 "api.twitter.com" からリクエストトークンを取得できませんでした。')}
-```
 ### 該当のソースコード
-```
-■next.js
-export default function SignIn(){
- return(
----略---
-        <form>
-          <Button
-            href={http://127.0.0.1:3000/accounts/twitter/login/}
-          >
-          twitterでログイン
-          </Button>
-        </form>
-)
-}
-```
-```
-■server.js
-const express = require('express')
-const next = require('next')
-const { createProxyMiddleware } = require('http-proxy-middleware')
-const port = parseInt(process.env.PORT, 10) || 3000
-const dev = process.env.NODE_ENV !== 'production'
-const app = next({ dev })
-const handle = app.getRequestHandler()
-app.prepare().then(() => {
-  const server = express()
-  server.use('/accounts/twitter',createProxyMiddleware({
-    target: 'http://backend:8000/',  //dockerにあわせて127.0.0.1→backendに変更
-    changeOrigin: true
-  })
-  );
-  server.all('*', (req, res) => {
-    return handle(req, res)
-  })
-  server.listen(port, err => {
-    if (err) throw err
-    console.log(`> Ready on http://localhost:${port}`)
-  })
-})
-```
-```
-■docker-compose.yml
-version: '3'
-services:
-  db:
-    container_name: postgresql
-    image: postgres:11.2
-    volumes:
-      - django_data_volume:/var/lib/postgresql/data
-    environment:
-      POSTGRES_USER: postgres
-      POSTGRES_PASSWORD: postgres
-      POSTGRES_DB: test_db
-    ports:
-      - '5432:5432'
-  backend:
-    container_name: django-restapi
-    build:
-      context: ./
-      dockerfile: dockerfilePython
-    volumes:
-      - ./django-restapi:/code
-    command: sh -c "python test_app/manage.py runserver 0:8000"
-    ports:
-      - "8000:8000"
-    depends_on:
-      - db
-  frontend:
-    container_name: next.js
-    build:
-      context: ./
-      dockerfile: dockerfileNode
-    volumes:
-      - ./my-app:/code:cached
-      - /code/node_modules
-    command: sh -c "npm run dev"
-    ports:
-      - "3000:3000"
-    depends_on:
-      - backend
-volumes:
-  django_data_volume:
-```
 ### 補足情報（FW/ツールのバージョンなど）
-環境は以下です。
-・Windows10 Pro（WSL2）
-・Docker Desktop
-・images&FW etc
-node:14.15.1-alpine3.10
-next.js;10.2.0
-express: 4.17.1,
-python:3.7
-Django:2.1.7
-django-allauth; 0.44.0

・

2021/05/26 20:00

投稿

ryo24

スコア0

test CHANGED Viewed

File without changes

test CHANGED Viewed

@@ -56,7 +56,9 @@
 ### 該当のソースコード
+```
-```next.js
+■next.js
 export default function SignIn(){
@@ -86,7 +88,9 @@
+```
-```server.js
+■server.js
 const express = require('express')
@@ -146,7 +150,9 @@
+```
-```docker-compose.yml
+■docker-compose.yml
 version: '3'