refactor: no need to encode context with base64 (#21)

just use encodeURIComponent is good enough.

<!--
Thank you for your pull request. Please review below requirements.
Bug fixes and new features should include tests and possibly benchmarks.
Contributors guide: https://github.com/eggjs/egg/blob/master/CONTRIBUTING.md

感谢您贡献代码。请确认下列 checklist 的完成情况。
Bug 修复和新功能必须包含测试，必要时请附上性能测试。
Contributors guide: https://github.com/eggjs/egg/blob/master/CONTRIBUTING.md
-->

##### Checklist
<!-- Remove items that do not apply. For completed items, change [ ] to [x]. -->

- [ ] `npm test` passes
- [ ] tests and/or benchmarks are included
- [ ] documentation is changed or added
- [ ] commit message follows commit guidelines

##### Affected core subsystem(s)
<!-- Provide affected core subsystem(s). -->


##### Description of change
<!-- Provide a description of the change below this comment. -->

.travis.yml

@@ -2,7 +2,7 @@ sudo: false
 language: node_js
 node_js:
   - '8'
-  - '9'
+  - '10'
 install:
   - npm i npminstall && npminstall
 script:

LICENSE

@@ -1,6 +1,6 @@
-The MIT License (MIT)
+MIT License
 
-Copyright (c) 2017 Alibaba Group Holding Limited and other contributors.
+Copyright (c) 2017-present Alibaba Group Holding Limited and other contributors.
 
 Permission is hereby granted, free of charge, to any person obtaining a copy
 of this software and associated documentation files (the "Software"), to deal

appveyor.yml

@@ -1,7 +1,7 @@
 environment:
   matrix:
     - nodejs_version: '8'
-    - nodejs_version: '9'
+    - nodejs_version: '10'
 
 install:
   - ps: Install-Product node $env:nodejs_version

lib/assets_context.js

@@ -1,13 +1,6 @@
 'use strict';
 
-const fs = require('fs');
-const path = require('path');
 const assert = require('assert');
-const utility = require('utility');
-
-const CONTEXT_TEMPLATE_ID = 'context' + utility.sha1(String(Date.now()));
-// https://github.com/davidchambers/Base64.js/blob/master/base64.js
-const atobScript = fs.readFileSync(path.join(__dirname, 'fixtures/decode.min.js'), 'utf8');
 
 // URL consists of host, resourceBase and entry,
 // E.X. http://127.0.0.1:7001/public/index.js
@@ -50,10 +43,8 @@ class Assets {
   }
 
   getContext(data) {
-    data = safeStringify(data || this.assetsContext);
-    let ret = `<div id="${CONTEXT_TEMPLATE_ID}" style="display:none">${data}</div>\n`;
-    ret += `<script>(function(){${atobScript}window.${this.config.contextKey} = decode(document.getElementById('${CONTEXT_TEMPLATE_ID}').textContent);})()</script>`;
-    return ret;
+    data = safeStringify(data || this.assetsContext || {});
+    return `<script>(function(){window.${this.config.contextKey} = JSON.parse(decodeURIComponent("${data}"));})()</script>`;
   }
 
   getURL(entry) {
@@ -97,7 +88,7 @@ function scriptTpl({ url }) {
 
 function safeStringify(data) {
   if (!data) return '';
-  return new Buffer(encodeURIComponent(JSON.stringify(data))).toString('base64');
+  return encodeURIComponent(JSON.stringify(data));
 }
 
 function normalizePublicPath(publicPath) {

package.json

@@ -62,7 +62,8 @@
     "app.js"
   ],
   "ci": {
-    "version": "8, 9"
+    "version": "8, 10",
+    "license": true
   },
   "repository": {
     "type": "git",

test/assets.test.js

@@ -5,7 +5,6 @@ const mock = require('egg-mock');
 const fs = require('mz/fs');
 const assert = require('assert');
 
-
 describe('test/assets.test.js', () => {
 
   afterEach(mock.restore);
@@ -29,9 +28,11 @@ describe('test/assets.test.js', () => {
           .get('/')
           .expect(/<div id="root"><\/div>/)
           .expect(/<link rel="stylesheet" href="http:\/\/127.0.0.1:8000\/index.css"><\/link>/)
-          .expect(/style="display:none">JTdCJTIyZGF0YSUyMiUzQTElN0Q=<\/div>/)
           .expect(/<script src="http:\/\/127.0.0.1:8000\/index.js"><\/script>/)
           .expect(/<script>window.__webpack_public_path__ = '\/';<\/script>/)
+          .expect(res => {
+            assert(res.text.includes('<script>(function(){window.context = JSON.parse(decodeURIComponent("%7B%22data%22%3A1%7D"));})()<\/script>'));
+          })
           .expect(200);
       });
 
@@ -61,9 +62,11 @@ describe('test/assets.test.js', () => {
           .get('/')
           .expect(/<div id="root"><\/div>/)
           .expect(/<link rel="stylesheet" href="http:\/\/cdn.com\/app\/public\/index.b8e2efea.css"><\/link>/)
-          .expect(/style="display:none">JTdCJTIyZGF0YSUyMiUzQTElN0Q=<\/div>/)
           .expect(/<script src="http:\/\/cdn.com\/app\/public\/index.c4ae6394.js"><\/script>/)
           .expect(/<script>window.__webpack_public_path__ = '\/app\/public\/';<\/script>/)
+          .expect(res => {
+            assert(res.text.includes('<script>(function(){window.context = JSON.parse(decodeURIComponent("%7B%22data%22%3A1%7D"));})()<\/script>'));
+          })
           .expect(200);
       });
     });
@@ -87,15 +90,19 @@ describe('test/assets.test.js', () => {
           .get('/')
           .expect(/<div id="root"><\/div>/)
           .expect(/<link rel="stylesheet" href="http:\/\/127.0.0.1:8000\/index.css"><\/link>/)
-          .expect(/style="display:none"><\/div>/)
           .expect(/<script src="http:\/\/127.0.0.1:8000\/index.js"><\/script>/)
+          .expect(res => {
+            assert(res.text.includes('<script>(function(){window.context = JSON.parse(decodeURIComponent("%7B%7D"));})()<\/script>'));
+          })
           .expect(200);
       });
 
       it('should render context', () => {
         return app.httpRequest()
           .get('/context')
-          .expect(/style="display:none">JTdCJTIyZGF0YSUyMiUzQTElN0Q=<\/div>/)
+          .expect(res => {
+            assert(res.text.includes('<script>(function(){window.context = JSON.parse(decodeURIComponent("%7B%22data%22%3A1%7D"));})()<\/script>'));
+          })
           .expect(200);
       });
 
@@ -104,8 +111,10 @@ describe('test/assets.test.js', () => {
           .get('/options')
           .expect(/<div id="root"><\/div>/)
           .expect(/<link rel="stylesheet" href="http:\/\/127.0.0.1:8000\/index.css"><\/link>/)
-          .expect(/style="display:none">JTdCJTdE<\/div>/)
           .expect(/<script src="http:\/\/127.0.0.1:8000\/index.js"><\/script>/)
+          .expect(res => {
+            assert(res.text.includes('<script>(function(){window.context = JSON.parse(decodeURIComponent("%7B%7D"));})()<\/script>'));
+          })
           .expect(200);
       });
 
@@ -115,14 +124,18 @@ describe('test/assets.test.js', () => {
 
         await app.httpRequest()
           .get('/cache')
-          .expect(/JTdCJTIyZGF0YSUyMiUzQTElN0Q=/)
+          .expect(res => {
+            assert(res.text.includes('<script>(function(){window.context = JSON.parse(decodeURIComponent("%7B%22data%22%3A1%7D"));})()<\/script>'));
+          })
           .expect(200);
 
         await fs.writeFile(template, 'override');
 
         await app.httpRequest()
           .get('/cache')
-          .expect(/JTdCJTIyZGF0YSUyMiUzQTElN0Q=/)
+          .expect(res => {
+            assert(res.text.includes('<script>(function(){window.context = JSON.parse(decodeURIComponent("%7B%22data%22%3A1%7D"));})()<\/script>'));
+          })
           .expect(200);
       });
 
@@ -149,8 +162,10 @@ describe('test/assets.test.js', () => {
           .get('/')
           .expect(/<div id="root"><\/div>/)
           .expect(/<link rel="stylesheet" href="http:\/\/cdn.com\/index.b8e2efea.css"><\/link>/)
-          .expect(/style="display:none"><\/div>/)
           .expect(/<script src="http:\/\/cdn.com\/index.c4ae6394.js"><\/script>/)
+          .expect(res => {
+            assert(res.text.includes('<script>(function(){window.context = JSON.parse(decodeURIComponent("%7B%7D"));})()<\/script>'));
+          })
           .expect(200);
       });
     });
@@ -173,10 +188,12 @@ describe('test/assets.test.js', () => {
         return app.httpRequest()
           .get('/')
           .expect(/<link rel="stylesheet" href="http:\/\/127.0.0.1:8000\/index.css"><\/link>/)
-          .expect(/style="display:none">JTdCJTIyZGF0YSUyMiUzQTElN0Q=<\/div>/)
           .expect(/<script src="http:\/\/127.0.0.1:8000\/index.js"><\/script>/)
           .expect(/<script>window.__webpack_public_path__ = '\/';<\/script>/)
           .expect(/<script>window.resourceBaseUrl = 'http:\/\/127.0.0.1:8000\/';<\/script/)
+          .expect(res => {
+            assert(res.text.includes('<script>(function(){window.context = JSON.parse(decodeURIComponent("%7B%22data%22%3A1%7D"));})()<\/script>'));
+          })
           .expect(200);
       });
     });
@@ -195,10 +212,12 @@ describe('test/assets.test.js', () => {
         return app.httpRequest()
           .get('/')
           .expect(/<link rel="stylesheet" href="http:\/\/cdn.com\/app\/public\/index.b8e2efea.css"><\/link>/)
-          .expect(/style="display:none">JTdCJTIyZGF0YSUyMiUzQTElN0Q=<\/div>/)
           .expect(/<script src="http:\/\/cdn.com\/app\/public\/index.c4ae6394.js"><\/script>/)
           .expect(/<script>window.__webpack_public_path__ = '\/app\/public\/';<\/script>/)
           .expect(/<script>window.resourceBaseUrl = 'http:\/\/cdn.com\/app\/public\/';<\/script/)
+          .expect(res => {
+            assert(res.text.includes('<script>(function(){window.context = JSON.parse(decodeURIComponent("%7B%22data%22%3A1%7D"));})()<\/script>'));
+          })
           .expect(200);
       });
     });
@@ -258,8 +277,9 @@ describe('test/assets.test.js', () => {
     it('should GET /', () => {
       return app.httpRequest()
         .get('/?query=<x%E2%80%A8x>')
-        .expect(/<div id="[^"]+" style="display:none">JTdCJTIycXVlcnklMjIlM0ElMjIlM0N4JUUyJTgwJUE4eCUzRSUyMiU3RA==<\/div>/)
-        .expect(/window\.context = decode\(document\.getElementById\('[^']+'\).textContent\);/)
+        .expect(res => {
+          assert(res.text.includes('<script>(function(){window.context = JSON.parse(decodeURIComponent("%7B%22query%22%3A%22%3Cx%E2%80%A8x%3E%22%7D"));})()<\/script>'));
+        })
         .expect(200);
     });
   });

test/dev_server.test.js

@@ -6,7 +6,6 @@ const mock = require('egg-mock');
 const assert = require('assert');
 const sleep = require('mz-modules/sleep');
 
-
 describe('test/dev_server.test.js', () => {
 
   let app;

test/ui.test.js

@@ -5,7 +5,6 @@ const puppeteer = require('puppeteer');
 const sleep = require('mz-modules/sleep');
 const assert = require('assert');
 
-
 describe('test/ui.test.js', () => {
   let app;
   before(() => {
@@ -30,7 +29,9 @@ describe('test/ui.test.js', () => {
   it('should render html', async () => {
     await app.httpRequest()
       .get('/')
-      .expect(/function _atob\(input\)/)
+      .expect(res => {
+        assert(res.text.includes('<script>(function(){window.context = JSON.parse(decodeURIComponent("%7B%22data%22%3A1%7D"));})()<\/script>'));
+      })
       .expect(200);
   });