feat: support proxy and add localStorage (#87)

Author: atinux

docs/content/en/hooks.md

@@ -1,6 +1,6 @@
 ---
 title: Hooks
-description: ''
+description: 'Add hooks on Strapi HTTP calls'
 position: 4
 category: Guide
 ---

docs/content/en/index.md

@@ -1,6 +1,6 @@
 ---
 title: Introduction
-description: ''
+description: 'Nuxt Strapi is a Nuxt module for first class integration with Strapi'
 position: 1
 category: ''
 features:

docs/content/en/options.md

@@ -1,6 +1,6 @@
 ---
-title: options
-description: ''
+title: Options
+description: 'Discover the options of the Strapi module for Nuxt'
 position: 6
 category: API
 ---

docs/content/en/proxy.md

@@ -0,0 +1,29 @@
+---
+title: Using a proxy
+description: 'Use Strapi behind a proxy with Nuxt Proxy module'
+position: 7
+category: Advanced
+fullscreen: true
+---
+
+You can use the [@nuxtjs/proxy](https://github.com/nuxt-community/proxy-module) module if you want to proxy your Strapi URL:
+
+```js [nuxt.config.js]
+export default {
+  modules: [
+    '@nuxtjs/strapi',
+    '@nuxtjs/proxy'
+  ],
+  proxy: {
+    '/api/strapi': {
+      target: 'http://localhost:1337',
+      pathRewrite: {
+        '^/api/strapi': '/'
+      }
+    }
+  },
+  strapi: {
+    url: '/api/strapi'
+  }
+}
+```

docs/content/en/setup.md

@@ -1,6 +1,6 @@
 ---
 title: Setup
-description: ''
+description: 'Learn how to setup Strapi in your Nuxt app'
 position: 2
 category: Guide
 ---

docs/content/en/strapi.md

@@ -1,6 +1,6 @@
 ---
 title: $strapi
-description: ''
+description: 'Use the $strapi inside your Nuxt app'
 position: 5
 category: API
 ---

docs/content/en/usage.md

@@ -1,13 +1,13 @@
 ---
 title: Usage
-description: ''
+description: 'Learn how to use the Strapi module in your Nuxt app'
 position: 3
 category: Guide
 ---
 
 ## Authentication
 
-To handle authentication in your Nuxt.js app with Strapi, you can:
+To handle authentication in your Nuxt app with Strapi, you can:
 
 ### Login
 

docs/package.json

@@ -11,7 +11,7 @@
   },
   "dependencies": {
     "@nuxt/content-theme-docs": "^0.8.2",
-    "nuxt": "^2.14.7"
+    "nuxt": "^2.14.12"
   },
   "devDependencies": {
     "nuxt-ackee": "^2.0.0"

docs/yarn.lock

@@ -7,14 +7,13 @@ const defaults = {
 }
 
 module.exports = async function (moduleOptions) {
-  const options = defu({
-    ...this.options.strapi,
-    ...moduleOptions
-  }, defaults)
+  const { nuxt } = this
 
-  this.options.publicRuntimeConfig = this.options.publicRuntimeConfig || {}
-  this.options.publicRuntimeConfig.strapi = this.options.publicRuntimeConfig.strapi || {}
-  this.options.publicRuntimeConfig.strapi.url = options.url
+  const options = defu(moduleOptions, nuxt.options.strapi, defaults)
+
+  nuxt.options.publicRuntimeConfig = nuxt.options.publicRuntimeConfig || {}
+  nuxt.options.publicRuntimeConfig.strapi = nuxt.options.publicRuntimeConfig.strapi || {}
+  nuxt.options.publicRuntimeConfig.strapi.url = options.url
 
   this.addPlugin({
     src: resolve(__dirname, 'plugin.js'),

lib/module.js

@@ -1,7 +1,7 @@
 import Vue from 'vue'
 import Hookable from 'hookable'
-import isArray from 'lodash/isArray';
-import isObject from 'lodash/isObject';
+import reqURL from 'requrl'
+import { joinURL } from '@nuxt/ufo'
 
 const TOKEN_KEY = 'strapi_jwt'
 
@@ -15,8 +15,13 @@ class Strapi extends Hookable {
 
     this.$cookies = ctx.app.$cookies
     this.$http = ctx.$http.create({})
-    this.$http.setToken(this.getToken(), 'Bearer')
-    this.$http.setBaseURL(runtimeConfig.url || '<%= options.url %>')
+    this.syncToken()
+    const url = runtimeConfig.url || '<%= options.url %>'
+    if (process.server && ctx.req && url.startsWith('/')) {
+      this.$http.setBaseURL(joinURL(reqURL(ctx.req), url))
+    } else {
+      this.$http.setBaseURL(url)
+    }
     this.$http.onError((err) => {
       if (!err.response) {
         this.callHook('error', err)
@@ -26,9 +31,9 @@ class Strapi extends Hookable {
       const { response: { data: { message: msg } } } = err
 
       let message
-      if (isArray(msg)) {
+      if (Array.isArray(msg)) {
         message = msg[0].messages[0].message
-      } else if (isObject(msg)) {
+      } else if (typeof msg === 'object' && msg !== null) {
         message = msg.message
       } else {
         message = msg
@@ -86,13 +91,11 @@ class Strapi extends Hookable {
   }
 
   async fetchUser () {
-    const jwt = this.getToken()
+    const jwt = this.syncToken()
     if (!jwt) {
       return null
     }
 
-    this.$http.setToken(jwt, 'Bearer')
-
     try {
       const user = await this.findOne('users', 'me')
       this.setUser(user)
@@ -145,18 +148,43 @@ class Strapi extends Hookable {
   }
 
   getToken () {
-    return this.$cookies.get(TOKEN_KEY)
+    let token
+    if (process.client && typeof window.localStorage !== 'undefined') {
+      token = window.localStorage.getItem(TOKEN_KEY)
+    }
+    if (!token) {
+      token = this.$cookies.get(TOKEN_KEY)
+    }
+    return token
   }
 
   setToken (jwt) {
     this.$http.setToken(jwt, 'Bearer')
+    if (process.client && typeof window.localStorage !== 'undefined') {
+      window.localStorage.setItem(TOKEN_KEY, jwt)
+    }
     this.$cookies.set(TOKEN_KEY, jwt)
   }
 
   clearToken () {
     this.$http.setToken(false)
+    if (process.client && typeof window.localStorage !== 'undefined') {
+      window.localStorage.removeItem(TOKEN_KEY)
+    }
     this.$cookies.remove(TOKEN_KEY)
   }
+
+  syncToken (jwt) {
+    if (!jwt) {
+      jwt = this.getToken()
+    }
+    if (jwt) {
+      this.setToken(jwt)
+    } else {
+      this.clearToken()
+    }
+    return jwt
+  }
 }
 
 export default async function (ctx, inject) {

lib/plugin.js

@@ -22,25 +22,27 @@
     "test": "yarn lint && jest"
   },
   "dependencies": {
-    "@nuxt/http": "^0.6.0",
+    "@nuxt/http": "^0.6.1",
+    "@nuxt/ufo": "^0.5.2",
     "cookie-universal-nuxt": "^2.1.4",
     "defu": "^3.2.2",
-    "hookable": "^4.3.1"
+    "hookable": "^4.3.1",
+    "requrl": "^3.0.1"
   },
   "devDependencies": {
-    "@babel/core": "latest",
-    "@babel/preset-env": "latest",
-    "@commitlint/cli": "latest",
-    "@commitlint/config-conventional": "latest",
-    "@nuxtjs/eslint-config": "^4.0.0",
+    "@babel/core": "^7.12.10",
+    "@babel/preset-env": "^7.12.11",
+    "@commitlint/cli": "^11.0.0",
+    "@commitlint/config-conventional": "^11.0.0",
+    "@nuxtjs/eslint-config": "^5.0.0",
     "@nuxtjs/module-test-utils": "latest",
     "babel-eslint": "latest",
-    "babel-jest": "latest",
-    "eslint": "latest",
-    "husky": "latest",
-    "jest": "latest",
-    "nuxt": "2.14.7",
-    "standard-version": "latest"
+    "babel-jest": "^26.6.3",
+    "eslint": "^7.15.0",
+    "husky": "^4.3.6",
+    "jest": "^26.6.3",
+    "nuxt": "2.14.12",
+    "standard-version": "^9.0.0"
   },
   "publishConfig": {
     "access": "public"