function cacheDataURLFrom(text, toCache) { var urlMap = {}; var attachmentCount = 0; var test = /\[(.*?)\]\((data:.*?)\)/g; var newText = text.replace(test, function (_, label, dataURL) { fileName = encodeURIComponent(label.split(/[\\/]/).pop()); var fakeURL = location.href + '/' + ++attachmentCount +'/' + fileName; urlMap[fakeURL] = dataURL; return '[' + label + '](' + fakeURL + ')'; }); return Promise.all( Object.entries(urlMap).map(function([fakeURL, dataURL]) { return fetch(dataURL).then(function(res) { return toCache.put(fakeURL, new Response(res.body, res)); }); }) ).then(function() { return newText; }); } Vue.component('vue-easymde', VueEasyMDE.VueEasyMDE) var origText // 查看消息需要用到的JS app = new Vue({ el: '#app', data: { status: -1, text: null, easyMDEOpts: { maxHeight: '70vh', onToggleFullScreen: function() { $('.navbar').toggle(); }, spellChecker: false, toolbar: [ { name: 'copy no-disable', action: function() { if (!origText) return; navigator.clipboard.writeText(origText); }, className: 'fa fa-clipboard', title: 'Copy to clipboard', }, 'preview', 'fullscreen', ], renderingConfig: { codeSyntaxHighlighting: true }, }, }, mounted: function() { // 从URL获取GUID,然后透过POST获取消息 var guid = reg_guid.exec(location.href)[0]; navigator.serviceWorker.register('./sw.js').then(function () { return navigator.serviceWorker.ready; }).then(function() { return axios.post('/api/get-msg', { guid: guid }); }).then(function(response) { var data = response.data; app.status = data.status; if (app.status !== 1) return null; origText = data.text; $(window).on('navigate unload', function() { caches.delete(guid); }); return caches.open(guid); }).then(function(toCache) { return toCache && cacheDataURLFrom(origText, toCache); }).then(function(text) { app.text = text; }).catch(function(error) { throw error; }); }, watch: { status: function(status) { if (status !== 1) return; // 获取成功,等待装载并设定编辑器状态 this.$nextTick(() => { var easyMDE = this.$refs.preview.getMDEInstance(); easyMDE.togglePreview(); easyMDE.codemirror.setOption('readOnly', true); }); } } })