fix web component.

weexteam · Jan 31, 2018 · 2185fbd · 2185fbd
1 parent 93b9ee1
commit 2185fbd
Show file tree

Hide file tree

Showing 4 changed files with 70 additions and 17 deletions.
diff --git a/examples/components/web.vue b/examples/components/web.vue
@@ -12,14 +12,17 @@
         @click.native="refresh"></button>
     </div>
     <web class="content" ref="webview" :src="src"
-      @pagestart="startload" @pagefinish="finishload" @error="failload"></web>
+      @pagestart="startload"
+      @pagefinish="finishload"
+      @error="failload"></web>
   </div>
 </template>
 
 <script>
   var webview = weex.requireModule('webview');
   const src = 'http://invalid.src/for/test'
   const newSrc = 'http://m.taobao.com'
+  // const newSrc = window.location.href.replace(/\?[^?]*$/, '')  // for test.
   module.exports = {
     data () {
       return {

diff --git a/package.json b/package.json
@@ -1,7 +1,7 @@
 {
   "name": "weex-vue-render",
   "description": "Web renderer for weex project written in Vue DSL.",
-  "version": "1.0.15",
+  "version": "1.0.16",
   "license": "Apache-2.0",
   "main": "dist/index.common.js",
   "keywords": [

diff --git a/packages/weex-vue-render/package.json b/packages/weex-vue-render/package.json
@@ -1,6 +1,6 @@
 {
   "name": "weex-vue-render",
-  "version": "1.0.15",
+  "version": "1.0.16",
   "description": "Web renderer for weex project written in Vue DSL.",
   "license": "Apache-2.0",
   "main": "dist/index.common.js",

diff --git a/src/components/web/index.js b/src/components/web/index.js
@@ -23,53 +23,103 @@ function getWeb (weex) {
   const { dispatchNativeEvent } = weex.utils
 
   return {
+    data () {
+      return {
+        currentSrc: ''
+      }
+    },
     name: 'weex-web',
     props: {
       src: String
     },
+    watch: {
+      src (newVal) {
+        this.currentSrc = newVal
+      }
+    },
     methods: {
-      // TODO: check cross-origin
       goBack () {
-        if (this.$el) {
-          this.$el.contentWindow.history.back()
+        const el = this.$el
+        if (el) {
+          const win = el.contentWindow
+          try {
+            win.history.back()
+            this.currentSrc = win.location.href
+          }
+          catch (err) {
+            dispatchNativeEvent(el, 'error', err)
+          }
         }
       },
       goForward () {
-        if (this.$el) {
-          this.$el.contentWindow.history.forward()
+        const el = this.$el
+        if (el) {
+          const win = el.contentWindow
+          try {
+            win.history.forward()
+            this.currentSrc = win.location.href
+          }
+          catch (err) {
+            dispatchNativeEvent(el, 'error', err)
+          }
         }
       },
       reload () {
-        if (this.$el) {
-          this.$el.contentWindow.history.reload()
+        const el = this.$el
+        if (el) {
+          try {
+            el.contentWindow.location.reload()
+            dispatchNativeEvent(el, 'pagestart', { url: this.currentSrc })
+          }
+          catch (err) {
+            dispatchNativeEvent(el, 'error', err)
+          }
         }
       }
     },
 
+    created () {
+      this.currentSrc = this.src
+    },
+
     mounted () {
       const el = this.$el
-      this._prevSrc = this.src
+      this._prevSrc = this.currentSrc
       if (el) {
-        dispatchNativeEvent(el, 'pagestart', { url: this.src })
+        dispatchNativeEvent(el, 'pagestart', { url: this.currentSrc })
       }
     },
 
     updated () {
-      if (this.src !== this._prevSrc) {
-        this._prevSrc = this.src
-        dispatchNativeEvent(this.$el, 'pagestart', { url: this.src })
+      if (this.currentSrc !== this._prevSrc) {
+        this._prevSrc = this.currentSrc
+        dispatchNativeEvent(this.$el, 'pagestart', { url: this.currentSrc })
       }
     },
 
     render (createElement) {
       return createElement('iframe', {
         attrs: {
           'weex-type': 'web',
-          src: this.src
+          src: this.currentSrc
         },
         on: {
           load: event => {
-            dispatchNativeEvent(event.target, 'pagefinish', { url: this.src })
+            this.$nextTick(function () {
+              const el = this.$el
+              try {
+                const html = el.contentWindow.document.documentElement
+                if (html) {
+                  dispatchNativeEvent(el, 'pagefinish', { url: this.currentSrc })
+                }
+                else {
+                  dispatchNativeEvent(el, 'error', new Error('[vue-render]:found no page content.'))
+                }
+              }
+              catch (err) {
+                dispatchNativeEvent(el, 'error', err)
+              }
+            })
           }
         },
         staticClass: 'weex-web weex-el',