|
1 | | -# generic-oauth |
| 1 | +# @particular./serverless-oauth |
| 2 | + |
| 3 | +[](https://www.npmjs.com/package/@particular./serverless-oauth) [](https://github.com/semantic-release/semantic-release) [](https://github.com/prettier/prettier) [](https://circleci.com/gh/uniquelyparticular/serverless-oauth) |
| 4 | + |
| 5 | +> 🎮 Minimal OAuth implementation using Serverless! |
| 6 | +
|
| 7 | +Built with [Micro](https://github.com/zeit/micro)! 🤩 |
| 8 | + |
| 9 | +## 🛠 Setup |
| 10 | + |
| 11 | +Both a [Shopify](https://shopify.com) _and_ [Firebase](https://firebase.google.com) account are needed for this to function _(NOTE: this is only temporary)_. |
| 12 | + |
| 13 | +Start ngrok (change ngrok port below from 3000 if going to run yarn dev on different port or if already in use) |
| 14 | + |
| 15 | +```bash |
| 16 | +ngrok http 3000 |
| 17 | +``` |
| 18 | + |
| 19 | +Make a note of the https `ngrok URL` provided. |
| 20 | + |
| 21 | +--- |
| 22 | + |
| 23 | +Create a `.env` at the project root with the following credentials: |
| 24 | + |
| 25 | +```dosini |
| 26 | +DEPLOYED_URI |
| 27 | +FIREBASE_API_KEY |
| 28 | +FIREBASE_PROJECT_ID |
| 29 | +SHOPIFY_OAUTH_SCOPES |
| 30 | +SHOPIFY_API_KEY |
| 31 | +SHOPIFY_API_SECRET |
| 32 | +``` |
| 33 | + |
| 34 | +--- |
| 35 | + |
| 36 | +`DEPLOYED_URI` should be set to your `ngrok URL` from above (ie. `https://312a9670.ngrok.io`) |
| 37 | + |
| 38 | +Open the [Firebase Console](https://console.firebase.google.com) to create a new Project (or you can use an existing one) to use for storing temporary nonce date. Click `Add Project`, enter anything in the `Project Name` field then click `Create Project`. When you receive the 'Your new project is ready' confirmation, click `Continue`. Under the 'Get started by adding Firebase to your app', click the icon for `Web` < /> and then in that popup you will find your configuration information to use for `FIREBASE_API_KEY` (apiKey) and `FIREBASE_PROJECT_ID` (projectId). |
| 39 | + |
| 40 | +--- |
| 41 | + |
| 42 | +`SHOPIFY_OAUTH_SCOPES` can be set to any of the following values: `read_products`,`read_product_listings`,`read_customers`,`write_customers`,`write_orders,write_draft_orders`,`write_shipping`,`write_checkouts`,`read_shopify_payments_disputes`,`unauthenticated_read_product_listings`,`unauthenticated_write_checkouts`,`unauthenticated_write_customers`. |
| 43 | + |
| 44 | +Navigate to your [Shopify Partner Dashboard](https://partners.shopify.com/<<PartnerId>>/apps)'s App section and clicking `Create App`. |
| 45 | + |
| 46 | +You can enter any value for `App Name`. |
| 47 | + |
| 48 | +In the `App URL` field, be sure to enter your `ngrok URL` (provided above) followed by `/auth` such that `App URL` looks something like `https://312a9670.ngrok.io/auth`. |
| 49 | + |
| 50 | +In the `Whitelisted redirection URL(s)` field, be sure to enter your `ngrok URL` (provided above) followed by `/auth/callback` such that `App URL` looks something like `https://312a9670.ngrok.io/auth/callback`. |
| 51 | + |
| 52 | +Click the `Create app` button to create your App Credentials and find your `SHOPIFY_API_KEY` and `SHOPIFY_API_SECRET`. |
| 53 | + |
| 54 | +## 📦 Package |
| 55 | + |
| 56 | +Run the following command to build the app |
| 57 | + |
| 58 | +```bash |
| 59 | +yarn install |
| 60 | +``` |
| 61 | + |
| 62 | +Start the development server |
| 63 | + |
| 64 | +```bash |
| 65 | +yarn dev |
| 66 | +``` |
| 67 | + |
| 68 | +The server will typically start on PORT `3000`. If not, you'll need to restart ngrok to point to whatever server port you've started here. |
| 69 | + |
| 70 | +## ⛽️ Usage |
| 71 | + |
| 72 | +Once your server is up and running, navigate back to your [Shopify Partner Dashboard](https://partners.shopify.com/<<PartnerId>>/apps)'s App section and clicking on the App you installed above (if you're not still there). |
| 73 | + |
| 74 | +Open the `Test your app` accordian button > Select a store from the dropdown > Click the `Install app on store` button and follow the prompts to confirm your installation and `Install Unlisted app`. |
| 75 | + |
| 76 | +**_Make a note of the `access_token` provided as you will need it for making subsequent API calls._** |
| 77 | + |
| 78 | +**NOTE**: this repository works extremely well with our `@particular./shopify-auth` package which is available via `npm` or at: |
| 79 | +https://github.com/uniquelyparticular/shopify-request. |
| 80 | + |
| 81 | +```js |
| 82 | +const { createClient } = require('@particular./shopify-request'); |
| 83 | +// import { createClient } from '@particular./shopify-request' |
| 84 | + |
| 85 | +const shopify = new createClient({ |
| 86 | + store_name: '...', //Shopify Store Name |
| 87 | + access_token: access_token //Shopify OAuth token received after registering as Public App and installing to Store above |
| 88 | +}); |
| 89 | +``` |
| 90 | + |
| 91 | +## 🚀 Deploy |
| 92 | + |
| 93 | +You can easily deploy this function to [now](https://now.sh). |
| 94 | + |
| 95 | +_Contact [Adam Grohs](https://www.linkedin.com/in/adamgrohs/) @ [Particular.](https://uniquelyparticular.com) for any questions._ |
0 commit comments