Fetch API не удалось получить во время аутентификации, наряду с ошибкой CORS - PullRequest
Новая
       55

Fetch API не удалось получить во время аутентификации, наряду с ошибкой CORS

0 голосов
/ 10 января 2020

У меня есть кнопка, которая запускает выборку для моего API, использующего KOA и JWT. javascript для выборки, инициируемой при клике: 

<script>

        function loginButton(user, pass) {
            fetch('http://localhost:5454/api/login', {
                method: "post",
                headers: {
                    'Content-Type': "application/json"
                },
                body: JSON.stringify({
                    username: user,
                    password: pass
                })
            })
            .then( (response) => {
                console.log("Success")
            })
            .catch(e => console.log(e));
        }

    </script>

Код для моей аутентификации: 

router.post(`${BASE_URL}/login`, async (ctx) => {
const reqUsername = ctx.request.body.username
const reqPassword = ctx.request.body.password

const unauthorized = (ctx) => {
    ctx.status = 401
    ctx.body = {
        error: 'Invalid username or password'
    }
}

let attemptingUser
try {
    attemptingUser = await Employee.findOne({ where: { username: reqUsername }})
    if (attemptingUser != null && attemptingUser.password === reqPassword) {
        ctx.status = 200
        ctx.body = {
            username: attemptingUser.username,
            given_name: attemptingUser.given_name,
            role: attemptingUser.role,
            created_at: attemptingUser.createdAt,
            updated_at: attemptingUser.updatedAt,
        }

        const token = jwt.sign({ username: attemptingUser.username, role: attemptingUser.role }, SECRET)
        ctx.set("X-Auth", token)
    } else {
        unauthorized(ctx)
    }

} catch(err) {
    console.error(err)
    console.error(`Failed to find username: ${reqUsername}`)
    unauthorized(ctx)
}

})

Код для моего KOA Инициирование: 

    require('dotenv').config()
const Koa = require('koa')
const Router = require('koa-router')
const bodyParser = require('koa-bodyparser')
const baseRoutes = require('./routes')
const cors = require('@koa/cors');

const PORT = process.env.PORT || 8080

const app = new Koa()


app.use(bodyParser())
app.use(baseRoutes.routes())
app.use(cors());

app.listen(PORT, () => {
    console.log(`Server listening on ${PORT}`)
})

Я использую порт 8080 для моего http-сервера и порт 5454 для моего npm сервера. Я получаю Failed to Fetch в перехвате Fetch, а также ошибку CORS, связанную с отсутствием заголовка Access-Control-Allow-Origin в заголовке ответа. Я перепробовал несколько вещей и готов взглянуть на это новым взглядом, какие-либо советы?

Редактировать: я успешно получаю токен в заголовке X-Auth, но по какой-то причине это Я все еще выдаю ошибки, и я хотел бы разрешить их до того, как они выйдут из-под контроля.

...