SECURITY WARNING: Please check this setup for a secure way to add Magic: github.com/GalloDaSballo/strapi-magic-template/blob/main/extensions/users-permissions/config/policies/permissions.js If you had issues with strapi-plugin-magic try the latest version 0.9.0 You can add your Magic key via a .env file Use the key: MAGIC_KEY
Hi!!! I just tried the tutorial and everything works perfect but in the browser console i see some errors: Source Description auth.magic.link/v1/session/refresh:1 Failed to load resource: the server responded with a status of 400 () api.rollbar.com/api/1/item/:1 Failed to load resource: the server responded with a status of 429 () Is it normal¿? The problem is in "magic = new Magic(process.env.NEXT_PUBLIC_MAGIC_KEY);"
you prolly dont give a shit but does any of you know a method to log back into an instagram account..? I was stupid lost the password. I appreciate any tricks you can offer me
@Ali Cayden I really appreciate your reply. I found the site on google and im trying it out now. Takes quite some time so I will reply here later when my account password hopefully is recovered.
For Strapi v4 to get user's own orders, here is the syntax that worked for me: module.exports = createCoreController("api::order.order", ({ strapi }) => ({ async find(ctx) { const { user } = ctx.state; ctx.query = { ...ctx.query, filters: { user: user.id } }; const { data, meta } = await super.find(ctx); return { data, meta }; }, }));
This is an amazing tutorial, I typically don't have the patience to sit through long tutorials like these, but every minute felt relevant and had purpose. Extra points from me for adding the segments. Even though I'm using just React for my frontend with Strapi and Magic Link, this is still incredibly helpful. Thank you for the awesome work!
@@AlextheEntreprenerdHi Alex would you consider doing any more lower class JavaScript tutorials I’m quite unsure of the use cases it just seems like a lot of frameworks and calling them after installing and setting them up I come from other languages and have experimented a lot but would like to take JavaScript more serious. Thanks brother have a good day’
Great Tutorial, Alex is a brillant instructor, he not only shows you what to do, he actually explains what the code you are writing does. Very rare for a tutorial. I've learnt so much from this tut. A lot about Strapi and React/NextJS well worth the time to watch. I do have a question though. How difficult would it be to add Magic to authenticate Strapi users, i.e. Editors etc? I've also brought his course on Udemy, absolutely brilliant. I'm a 1/4 of the way through and already writing my own custom plugins. Very impressed
Thank you! I think authenticating the Admin side with Strapi should be fairly simple. However, the Strapi Team is about to launch an improvement which will make it even easier. I'd recommend waiting for it to launch: portal.productboard.com/strapi/1-roadmap/tabs/4-testing
im amazed how simple it is to customize strapi to your needs. on top of this project im connecting my app to my accounting software and sendgrid as an email service. will probably replace my current woocommerce project with this due to its flexibility.
What an amazing amount of value in this tutorial! Thank you! By the way, everything was going great until I attempted to install strapi-plugin-magic, and then npm spit back 44 identified vulnerabilities, two moderate and 42 high. Anyone else experience this problem and have a fix?
Authenticated requests is not working in Strapi v4 Despit adding Magic key via a .env file Using the key: MAGIC_KEY I'm sure this is not updated for latest version for strapi.
Getting this err @44:00 Error: A required parameter (slugs) was not provided as a string in getStaticPaths for /products/[slugs] getStaticProps in [slugs].js file
Huge thank you to Magic for sponsoring the video, try out the easiest way to add authentication to your app at: magic.link/? In this video you'll build a complete FullStack E-Commerce with Nextjs, Strapi, Magic, and Stripe with SEO in mind, Static Page Generation, an easy to use admin panel to manage products and orders, secure authentication and payments. If there is one video you watch going into 2021, make sure it's this one!
I am trying to extend the functionality by adding a form for an authenticated user to post some data. It isn`t working, as the app keeps re-renderring the AuthContext...
Thanks Alex .. You are good code writer .. can you redirect me to how make strapi plugin from scratch beacouse the strapi doc is not good about this part ?
Followed along until I had to wait for an email for authorization that never came. Any idea why this could happen? I got the modal prompt but no authentication email in inbox. *Edit: the email showed up on my phone but not on desktop for some reason. I have a VPN on my phone. Can this be related?
Hey Alex! Love your tutorial! This is absolutely amazing. Really appreciate the time and effort you spent making this tutorial. Unfortunately, Strapi is not available in my residing country. Is it possible to do a tutorial using PayPal or some other software. Would really appreciate it!
Very nice tutorial. I'm aware that Magic adds security to this tutorial, but would you say that this tutorial would be secure enough for a live e-commerce, or just as a reference to learn building e-commerce? Or are there other security risks that needs to be accounted for that isn't covered with Strapi backend/Magic auth?
As far as I'm aware this implementation is secure: Secure handling of user session by Magic Secure verification of user being logged in via strapi-plugin-magic Secure sanitization of data as well as privacy via the custom controllers related to order.js Secure and compliant handling of payment via Stripe Checkout I always recommend customers to do their own research and hire a security expert, but as far as I'm concerned this is is really solid
In stripe instead of dummy card details I am entered the real card details, as I have added my account details to stripe, but when I click pay it throws error saying....your payment method requires further verification....how to fix it
I've never had this issue, it may be: 1) The card does require more verification (europe regulation are changing all the time) 2) you may be using a real card in the test version which you can't do
@@AlextheEntreprenerd no I have used live APIs not the test one......and in payment section of stripe it shows to that the payment need further authentication.....I think I need to try with other card
Hi there, nice video. Say for example I have tables for products and categories all set up and someone else clones the project. Do they get all the tables ?
Thanks for the tutorial! I learned a ton! My question is for an internal website that you only grant specified users to access, it is possible to implement this passwordless approach with dedicated emails?
Yes, but you can't statically generate the pages that you'd restrict to those emails. You would have to: 1) Create the list of emails (perhaps a single type in Strapi, or hardcode it as a constant) 2) Create a new policy checking that ctx.state.user.email is part of the list 3) Change the frontend to fetch the data only on the client side
@@AlextheEntreprenerd Thanks! I tried to add the condition in the context/AuthContext.js "const loginUser = async (email) => { try { const emails = ['xyz@gmail.com', 'abc@gmail.com']; // hardcoded email list if (emails.includes(email)) { // verify if the email is included in the list await magic.auth.loginWithMagicLink({ email }); setUser({ email }); router.push('/'); } //redirect to homepage else { alert('You are not an authorized user, please contact admin"); } } catch (err) { setUser(null); //if auth failed, set user to null } };" It seems working, is this ok?
You can manually trigger the check at any time, the "proper" way to set this up would be to set up webhooks between Stripe and Strapi, once a purchase is done Stripe will send the confirmation webhook to Strapi and Strapi can then update the status of the order just like we shown
Hello how are You, many thanks again for this excellent course. 😊😊 I have a question i want to add a cart i try but i don't know how to connect it with stripe, stripe don't take the total amount. I think i have to change something in backend but i'm very scared to do something wrong😭 do You i can do that without changing the code on the backend but just for the front, i just want that stripe collect the total price. Thank You for this course again is excellent
Very tough question to answer without any context. In this video I discuss all the steps I go through to ensure my installs are as safe as I can make them: ru-vid.com/video/%D0%B2%D0%B8%D0%B4%D0%B5%D0%BE-yMobhhCLl_I.html&ab_channel=AlextheEntreprenerd
Hi! Is it better to setup an API using Strapi or to develop your own taking advantage of Next JS api routes. Which approach do you recommend to use in which context?
Great course. Is there a "proper" way to serve up different "headers/footers" depending on whether the user is auth'd OR lets say we have "partner" items in our poducts and for those, we put a "partner logo" in the header.... how can this be done?
Alex, thanks for the tutorial. a quick question please. I am using Strapi for my blog, but how can I install Strapi in my Home Server please. I am using Plesk if you are familiar with it? thank you
Omg, does anyone care that the user can close the tab after making a payment, and he won't visit the success page, so the status will not update, however, he spent his money, nice tutorial man...
Most people will want to track their order, receive an email confirmation. Some people will mistype their email, having them verify their email ensure the email is valid. Some people will forget their password, using Magic avoids this issue. Every big e-commerce logs you in, for promotional, automation and for convenience for returning customers
Thanks very much for the video! What are the benefits of using Strapi instead of just creating your products in Stripe and sourcing the data directly with the Stripe API? Can you do more with the Strapi layer than you could with just the Stripe API?
With Stripe you have to: 1) Trust the person using the Stripe panel (some roles do exist) 2) You will incur many limitations in terms of what you can customize. Off the top of my head, limitations of Stripe's solution: Limited Coupon Usage No Dynamic Pricing You'll have a hard time figuring out how to deal with shipping fees Product + Shipping + Coupon is not handled intuitively Very small amount of fields that you can use (you can add extra metadata, but good luck having a non developer do that) I would use Stripe without Strapi for very small projects where I'm selling digital products, don't want to track almost anything and will allow downloads off of a webhook (zapier webhooking into an email or something like that)
@@AlextheEntreprenerd Thanks for the quick reply. Stripe does seem limited in what you can do and it probably is better just as a payment gateway and after playing around with it, I agree the system isn't very non-developer friendly. I can't even find the way to add variants of product items.
Amazing video Alex! I was wondering if there was a workaround to avoid the initial checking if the user is logged in or not. It can be confusing for users when they reload the website, the login button shows for x amount of seconds until the async check is finished. Thank you!
Hey Rods! You can store the username / email to be displayed on a cookie / localStorage. If magic says they're logged out, you can then delete that value and setUser(null)
GOOD Job! Is there a way to return the login user ID? From what I understand it is only included in the bank when making a request on the backend. hugs from Brazil
Hey man, love the tutorial but I have a problem, when I use the slug script it loads forever, it never ends up charging the page. I tried to hard code the value and followed step by step but it still doesnt work. Would be nice if you could perhaps give me a clue as to what is wrong? thanks man
Hi, Alex. Why I can't buy your course on Udemy. It say that it's private, that request is sent. But nothing happens. There's no response since I last tried this link and got this message. How to get access just to look at the course curriculum?
@@AlextheEntreprenerd I keep getting this error: There appears to be trouble with your network connection. Retrying... when I try to install using npx. Im using node version manager so I can use an earlier version
Hi Alex, Thanks for you effort to sharing knowledge. I have one question, Why need to added orders/confirm into config/routes.json? What situation we need to do this?
Hey Yong! You can customize config/routes.json to associate routes with controllers. Anytime you create a new controller, in order to expose it to the world, you need to add it in the routes file. Also, anytime you want to change the name of the routes, you have to do that in the routes file Does this answer your question?
@@AlextheEntreprenerd Cool. As another example for order controllers (create, findOne), why they don't added manually? i guess is it those handle by strapi(automatically generate). Because i did't catch it, why we added manually only in confirm function. =(
@@AhSoh7091 All "core" controllers, routes and services are automatically created for you by Strapi. See docs: strapi.io/documentation/developer-docs/latest/concepts/controllers.html#core-controllers
Hey Alex do you know a way to implement something like graphql subscriptions to strapi? I've seen they haven't implemented it yet to Strapi, you know a workaround ? By the way I really like your stuff :)
@AlextheEntreprenerd Hi Alex! Is there a way to use the permissions.js policy with other policies, like canOnlyUpdateHimself.js from your course? There seems to be a conflict. When using the permissions.js policy and magiclink, users can PUT to any user no matter the policy settings in strapi or custom policy added like canOnlyUpdateHimself.js.
I personally do not use canOnlyUpdateHimself The way I secure the app is by using a custom controller that forces the user to be the logged in one. If you have The Complete Strapi Course we go over this in the IG clone: www.udemy.com/course/the-complete-strapi-course/learn/lecture/20638716#overview
@@AlextheEntreprenerd I do have the course and just saw the video. But this is a different issue. In the youtube video, you are teaching how to add a user with Magic Link. Following your tutorial lets users with a bearer token CRUD any users. This is a huge security problem that doesn't exist in the normal strapi username/password auth.
@@AlextheEntreprenerd It seems like there is one piece missing for the permissions. I am able to stop PUT updates by checking if (ctx.state.user.id != ctx.params.id) in node_modules/strapi-plugin-users-permissions/controllers/user/api.js, but can NOT override this in the extension using extensions/users-permissions/controllers/user/api.js or in the api using api/user/api.js. I guess that the expectation of a video like this is that the new auth wouldn't change the user permissions behavior. And when you look at the code it seems to reference "await strapi.plugins["users-permissions"]." But then none of the user permissions actually work and Anyone with a bearer token could cause major damage. Further, magic.link references this tutorial on their site, which I'd guess takes security as a priority. Do you know how to resolve these permissions issues? Why doesn't the custom auth use the strapi user-permissons? I very much appreciate your feedback and making the tutorial! I think strapi and magic.link are really cool and want to use it with strapi, but have to solve these permissions first.
@@joshuaansell-mckinnon379 This sounds like a nuanced and complicated issue. I'm happy to help you at no cost but I'll need to do it over a screen share. This way you can show me: The setup The code The vulnerability If you want you can schedule a call with me here: calendly.com/alex-entreprenerd/15min
Has anyone geting this error when it is billing. error Error: Stripe: Argument "id" must be a string, but got: undefined (on API request to `GET /checkout/sessions/{id}`). Yeah it still work, why this error show up in backend terminal
I am having 401 status code(Invalid Token) everytime I make a request to /products or /orders with the bearer token. I am making request from Postman using Authorization type Bearer Token as shown in the video. Also, retrieved the token in AuthContext.js using magic.user.getIdToken() function. Can anyone help me with this please?
@@AlextheEntreprenerd I am guessing the problem is when i create a get request with /products it is not creating an account in strapi. This is why the authentication is failing. I am using "strapi-plugin-magic": "^0.3.2" and here's my permissions.js code gist.github.com/alrafiabdullah/013cda076b129ff215f24737aa7bb6a5 edit: the permissions of /products is set to public role(find, findone) and /orders to authenticated role(find, findone) postman request SS imgur.com/a/ftdY1db
Hello many thanks for this amazing video. I have just a problem with the integration of stripe, i have an error 500, stripe don't recognize the order i think. I search from long time 😂 the mistake i do😭 but i want to ask You. Many thanks for all
In order to help you I need you to send me the image with the error that is showing in the terminal. Can you upload to imgur.com/ and send me the link?
