Coder Social home page Coder Social logo

strapi's Introduction

@nuxtjs/strapi

Nuxt Strapi

npm version npm downloads License Nuxt Volta

Strapi module for Nuxt.

Features

  • Nuxt 3 ready
  • Strapi v3 + v4 compatible
  • Authentication support
  • RESTful methods
  • Handle errors with hooks
  • TypeScript support

📖  Read the documentation

If you want to use this module for Nuxt 2, check out the documentation of the v0 of the module: http://strapi-v0.nuxtjs.org/.

Development

  1. Clone this repository
  2. Install dependencies using yarn install or npm install
  3. Build module using yarn build or npm run build to build once
    • Use yarn build --stub or npm run build --stub during active development
  4. Start development server using yarn dev or npm run dev

License

MIT License

strapi's People

Contributors

acerspyro avatar atinux avatar benjamincanac avatar christophecvb avatar danielroe avatar dependabot[bot] avatar doseofted avatar flosciante avatar intevel avatar jiblett1000 avatar joelbqz avatar katerlouis avatar kuizuo avatar larbish avatar luckeedev avatar luke-z avatar nicolasbrondin avatar nkmnz avatar noopurphalak avatar pi0 avatar ram-you avatar rbrannath avatar renovate-bot avatar renovate[bot] avatar smarroufin avatar stafyniaksacha avatar stun3r avatar svenwesterlaken avatar tahul avatar tennox avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

strapi's Issues

TypeError: Cannot read property 'find' of undefined

Version

@nuxtjs/strapi: v0.3.0
nuxt: 2.14.12

Reproduction Link

When following the example EXACTLY as shown here with @nuxtjs/strapi tutorial here:
https://strapi.io/documentation/developer-docs/latest/getting-started/nuxt-js.html

The example worked perfectly with Axios and Fetch.

Steps to reproduce

Follow the above tutorial in a brand new Nuxt and Strapi install.

What is Expected?

Return the results from the rest API endpoint for the restaurants collection

What is actually happening?

Returns an error: "TypeError: Cannot read property 'find' of undefined"

Setting cookie options

Upon pushing to a staging server I get an issue that I did not get at localhost. The cookie saved gives me the following console warning:

Cookie “strapi_jwt” will be soon rejected because it has the “SameSite” attribute set to “None” or an invalid value, without the “secure” attribute. To know more about the “SameSite“ attribute, read https://developer.mozilla.org/docs/Web/HTTP/Headers/Set-Cookie/SameSite

How to change the value of SameSite in the cookie?

Problem with docker when using a reverse proxy

Version

@nuxtjs/strapi: v0.1.6
nuxt: v2.14.5

Steps to reproduce

I have a docker-compose with nuxt and strapi, on the top a reverse proxy that handle routing using Virtual hosts that use http://my.project.test for nuxt and http://api.my.project.test for strapi.

If I call on the client http://api.my.project.test everything is going ok.
If I made the same call on the server tries to connect to the 80 port instead of 1337

FetchError: request to http://api.my.project.test/users/me failed, reason: connect ECONNREFUSED xxx.xx.xx.xx:80
If into server I call to http://strapi:1337 everything is going ok, but the client is broken.

I read this is a common problem with docker, nuxt and strapi (you can look also at this: https://stackoverflow.com/a/55090981)

So debugging the source I checked the http-module. It should give you the opportunity to set both client and server url, but strapi-module set a unique url and with this line (https://github.com/nuxt-community/strapi-module/blob/c65a31cd5518f3387855a741a1dac7618958c93e/lib/plugin.js#L19) it override http-module settings.

What is Expected?

I expect to use the nuxt http: {} config (https://http.nuxtjs.org/api/#baseurl & https://http.nuxtjs.org/api/#browserbaseurl) or strapi module could proxy these settings.

What is actually happening?

In server mode, fetchUser is going to fail.

ERROR undefined on nodejs 14.15

Help pls
After updating the node from 12.x to 14.15, I cannot start the project, I tried to deploy a new project from the github, but I get the same error

ERROR  undefined                                                                                                                                                                       17:26:14  

 at fn (node_modules/ky/umd.js:321:0)
 at processTicksAndRejections (internal/process/task_queues.js:93:5)
 at async Ky._retry (node_modules/ky/umd.js:412:0)
 at async HTTP.module.exports../.nuxt/http.js.HTTP.<computed> [as get] (.nuxt/http.js:92:0)
 at async asyncData (index.vue:24:0)

Index.vue 24 code:

async asyncData({ $strapi }) {
    return {
      articles: await $strapi.find("articles", { _sort: "created_at:desc" }),
      homepage: await $strapi.find("homepage"),
      categories: await $strapi.find("categories"),
      global: await $strapi.find("global"),
    };
  },

E2E and unit tests

Is your feature request related to a problem? Please describe.

I believe that it is necessary to cover the available functionality with tests. Need to start by creating a Fixture and a standard e2e test and add unit tests.

Describe the solution you'd like

I want to help with this task and start by writing a base for future tests

Use findOne for other parameters than id?

Hello,

is there a way to call the findOne-method with other parameters than the id, for example with a slug?

In module-documentation https://strapi.nuxtjs.org/strapi#findoneentity-id is the findOne just with a fixed id.

In strapi-documentation is the findOne-call also with an object possible (https://strapi.io/documentation/developer-docs/latest/concepts/queries.html#api-reference).

That would be a great feature.

Thanks for some help with this!

Best regards,

Timo

Add an option to set an expiration of the JWT cookie

Is your feature request related to a problem? Please describe.

At the moment the JWT cookie is stored in the session, which means the users have to re-login everytime they open their browser.

It could be useful to allow to store the JWT cookie for a longer period of time.

Describe the solution you'd like

Add an option to the module to set the expiration of the JWT cookie.

What do you think?

Handling pagination

I'd like to get all results from a query rather than the default pagination of 100 results.

At the moment, my query looks like:

await this.$strapi.find('locations')

I've tried to integration a searchParam like:

await this.$strapi.find('locations', { limit: '-1' })

But that failed. What is the recommended way of getting all results using this module?

error error: invalid input syntax for integer: "[object Object]"

I run Strapi on Digital Ocean droplet with 1-click setup. Everything's left as default, just made the 'products' collection for testing purposes. File upload works on UI.

I get Error 500, "Internal server error" 😞
Command works absolutely perfect if thumbnail is null. (thumbnail is not required)

Took a look at the logs, server says: error error: invalid input syntax for integer: "[object Object]"

image (1)
image (2)

P.S: Spoke with Strapi guys, told me it might be a module issue. (not a code issue, not a Strapi issue.

Auth working OK, but queries returning 403

Hi,

I've been working for some days on a project and it basically does a couple things right now:

  • Login
  • Retrieve data from a collection and show it in a table

It was all working great, but since yesterday I get a 403 Forbidden message. I tought about auth not working well, but I get this trace from Strapi:

[2020-11-06T10:23:40.208Z] debug OPTIONS /auth/local (0 ms) 204
[2020-11-06T10:23:40.641Z] debug POST /auth/local (422 ms) 200
[2020-11-06T10:23:40.660Z] debug OPTIONS /users/me (1 ms) 204
[2020-11-06T10:23:40.715Z] debug GET /users/me (49 ms) 200
[2020-11-06T10:23:42.885Z] debug GET /devices (15 ms) 403
[2020-11-06T10:23:42.892Z] debug GET /devices/count (19 ms) 403
[2020-11-06T10:23:42.907Z] debug GET /devices?_limit=10&_start=0 (12 ms) 403

it seems auth is working but then I get a 403 forbidden when calling the devices endpoints. Same queries using Postman work just well:

[2020-11-06T10:29:48.071Z] debug POST /auth/local (103 ms) 200
[2020-11-06T10:29:51.901Z] debug GET /devices (41 ms) 200
[2020-11-06T10:29:55.013Z] debug GET /devices/count (26 ms) 200
[2020-11-06T10:30:00.022Z] debug GET /devices?_limit=10&_start=0 (35 ms) 200

I also tried using anonymous chrome window, in case something was getting catched, but I got exactly the same.

I've implemented auth using auth Nuxt module, following this tutorial: https://strapi.io/blog/strapi-authentication-in-nuxt-js

Any ideas on what can be happening?

Thanks!

Error: A webpage is slowing down your browser what would you like to do

Version

@nuxtjs/strapi: v0.1.6
nuxt: v2.14.0

Reproduction Link

I don't have one yet

Steps to reproduce

I have the following pages/routes in my setup:
login/index.vue - to log the user in
dashboard/index.vue - which can only be seen by logged-in users
register/onboarding.vue - which should be redirected to, if the registration process is incomplete

I have configured middleware/auth.js as follows to force the user to complete the registration process if registrationComplete is false:

export default function ({ redirect, $strapi }) {
  // default condition (example from https://strapi.nuxtjs.org/usage)
  if (!$strapi.user) {
    return redirect('/login')
  }

  // DEBUG
  console.log('$strapi.user.registrationComplete', $strapi.user.registrationComplete)

  // custom condition 
  if (!$strapi.user.registrationComplete) {
    return redirect('/register/onboarding')
  }
}

Then I use middleware: 'auth' on the dashboard/index.vue and register/onboarding.vue page.

What is Expected?

I expect to be redirected to the onboarding page if the users flag registrationComplete is false

What is actually happening?

I get an error from the browser: A webpage is slowing down your browser what would you like to do? Stop/Wait
Inside the browser console I can see from the debug line above that console.log('$strapi.user.registrationComplete', $strapi.user.registrationComplete) gets into an endless loop and is executed thousands of times!
If I remove my custom condition inside auth.js, it gets out of the endless loop. What is happening here?

$users.update('me', form) not working

Hello,

with strapi 3.1.4
and a postgress database

I'm not able to update users/me

I added users as a entity within nuxt config

 strapi: {
    entities: ['users'],
  },

then i want to change a single field called 'accounttype'

const form = {accounttype:2}
const user = await this.$strapi.$users.update('me', form)

Then i got this error:

] error error: invalid input syntax for type integer: "me"
    at Parser.parseErrorMessage (/Applications/projects/testapp/backend/node_modules/pg-protocol/dist/parser.js:278:15)
    at Parser.handlePacket (/Applications/projects/testapp/backend/node_modules/pg-protocol/dist/parser.js:126:29)
    at Parser.parse (/Applications/projects/testapp/backend/node_modules/pg-protocol/dist/parser.js:39:38)
    at Socket.<anonymous> (/Applications/projects/testapp/backend/node_modules/pg-protocol/dist/index.js:8:42)
    at Socket.emit (events.js:315:20)
    at Socket.EventEmitter.emit (domain.js:483:12)
    at addChunk (_stream_readable.js:295:12)
    at readableAddChunk (_stream_readable.js:271:9)
    at Socket.Readable.push (_stream_readable.js:212:10)
    at TCP.onStreamRead (internal/stream_base_commons.js:186:23)
From previous event:
    at Client_PG._query (/Applications/projects/testapp/backend/node_modules/knex/lib/dialects/postgres/index.js:234:12)
    at Client_PG.query (/Applications/projects/testapp/backend/node_modules/knex/lib/client.js:158:17)
    at Runner.query (/Applications/projects/testapp/backend/node_modules/knex/lib/runner.js:135:36)
    at /Applications/projects/testapp/backend/node_modules/knex/lib/runner.js:39:23
From previous event:
    at Runner.run (/Applications/projects/testapp/backend/node_modules/knex/lib/runner.js:25:16)
    at Builder.Target.then (/Applications/projects/testapp/backend/node_modules/knex/lib/interface.js:14:43)
    at processImmediate (internal/timers.js:456:21)
[2020-11-19T12:54:53.055Z] debug PUT /users/me (61 ms) 500

Right way to set up STRAPI_URL in .env

How do I use STRAPI_URL ? I have tried the following:

File .env:

STRAPI_URL="http://localhost:1337"

File .env.production:

STRAPI_URL="https://my-app.herokuapp.com/"

In nuxt.config.js I have first tried to set env property and the new runtime config:

env: {
  STRAPI_URL: process.env.STRAPI_URL || 'http://localhost:1337',
},

publicRuntimeConfig: {
  STRAPI_URL: process.env.STRAPI_URL,
},

Then I have also tried the url option:

strapi: {
  url: process.env.STRAPI_URL || 'http://localhost:1337',
},

It doesn't work, $strapi is always doing calls to localhost:1337.

Typescript support

What is Expected: No Error

What is happening

I wanted to use this module with nuxt, typescript and vue composition api but there are no type declarations for it, so I started writing my own, But still there is an error telling me that there is no $strapi on context when I want to use $strapi in a middleware.
The exact error:
{
"resource": "/project/middleware/auth.ts",
"owner": "typescript",
"code": "2339",
"severity": 8,
"message": "Property '$strapi' does not exist on type 'Context'.",
"source": "ts",
"startLineNumber": 4,
"startColumn": 29,
"endLineNumber": 4,
"endColumn": 36
}

I want to be able to use this module in a nuxt-typescript project without errors.

What I think would fix the error

I think rewriting the module in typescript or just providing @types folder would fix the issue.
I myself would be interested in helping.

My code

import { Middleware } from '@nuxt/types'

const auth: Middleware = ({ $strapi, redirect, route }) => {
  if (!$strapi.user) {
    return redirect(`/login?next=${route.path}`)
  }
}

export default auth

Property '$strapi' does not exist on type

Hi, I have a problem with $strapi in pages/index.vue. I already add @nuxtjs/strapi in nuxt.config.js modules but why I got this error...

Capture

Or

Capture2

Can you guys give me some advice? thank.

Support for NO SSR nuxt app

Is your feature request related to a problem? Please describe.

I'm developing an application without SRR and it's frustrating that every time the page is restarted I have to log in again

Describe the solution you'd like

Use localStorage and nuxtClientInit module

Authorization header not present in request object

Version

@nuxtjs/strapi:
v0.1.1

nuxt:
ex: v2.13.0

Steps to reproduce

  • Install @nuxt/strapi
  • On Strapi side create a user with a specific role
  • Login with this.$strapi.login() method
  • Try to update something that allowed for this role
  • Check the request in dev tools
  • 403 error response
  • Authorization header not present in request object

What is Expected?

  • Install @nuxt/strapi
  • On Strapi side create a user with a specific role
  • Login with this.$strapi.login() method
  • Try to update something that allowed for this role
  • 200 response
  • Authorization header present in the request object

What is actually happening?

For some reason, when updating an object in Strapi with a protected route, the authorization header not present in the request object. I can fix it manually set the header before the request.

Middlewares showing different things

Hi, I have a project with Auth0 as an auth provider. The redirect/callback works fine, the jwt is added as a cookie and everything. On the Login page, I can display the $strapi.user info.

The problem happens when I need to use the middleware:
I have two middlwwares:

  • One to tell me when the user is logged in, to show some secret pages (auth.js)
  • Another to tell me when the user is not logged, to redirect to login (authenticated.js)

image

I'm doing this because I have some public pages, like forgot-password and register, for example, that I don't want that someone that is already logged in can see.

The problem is:
After I pass the login flow, starts a war between that two middleware:
image

I know that the $strapi exists (and is not null) because I can see all the info on the login page. But what's happening with one telling me that the $strapi exists and another telling me otherwise?

Just to understand: the local (username/password) flow works flawlessly.

Proxy module

How do I use the proxy module with this module ? Do I need to manually set my STRAPI_URL env to the same as the nuxt project? this seems highly unconvienient. Is there a way for this module to expose the $http modules proxy and prefix options ?

Thanks! Love the module btw

Failing to make get requests in nuxt build

Version

@nuxtjs/strapi: 0.1.2
nuxt: 2.13.3

Reproduction Link

Steps to reproduce

run 'nuxt build && nuxt start' and go to localhost:3000 in the browser

What is Expected?

The data to display as it does in 'nuxt dev'

What is actually happening?

The data isn't being returned and no errors are being thrown. It appears that the module doesn't function on build.

User Data Lost on Refresh

Hello!

I am running a Nuxt project with Strapi backend, and am updating it to work with this new module. However, I am having issues managing the authentication flow.

The Issue

Logging in and navigating the app works fine, but since Nuxt is rendered server side, if I refresh the page the data stored in $strapi.user is lost.

Is there a correct way to implement this module to avoid this happening? Previous to using this module, I used a VueX store and cookies, and then used nuxtServerInit() to fetch the data from the Cookie and commit it to the user. WOndering if there is a way to avoid doing this.

GraphQL Fetch

Is your feature request related to a problem? Please describe.

I'm using Nuxt + Strapi on a medium-sized web application(I haven't used this module in any real project yet, but willing to). The issue I currently face is most of the time I'm using REST, but for some parts of the app a GraphQL query will do the job better(multiples queries in just 1 HTTP request for example), but making fetch/axios request to a GraphQL API without Apollo seems to require a lot of boilerplate.

Describe the solution you'd like

I would love to have a method to perform graphql queries like:

const data = await $strapi.graphql(query, vars);

Describe alternatives you've considered

const request = await this.$strapi.$http.$post('/graphql', {query, vars});
const {data} = await request.json();

The alternative seems a little bit verbose?

Additional context

Let me know what do you guys think, If you think this feature is good to have I could help with a PR.

Shouldn't login cookies be saving despite a refresh?

To log in to my site I've moved from an auth recipe to using the Nuxt strapi-module. After a refresh the cookie is still there but I am effectively logged out and get the following 2 console messages:

Cookie “strapi_jwt” has been rejected because it is already expired.

Cookie “strapi_jwt” will be soon rejected because it has the “SameSite” attribute set to “None” or an invalid value, without the “secure” attribute. To know more about the “SameSite“ attribute, read https://developer.mozilla.org/docs/Web/HTTP/Headers/Set-Cookie/SameSite

Now with v0.3 I've made some changes to the cookie setting:
expires: 365d
sameSite: Lax
secure: true
httpOnly: false

But nothing helps...

I notice that localStorage gets an item with a key of strapi_jwt. Its value contains "token" as a long hash, then "expires" as a date that looks like the moment of logging in and therefore already in the past. Is it this localStorage item that is effectively logging me out?

Anybody got any idea what I'm missing here?

Action Required: Fix Renovate Configuration

There is an error with this repository's Renovate configuration that needs to be fixed. As a precaution, Renovate will stop PRs until it is resolved.

Error type: undefined. Note: this is a nested preset so please contact the preset author if you are unable to fix it yourself.

User data cleared after page refresh

After reloading the page, some properties disappear from the user object, I don't understand what could be the reason
i will show a json from vue dev-tools
i added 3:
articles - relation
avatar - media
fav_game - text
1: after user login on profile page

user:Object
  articles:Array[2]
  avatar:Object
  blocked:null
  confirmed:true
  created_at:"2021-02-03T13:58:32.000Z"
  email:"[email protected]"
  fav_game:"World of Warcraft"
  id:1
  provider:"local"
  role:Object
  updated_at:"2021-02-05T04:32:06.000Z"
  username:"ERL"

2: after page reload

user:Object
  blocked:null
  confirmed:true
  created_at:"2021-02-03T13:58:32.000Z"
  email:"[email protected]"
  fav_game:"World of Warcraft"
  id:1
  provider:"local"
  role:Object
  updated_at:"2021-02-05T04:32:06.000Z"
  username:"ERL"

How to import GraphQL queries?

Hi, is it possible to import queries instead of write them directly into the HTTP request? something like:

import productsQuery from '~/queries/products.gql'
async asyncData({ $strapi }) {
	const products = await $strapi.graphql({ query: productsQuery })
	return { products }
}

instead of the documented method:

async asyncData({ $strapi }) {
	await $strapi.graphql({
		query: `	
			query {
				products {
        				...
      				}
    			}
		`
	});
}

In my case I'm getting HTTPError processTicksAndRejections

Mixed Content: HTTP/HTTPS Problem

Hi,

I'm deploying an Strapi backend and a NuxtJS app (SPA) using the strapi module to fetch data. Both services are served over Traefik through HTTPS.

Login seems to work fine, but then I see messages in the browser console showing this:

Mixed Content: The page at 'https://mydomain/' was loaded over HTTPS, but requested an insecure resource 'http://mydomain/devices/stats/status'. This request has been blocked; the content must be served over HTTPS

I've reviewed urls, but all are set using https. I'm making use of $strapi methods and $strapi.$http. Looking around, I've seen in the HTTP module the https options is set to false by default so I guess this module is sending http request instead of https ones.

Could that be the problem? Is there any way of pass the https: true option to the http module?

Thanks!

User auto login after logout and refresh several times

Version

@nuxtjs/strapi:
nuxt:

What is actually happening?

I'm building a site based on a tutorial on strapi.io. I use nuxtjs/strapi for authentication. Everything went well, but there is a problem:

  • If a guest register and login for the first time, when you logout, it will be logout completely (Nice!)
  • Now the guest login again, do something (example add items to the cart, which use vuex and cookie) then logout again. Still OK, token cleared.
  • Then he go back to a page, try to refresh. And now he is logged in.
    The recorded video: https://www.loom.com/share/7ccd742fa400416ab0fa0e31101484bf

fetchUser method doesn't work

Version

@nuxtjs/strapi: v0.1.0
nuxt: v2.13.0

Reproduction Link

https://github.com/nuxt-community/strapi-module/blob/master/lib/plugin.js#L88

Steps to reproduce

  • Install @nuxt/strapi
  • Log in console this.$strapi.user
  • Try to login withthis.$strapi.login() method
  • User object appears in console
  • Refresh the page
  • User undefined

What is Expected?

  • Install @nuxt/strapi
  • Log in console this.$strapi.user
  • Try to login withthis.$strapi.login() method
  • User object appears in console
  • Refresh the page
  • User still appears in console

What is actually happening?

In the library, you using fetchUser method, what calling this.getEntry('users', 'me') but it's not a function.
Code goes to catch block and calling this.clearToken()

Different cookie than jwt

Hi,

I was trying to pass an extra session token to the headers of every request. However, even if the Set-Cookie was there the @nust/strapi didn't store it at the cookie storage. I didn't find anything related to that at the docs. Can you help?

NuxtJs runtime error in ie11

Version

@nuxtjs/strapi: v0.1.6
nuxtjs: v2.14.0

Steps to reproduce

We created an empty nuxt project and we added @nuxtjs/strapi package.
Added also the necessary config to nuxt.config.js like...

  /*
  ** Nuxt.js modules
  */
  modules: [
    // Doc: https://axios.nuxtjs.org/usage
    '@nuxtjs/axios',
    // Doc: https://strapi.nuxtjs.org/
    '@nuxtjs/strapi',
    // 'nuxt-polyfill'
  ],
  strapi: {
    url: '<dataEnpointURL>',
    entities: ['categories', 'products']
  },

inside .vue files:

this.$strapi.find('products')

and run dev mode or prod to an ie11.

What is Expected?

To work properly

What is actually happening?

Console Error: SCRIPT1005: Expected '('
and cannot get any data or rendering issues are occurred because the data are used
into components as params.

Losing some data from User object after page refresh

Version

@nuxtjs/strapi: ^0.1.6
nuxt: ^2.14.0

Hey guys, hi there!
The problem persists, but in another way.
And maybe i'm not doing something well.

What is Expected?

The problem is next.
When i'm logging in, i have the next response for my $strapi.user:
image
U can see the structure that have user object.
Expected that after a page refresh, the user structure remains the same.

What is actually happening?

After a page refresh i get this structure using $strapi.user:
image
As u can see, there are some missing properties.

I hope u can help me with this one.
Thank you in advance <3

Per Session Authentication no longer possible

Version

@nuxtjs/strapi: v0.1.9
nuxt: v2.14.12

#87 has introduced a change that stores the JWT token in both a cookie and localstorage.
This has made it impossible to have a user's authentication expire at the end of the browser session, because it gets read back from localstorage even if the cookie has expired or been cleared.

Previously I was setting the cookie like this, allowing me to have a configurable remember me option:

const cookieParams: any = {
  secure: true,
}
if (this.rememberMe) {
  cookieParams.maxAge = 31536000 // 1 Year
}

// Manually set token so we can adjust params
this.$strapi.$http.setToken(response.jwt, 'Bearer')
this.$strapi.$cookies.set('strapi_jwt', response.jwt, cookieParams)

Localstorage should be opt-in, and better access to cookie params in this.$strapi.setToken per #85 and #70 would be good too.

Hooks don't work

Version

@nuxtjs/strapi: v0.1.7
nuxt: v2.14.6

Reproduction Link

Steps to reproduce

  1. Install and add strapi module to Nuxt.

  2. Create a plugin file

// plugins/strapi.js
export default ({ $strapi }) => {
  $strapi.hook('userUpdated', async () => {
    console.log('%%%%%%%%%% userUpdated %%%%%%%%%')
  })
}

Same issue with the error hook.

  1. run yarn dev

What is Expected?

Print %%%%%%%%%% userUpdated %%%%%%%%% in console on reload (because de fetchUser)

What is actually happening?

Is not calling the hook handler


-- Could be a bug with hookable

JWT Cookie reset after login redirect or reloading page

Hi there,
in the production env I have an issue related to the authorization.
After the login, cookie are set correctly, but after a login or a relod, the response header has a Set-Cookie with jwt key empty.

The app is served with Nginx under proxy. This is the configuration (https://nuxtjs.org/faq/nginx-proxy/)

server {
    listen          80;             # the port nginx is listening on
    server_name     your-domain;    # setup your domain here

    gzip            on;
    gzip_types      text/plain application/xml text/css application/javascript;
    gzip_min_length 1000;

    location / {
        expires $expires;

        proxy_redirect                      off;
        proxy_set_header Host               $host;
        proxy_set_header X-Real-IP          $remote_addr;
        proxy_set_header X-Forwarded-For    $proxy_add_x_forwarded_for;
        proxy_set_header X-Forwarded-Proto  $scheme;
        proxy_read_timeout          1m;
        proxy_connect_timeout       1m;
        proxy_pass                          http://127.0.0.1:3000; # set the address of the Node.js instance here
    }

    ...

}

The app is served with https.

And there is no particular configuration in nuxt.config.js file.

Any suggestion?
Thanks in advance

IE/Edge browser support issues

Version

@nuxtjs/strapi: 0.3.0
nuxt: 2.14.12

Steps to reproduce

Open a Nuxt-Strapi app in IE/Edge in either Development or Production mode.

What is Expected?

For polyfills to kick in.

What is actually happening?

The app breaks completely and the only thing that's working is navigation.

Console shows an error that 0: Expected identifier, string or number
The issues happens here on line 22:
image

Is the Strapi module supported on older browsers? This is crucial for my current project.

For production it shows the same but the script's minified.

Cannot read property 'get' of undefined (cookie)

After installed your module, i had got a fatal error "Cannot read property 'get' of undefined" with getToken method in .nuxt/strapi.js line 148 on all pages.

getToken () { return this.$cookies.get(TOKEN_KEY) }

I don't understand why do you retrieve token in constructor because to register we don't need a jwt-token.

Version

@nuxtjs/strapi: 0.1.7
nuxt: 2.14.6

Sending email from Nuxt site using the Strapi email plugin

Is it possible to?

I just need to send data from the contact form on the site to the administrative email. I don't want to create a separate service for this, especially since Strapy has his own solution. But I don't understand how to use it directly from the frontend.

As far as I can see, we do not have access to $strapi.plugins['email']... I can only create a collection like Messages. Then submit the new post to the collection from the contact form. And on the Strapi side create a trigger (idk how) for sending a letter when a new post created in this collection?

Am I thinking right? Maybe there is some simpler solution or a ready-made example of such an approach?

Login using OAuth Providers

Is your feature request related to a problem? Please describe.

Would be great to have the possibility to login with OAuth Providers such as Google or Github and then automatically store the JWT for future requests.

update("me") updated only first user (id:1)

When i use, all fine
async login() { this.error = null; try { await this.$strapi.login({ identifier: this.email, password: this.password, }); this.$store.commit("SET_USER", this.$strapi.user); this.$router.push("/"); } catch (e) { this.error = e.response.data.message[0].messages[0].message; } },
But when I reload the page or use the user updateMe method, the user state is updated to the first ID 1
async gameUpdate() { this.error = null; if(this.playGame.length >= 35) { this.playGame = this.playGame.substring(0,35); } try { let query = await this.$strapi.$users.update("me", { fav_game: this.playGame, }); this.$store.commit("SET_USER", query); this.edited = false; } catch (e) { this.error = "Error"; } },
that is, the user data with the first ID is transferred to the payload

User object is huge and slow to load if the user is prolific

Logging in is taking a long time, and I realize it's because the user object has contained within it all the content entries that user has made. I don't need them here.

Where is this set? Perhaps a toggle somewhere to exclude (or include) the user's authored content? Or perhaps this is something that can be set within Strapi. Heading over there to check...

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.