[英]Vuejs SSR, Laravel and PHP V8Js issue “window is undefined”
I am trying to render server side code on page load by following https://medium.com/js-dojo/advanced-server-side-rendering-with-laravel-vue-multi-page-app-486b706e654 . 我正在尝试通过遵循https://medium.com/js-dojo/advanced-server-side-rendering-with-laravel-vue-multi-page-app-486b706e654呈现页面加载时的服务器端代码。 Everything works fine but when I try to use global variable "window" or "document" 一切正常,但是当我尝试使用全局变量“ window”或“ document”时
my app.js
code is 我的app.js
代码是
import App from './components/App.vue';
import Vue from 'vue';
import { createRouter } from './router'
import { createStore } from './store'
import { sync } from 'vuex-router-sync'
require('./bootstrap');
The bootstrap.js is normal as bootstrap.js是正常的
window.axios = require('axios');
window.axios.defaults.headers.common['X-Requested-With'] = 'XMLHttpRequest';
I need axios globally but php V8Js gives error V8Js::compileString():612: TypeError: window is undefined
我需要全局axios,但是php V8Js给出错误V8Js::compileString():612: TypeError: window is undefined
I found that V8Js
doesn't have browser variables and I tried using npm package browser-env
but getting same error. 我发现V8Js
没有浏览器变量,我尝试使用npm包browser-env
但收到相同的错误。 see the screenshot http://nimb.ws/zGDmXO 参见截图http://nimb.ws/zGDmXO
Thank you 谢谢
you have to get rid from windows
and document
using for the JS
string that you are passing to V8Js::executeString
because it looks for document
and window
but it doesn't exists that time and code is executing at the server-end. 您必须摆脱传递给V8Js::executeString
的JS
字符串使用的windows
和document
使用,因为它查找document
和window
但是在服务器端执行代码的时间并不存在。
In your app.js
Do something like this: 在您的app.js
执行以下操作:
import axios from 'axios';
axios.defaults.headers.common['X-Requested-With'] = 'XMLHttpRequest';
and at back-end do like: 并在后端执行以下操作:
$rendererSrc =\file_get_contents()(\base_path('node_modules/vue-server-renderer/basic.js'));
$appSrc = file_get_contents()(\public_path('js/entry-server.js'));
$v8Js = new \V8Js();
$v8Js->executeString(
<<<EOT
var process = { env: { VUE_ENV: "server", NODE_ENV: "production" } };
this.global = { process: process };
var url = "path_you_are_hitting";
{$rendererSrc}
{$appSrc}
EOT
);
Hope it'll work 希望能成功
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.