Add experimental ?expand flag

See #24

client/Home.md

@@ -46,6 +46,11 @@ Append a `/` at the end of a URL to view a listing of all the files in a package
       <td></td>
       <td>Return metadata about any file in a package as JSON (e.g. `/any/file?meta`)</td>
     </tr>
+    <tr>
+      <td>`expand`</td>
+      <td></td>
+      <td>Expands all ["bare" `import` specifiers](https://html.spec.whatwg.org/multipage/webappapis.html#resolve-a-module-specifier) in JavaScript modules to unpkg URLs. This feature is *very experimental*</td>
+    </tr>
   </tbody>
 </table>
 

package.json

@@ -13,7 +13,6 @@
     "countries-list": "^1.3.2",
     "csso": "^3.1.1",
     "date-fns": "^1.28.1",
-    "etag": "^1.8.0",
     "express": "^4.15.2",
     "gunzip-maybe": "^1.4.0",
     "http-client": "^4.3.1",
@@ -39,7 +38,7 @@
   },
   "devDependencies": {
     "autoprefixer": "6.7.2",
-    "babel-core": "6.22.1",
+    "babel-core": "^6.26.0",
     "babel-eslint": "7.1.1",
     "babel-jest": "18.0.0",
     "babel-loader": "6.2.10",

server/middleware/parsePackageURL.js

@@ -1,8 +1,8 @@
-const qs = require('querystring')
 const validateNPMPackageName = require('validate-npm-package-name')
 const PackageURL = require('../PackageURL')
 
 const KnownQueryParams = {
+  expand: true,
   main: true,
   meta: true
 }
@@ -15,15 +15,29 @@ function queryIsKnown(query) {
   return Object.keys(query).every(isKnownQueryParam)
 }
 
-function createSearch(query, withMeta) {
-  let search = ''
+function sanitizeQuery(query) {
+  const saneQuery = {}
 
-  if (query.main)
-    search += `main=${encodeURIComponent(query.main)}`
+  Object.keys(query).forEach(function (param) {
+    if (isKnownQueryParam(param))
+      saneQuery[param] = query[param]
+  })
 
-  // Do this manually because stringify uses ?meta= for { meta: true }
-  if (query.meta != null || query.json != null || withMeta)
-    search += (search ? '&' : '') + 'meta'
+  return saneQuery
+}
+
+function createSearch(query) {
+  const params = []
+
+  Object.keys(query).forEach(function (param) {
+    if (query[param] === '') {
+      params.push(param) // Omit the trailing "=" from param=
+    } else {
+      params.push(`${param}=${encodeURIComponent(query[param])}`)
+    }
+  })
+
+  const search = params.join('&')
 
   return search ? `?${search}` : ''
 }
@@ -33,8 +47,11 @@ function createSearch(query, withMeta) {
  */
 function parsePackageURL(req, res, next) {
   // Redirect /_meta/pkg to /pkg?meta.
-  if (req.path.match(/^\/_meta\//))
-    return res.redirect(req.path.substr(6) + createSearch(req.query, true))
+  if (req.path.match(/^\/_meta\//)) {
+    delete req.query.json
+    req.query.meta = ''
+    return res.redirect(req.path.substr(6) + createSearch(req.query))
+  }
 
   const url = PackageURL.parse(req.url)
 
@@ -52,7 +69,7 @@ function parsePackageURL(req, res, next) {
   // with only known params so they can be served from the cache. This
   // prevents people using random query params designed to bust the cache.
   if (!queryIsKnown(url.query))
-    return res.redirect(url.pathname + createSearch(url.query))
+    return res.redirect(url.pathname + createSearch(sanitizeQuery(url.query)))
 
   req.packageName = url.packageName
   req.packageVersion = url.packageVersion

server/middleware/serveFile.js

@@ -1,6 +1,7 @@
 const fs = require('fs')
 const path = require('path')
-const etag = require('etag')
+const babel = require('babel-core')
+const unpkgRewrite = require('babel-plugin-unpkg-rewrite')
 const getMetadata = require('./utils/getMetadata')
 const getFileContentType = require('./utils/getFileContentType')
 const getIndexHTML = require('./utils/getIndexHTML')
@@ -15,26 +16,16 @@ const AutoIndex = !process.env.DISABLE_INDEX
  */
 const MaximumDepth = 128
 
-function sendFile(res, file, stats) {
-  let contentType = getFileContentType(file)
+const FileTransforms = {
+  expand: function (file, callback) {
+    const options = {
+      plugins: [ unpkgRewrite ]
+    }
 
-  if (contentType === 'text/html')
-    contentType = 'text/plain' // We can't serve HTML because bad people :(
-
-  res.writeHead(200, {
-    'Content-Type': contentType,
-    'Content-Length': stats.size,
-    'ETag': etag(stats)
-  })
-
-  const stream = fs.createReadStream(file)
-
-  stream.on('error', (error) => {
-    console.error(error)
-    res.status(500).type('text').send('There was an error serving this file')
-  })
-
-  stream.pipe(res)
+    babel.transformFile(file, options, function (error, result) {
+      callback(error, result && result.code)
+    })
+  }
 }
 
 /**
@@ -55,14 +46,32 @@ function serveFile(req, res, next) {
       }
     })
   } else if (req.stats.isFile()) {
+    const file = path.join(req.packageDir, req.file)
+
+    let contentType = getFileContentType(file)
+
+    if (contentType === 'text/html')
+      contentType = 'text/plain' // We can't serve HTML because bad people :(
+
     // Cache files for 1 year.
     res.set({
+      'Content-Type': contentType,
       'Cache-Control': 'public, max-age=31536000',
       'Cache-Tag': 'file'
     })
 
-    // TODO: use res.sendFile instead of our own sendFile?
-    sendFile(res, path.join(req.packageDir, req.file), req.stats)
+    if (contentType === 'application/javascript' && req.query.expand != null) {
+      FileTransforms.expand(file, function (error, code) {
+        if (error) {
+          console.error(error)
+          res.status(500).type('text').send(`Cannot generate index page for ${req.packageSpec}${req.filename}`)
+        } else {
+          res.send(code)
+        }
+      })
+    } else {
+      res.sendFile(file)
+    }
   } else if (AutoIndex && req.stats.isDirectory()) {
     getIndexHTML(req.packageInfo, req.packageVersion, req.packageDir, req.file, function (error, html) {
       if (error) {