Merge pull request #143 from xg-wang/fastboot

Enable Fastboot relative URL

Author: xg-wang

README.md

@@ -1,4 +1,4 @@
-# Ember-fetch
+# ember-fetch
 [![Build Status](https://travis-ci.org/ember-cli/ember-fetch.svg?branch=master)](https://travis-ci.org/ember-cli/ember-fetch)
 [![Build status](https://ci.appveyor.com/api/projects/status/u7qcv4pgsvo60sxt?svg=true)](https://ci.appveyor.com/project/embercli/ember-fetch)
 [![Ember Observer Score](https://emberobserver.com/badges/ember-fetch.svg)](https://emberobserver.com/addons/ember-fetch)
@@ -65,7 +65,7 @@ export default {
 }
 ```
 
-For addon authors, if the addon supports Fastboot mode, `ember-fetch` should also be listed as a [peer dependency](https://docs.npmjs.com/files/package.json#peerdependencies). 
+For addon authors, if the addon supports Fastboot mode, `ember-fetch` should also be listed as a [peer dependency](https://docs.npmjs.com/files/package.json#peerdependencies).
 This is because Fastboot only invokes top-level addon's `updateFastBootManifest` ([detail](https://github.com/ember-fastboot/ember-cli-fastboot/issues/597)), thus `ember-fetch` has to be a top-level addon installed by the host app.
 
 ### Allow native fetch

addon/mixins/adapter-fetch.js

@@ -4,6 +4,7 @@ import RSVP from 'rsvp';
 import fetch from 'fetch';
 import mungOptionsForFetch from '../utils/mung-options-for-fetch';
 import determineBodyPromise from '../utils/determine-body-promise';
+
 /**
  * Helper function to create a plain object from the response's Headers.
  * Consumed by the adapter's `handleResponse`.
@@ -21,14 +22,13 @@ export function headersToObject(headers) {
 }
 
 export default Mixin.create({
-/**
- * @param {String} url
- * @param {String} type
- * @param {Object} _options
- * @returns {Object}
- * @override
+  /**
+   * @param {String} url
+   * @param {String} type
+   * @param {Object} _options
+   * @returns {Object}
+   * @override
  */
-
   ajaxOptions(url, type, options = {}) {
     options.url = url;
     options.type = type;

fastboot/instance-initializers/setup-fetch.js

@@ -0,0 +1,19 @@
+import setupFetch from 'fetch/setup';
+
+/**
+ * To allow relative URLs for Fastboot mode, we need the per request information
+ * from the fastboot service. Then we re-define the `fetch` amd module.
+ */
+function patchFetchForRelativeURLs(instance) {
+  const fastboot = instance.lookup('service:fastboot');
+  const request = fastboot.get('request');
+  // Prember is not sending protocol
+  const protocol = request.protocol === 'undefined:' ? 'http:' : request.protocol;
+  // host is cp
+  setupFetch(protocol, request.get('host'))();
+}
+
+export default {
+  name: 'fetch',
+  initialize: patchFetchForRelativeURLs
+};

index.js

@@ -137,7 +137,7 @@ module.exports = {
   },
 
   //add node version of fetch.js into fastboot package.json manifest vendorFiles array
-  updateFastBootManifest: function (manifest) {
+  updateFastBootManifest: function(manifest) {
     manifest.vendorFiles.push('ember-fetch/fastboot-fetch.js');
     return manifest;
   },

package.json

@@ -29,7 +29,7 @@
     "broccoli-stew": "^2.0.0",
     "broccoli-templater": "^2.0.1",
     "ember-cli-babel": "^6.8.2",
-    "node-fetch": "^2.0.0-alpha.9",
+    "node-fetch": "^2.3.0",
     "whatwg-fetch": "^3.0.0"
   },
   "devDependencies": {
@@ -40,6 +40,8 @@
     "ember-cli": "~3.0.2",
     "ember-cli-dependency-checker": "^3.0.0",
     "ember-cli-htmlbars": "^3.0.1",
+    "ember-cli-eslint": "^4.2.1",
+    "ember-cli-fastboot": "^2.0.0",
     "ember-cli-inject-live-reload": "^2.0.1",
     "ember-cli-pretender": "^3.0.0",
     "ember-cli-qunit": "^4.3.2",

public/fastboot-fetch.js

@@ -1,23 +1,55 @@
 /* globals define FastBoot */
-(function() {
-  define('fetch', ['exports'], function(self) {
-    var AbortControllerPolyfill = FastBoot.require('abortcontroller-polyfill/dist/cjs-ponyfill');
-    var nodeFetch = FastBoot.require('node-fetch');
-    var abortableFetch = AbortControllerPolyfill.abortableFetch({
-      fetch: nodeFetch,
-      Request: nodeFetch.Request
-    });
+define('fetch/setup', ['exports'], function(self) {
+  var httpRegex = /^https?:\/\//;
+  var protocolRelativeRegex = /^\/\//;
 
-    self['default'] = abortableFetch.fetch;
-    self['Request'] = abortableFetch.Request;
+  var AbortControllerPolyfill = FastBoot.require(
+    'abortcontroller-polyfill/dist/cjs-ponyfill'
+  );
+  var nodeFetch = FastBoot.require('node-fetch');
 
-    self['Headers'] = nodeFetch.Headers;    
-    self['Response'] = nodeFetch.Response;
+  self['default'] = function(protocol, host) {
+    return function() {
+      define('fetch', ['exports'], function(exports) {
+        function buildAbsoluteUrl(url, protocol, host) {
+          if (protocolRelativeRegex.test(url)) {
+            url = host + url;
+          } else if (!httpRegex.test(url)) {
+            if (!host) {
+              throw new Error(
+                'You are using using fetch with a path-relative URL, but host is missing from Fastboot request. Please set the hostWhitelist property in your environment.js.'
+              );
+            }
+            url = protocol + '//' + host + url;
+          }
+          return url;
+        }
+        /**
+         * Setup the exported fetch for a given origin so it can handle:
+         * - protocol-relative URL (//can-be-http-or-https.com/)
+         * - path-relative URL (/file/under/root)
+         * @param {String|Object} input
+         * @param {Object} [options]
+         */
+        exports['default'] = function fetch(input, options) {
+          if (typeof input === 'object') {
+            input.url = buildAbsoluteUrl(input.url, protocol, host);
+          } else {
+            input = buildAbsoluteUrl(input, protocol, host);
+          }
+          return nodeFetch(input, options);
+        };
+        exports['Request'] = nodeFetch.Request;
+        exports['Headers'] = nodeFetch.Headers;
+        exports['Response'] = nodeFetch.Response;
+        exports['AbortController'] = AbortControllerPolyfill.AbortController;
+      });
+    };
+  };
+});
 
-    self['AbortController'] = AbortControllerPolyfill.AbortController;
-  });
-
-  define('fetch/ajax', ['exports'], function() {
-    throw new Error('You included `fetch/ajax` but it was renamed to `ember-fetch/ajax`');
-  });
-})();
+define('fetch/ajax', ['exports'], function() {
+  throw new Error(
+    'You included `fetch/ajax` but it was renamed to `ember-fetch/ajax`'
+  );
+});

tests/dummy/config/environment.js

@@ -20,6 +20,10 @@ module.exports = function(environment) {
     APP: {
       // Here you can pass flags/options to your application instance
       // when it is created
+    },
+
+    fastboot: {
+      hostWhitelist: [/^localhost:\d+$/]
     }
   };