Я работал над созданием приложения twitter emu и пытался получить токен доступа пользователя и секрет токена доступа для публикации твитов. Мне удалось получить Twitter access_token и access_token_secret в моем приложении express. но всплывающее окно не закрывается, и ответ JSON от моего express приложения не возвращается клиенту. Ответ JSON отображается во всплывающем окне (http://127.0.0.1: 4000 / auth / twitter / callback? Oauth_token = xxxxxxxxxx & oauth_verifier = xxxxxxxxxxxxxxxx ), но клиент не отвечает и всплывающее окно не закрывается. Ответ должен быть возвращен на http://127.0.0.1: 8080 или http://localhost: 8080
Я отредактировал пример сервера. js of vue -authenticate, чтобы получить access_token и accss_token_secret потому что мне не нужно сохранять токен запроса Twitter. Помогите, пожалуйста, как я могу получить ответ JSON обратно своему клиенту.
Ma c OS10.15.4
Chrome: 83.0 .4103.61
vue: 2.6.12
URL-адрес клиентского приложения: http://localhost:8080/#/auth/OpenAuth
, npm run dev
URL-адрес приложения express4: http://127.0.0.1:4000/auth/twitter
и http://127.0.0.1:4000/auth/twitter/callback
URL-адрес обратного вызова приложения Twitter ( на сайте разработчика Twitter) установлен как http://127.0.0.1:4000/auth/twitter/callback
Вот это serever. js Я изменил аутентификацию twitter, как показано ниже.
Я добавил функцию обратного вызова для twitter. первая часть для токена запроса.
function twitterAuth(req, res) {
if (!req.body.oauth_token) {
oauthService.getOAuthRequestToken({ oauth_callback: req.body.redirectUri }, function (error, oauthToken, oauthTokenSecret, results) {
if (error) {
res.status(500).json(error)
} else {
// **** this response is not responded to the client too ***
res.json({
oauth_token: oauthToken,
oauth_token_secret: oauthTokenSecret
})
}
}
}
app.get('/auth/twitter/callback', function(req, res, next){
let oauth_token = req.query.oauth_token
let oauth_verifier = req.query.oauth_verifier
if (req.query.oauth_token) {
oauthService.getOAuthAccessToken(oauth_token, null, oauth_verifier, function (error, oauthAccessToken, oauthAccessTokenSecret, results) {
if (error) {
res.status(500).json(error)
} else {
var verifyCredentialsUrl = 'https://api.twitter.com/1.1/account/verify_credentials.json'
var parameters = {
oauth_consumer_key: config.auth.twitter.clientId,
oauth_token: oauthAccessToken,
oauth_nonce: ('vueauth-' + new Date().getTime()),
oauth_timestamp: timestamp.now(),
oauth_signature_method: 'HMAC-SHA1',
oauth_version: '1.0'
}
var signature = oauthSignature.generate('GET', verifyCredentialsUrl, parameters, config.auth.twitter.clientSecret, oauthAccessTokenSecret)
Axios.get('https://api.twitter.com/1.1/account/verify_credentials.json', {
headers: {
Authorization: 'OAuth ' +
'oauth_consumer_key="' + config.auth.twitter.clientId + '",' +
'oauth_token="' + oauthAccessToken + '",' +
'oauth_nonce="' + parameters.oauth_nonce + '",' +
'oauth_timestamp="' + parameters.oauth_timestamp + '",' +
'oauth_signature_method="HMAC-SHA1",'+
'oauth_version="1.0",' +
'oauth_signature="' + signature + '"'
}
}).then(function (response) {
console.log('FINISHED!!')
// *********
// This json is displayed onto the popup window and never sent back to the client function.
// *********
res.json({
access_token: oauthAccessToken,
access_token_secret: oauthAccessTokenSecret,
profile: response.data
})
}).catch(function (err) {
console.log(err.response.data.errors)
res.status(500).json(err.response.data.errors)
})
}
})
} else {
next(new Error("you're not supposed to be here."));
}
});
Код клиента здесь.
import Vue from 'vue'
import VueAxios from 'vue-axios'
import VueAuthenticate from 'vue-authenticate'
import axios from 'axios'
Vue.use(VueAxios, axios)
Vue.use(VueAuthenticate, {
tokenName: 'access_token',
baseUrl: 'http://127.0.0.1:4000', // Your API domain
providers: {
twitter: {
clientId: 'xxxxxxxxxxxxxxx',
url: '/auth/twitter',
redirectUri: 'http://127.0.0.1:4000/auth/twitter/callback'
}
}
})
export default {
methods: {
authenticate: function (provider) {
this.$auth.authenticate(provider).then(function (authResponse) {
// ****** not reached here *****
console.log('Auth Success!!')
console.log('Provider: ', provider)
console.log('authResponse: ', authResponse)
// Execute application logic after successful social authentication
})
}
}
}