Allow user to generate their access token from frontend #296 #298

Open
Mergan wants to merge 1 commit from Mergan/pleroma-fe:develop into develop
3 changed files with 109 additions and 1 deletions

View file

@ -2,6 +2,7 @@ import ProgressButton from 'src/components/progress_button/progress_button.vue'
import Checkbox from 'src/components/checkbox/checkbox.vue'
import Mfa from './mfa.vue'
import localeService from 'src/services/locale/locale.service.js'
import oauth from 'src/services/new_api/oauth.js'
const SecurityTab = {
data () {
@ -24,7 +25,15 @@ const SecurityTab = {
listAliasesError: false,
addAliasTarget: '',
addedAlias: false,
addAliasError: false
addAliasError: false,
scopes: {
read: true,
write: false,
follow: false
},
clientId: '',
clientSecret: '',
accessToken: '',
}
},
created () {
@ -149,6 +158,49 @@ const SecurityTab = {
this.$store.dispatch('logout')
this.$router.replace('/')
},
generateAuthentication () {
const url = `${this.$store.state.instance.server}/api/v1/apps`
const form = new window.FormData()
form.append('client_name', this.generateTokenAppName)
form.append('redirect_uris', 'urn:ietf:wg:oauth:2.0:oob')
form.append('scopes', Object.keys(this.scopes)
.filter((key) => this.scopes[key] === true)
.join(' ')
)
return window.fetch(url, {
method: 'POST',
body: form
})
.then((data) => data.json())
.then((app) => ({ clientId: app.client_id, clientSecret: app.client_secret }))
.then((app) => this.$store.commit('setClientData', app) || app)
.then((app) => {
const authUrl = `${this.$store.state.instance.server}/oauth/authorize?client_id=${app.clientId}&response_type=code&redirect_uri=urn:ietf:wg:oauth:2.0:oob&scope=${encodeURIComponent(
form.get('scopes')
)}`;
window.open(authUrl, '_blank', 'width=500,height=800');
this.clientId = app.clientId
this.clientSecret = app.clientSecret
});
},
generateToken () {
if (!this.clientId || !this.clientSecret) {
return
}
oauth.getToken({
clientId: this.clientId,
clientSecret: this.clientSecret,
instance: this.$store.state.instance.server,
code: this.inputToken
}).then((tokenData) => {
this.$store.dispatch('fetchTokens')
this.accessToken = tokenData.access_token
})
},
revokeToken (id) {
if (window.confirm(`${this.$i18n.t('settings.revoke_token')}?`)) {
this.$store.dispatch('revokeToken', id)

View file

@ -101,6 +101,55 @@
</tr>
</tbody>
</table>
<h3>{{ $t('settings.generate_authentication') }}</h3>
<div>
<p>{{ $t('settings.client_name') }}</p>
<input
v-model="generateTokenAppName"
type="text"
>
</div>
<div>
<p>{{ $t('settings.scopes') }}</p>
<div
v-for="scope in Object.keys(scopes)"
:key="scope"
>
<Checkbox
:model-value="scopes[scope]"
@update:modelValue="scopes[scope] = $event"
>
{{ scope }}
</Checkbox>
</div>
</div>
<button
class="btn button-default"
@click="generateAuthentication"
>
{{ $t('settings.authenticate') }}
</button>
<div>
<p>{{ $t('settings.input_token') }}</p>
<input
v-model="inputToken"
type="text"
>
</div>
<button
class="btn button-default"
@click="generateToken"
>
{{ $t('settings.generate_token') }}
</button>
<div>
<p>{{ $t('settings.access_token') }}</p>
<input
v-model="accessToken"
type="text"
readonly
>
</div>
</div>
<mfa />

View file

@ -455,6 +455,7 @@
},
"settings": {
"accent": "Accent",
"access_token": "Access token",
"account_alias": "Account aliases",
"account_alias_table_head": "Alias",
"account_backup": "Account backup",
@ -471,6 +472,7 @@
"app_name": "App name",
"attachmentRadius": "Attachments",
"attachments": "Attachments",
"authenticate": "Generate authentication token",
"autohide_floating_post_button": "Automatically hide New Post button (mobile)",
"avatar": "Avatar",
"avatarAltRadius": "Avatars (notifications)",
@ -499,6 +501,7 @@
"changed_password": "Password changed successfully!",
"chatMessageRadius": "Chat message",
"checkboxRadius": "Checkboxes",
"client_name": "App name",
"collapse_subject": "Collapse posts with content warnings",
"columns": "Columns",
"composing": "Composing",
@ -561,6 +564,8 @@
"foreground": "Foreground",
"fun": "Fun",
"general": "General",
"generate_authentication": "Generate authentication token",
"generate_token": "Generate token",
"greentext": "Meme arrows",
"hide_all_muted_posts": "Hide muted posts",
"hide_attachments_in_convo": "Hide attachments in conversations",
@ -590,6 +595,7 @@
"import_mutes_from_a_csv_file": "Import mutes from a csv file",
"import_theme": "Load preset",
"inputRadius": "Input fields",
"input_token": "Enter the generated Token Code after authentication",
"instance_default": "(default: {value})",
"instance_default_simple": "(default)",
"interface": "Interface",
@ -717,6 +723,7 @@
"save": "Save changes",
"saving_err": "Error saving settings",
"saving_ok": "Settings saved",
"scopes": "Scope permissions",
"scope_copy": "Copy scope when replying (DMs are always copied)",
"search_user_to_block": "Search whom you want to block",
"search_user_to_mute": "Search whom you want to mute",