模板建站和开发网站区别,网站建设公司中企动力强,东莞网站建设品牌,网站怎么申请官网New 这是一个跨窗口渲染的示例#xff0c;用 Three.js 和 localStorage 在同一源#xff08;同产品窗口#xff09;上跨窗口设置 3D 场景。而这也是本周推特和前端圈的一个热点#xff0c;有不少人在争相模仿它的实现#xff0c;如果你对跨窗口的渲染有兴趣#xff0c;可…New 这是一个跨窗口渲染的示例用 Three.js 和 localStorage 在同一源同产品窗口上跨窗口设置 3D 场景。而这也是本周推特和前端圈的一个热点有不少人在争相模仿它的实现如果你对跨窗口的渲染有兴趣可以读一读这个项目的代码。
https://github.com/bgstaal/multipleWindow3dScenehttps://github.com/bgstaal/multipleWindow3dScene 那么我们如何跑通这段代码呢
首先把项目克隆下来放在一个目录用vscode打开这个目录在vscode中安装插件live server和 Node.js当然你安装过就不用安装了。
之后是一个简便方法在vscode中双击打开intex.html文件不断点击右下角的go live出现一个窗口可以断开连接再点就可以出现多个连接了。 之后是复杂方法此时我们可以尝试直接双击index.html文件看是否能够顺利运行多半是不可以的因为浏览器阻止了从本地文件系统 (file:///) 加载的 JavaScript 文件发起的跨域请求。这是浏览器的同源策略Same Origin Policy的一部分用于保护用户安全。 此时使用本地服务器运行咱们的项目 之后创建一个简单的 Express 服务器文件首先在cmd或者终端运行下边两条命令
npm init -y
npm install express
注意如果报错请查找报错原因有些电脑可以需要从官网下载node.js进行安装并设置环境变量 然后在项目中创建一个文件server.js并将下方代码放进去
const express require(express);
const app express();
const port 3000;app.use(express.static(__dirname));app.get(/, (req, res) {res.sendFile(__dirname /index.html);
});app.listen(port, () {console.log(Server is running at http://localhost:${port});
});之后运行程序
node server.js注意如果报错请查找原因 通过浏览器访问项目 打开浏览器并在地址栏中输入 http://localhost:3000 记得打开多个页面之后阉割版量子纠缠就出现了