本文采用nuxt进行服务端渲染https://zh.nuxtjs.org/Nuxt.js 十分简单易用。一个简单的项目只需将 nuxt 添加为依赖组件即可。Vue因其简单易懂的API、高效的数据绑定和灵活的组件系统,受到很多前端开发人员的青睐。国内很多公司都在使用vue进行项目开发,我们正在使用的简书,便是基于Vue来构建的。 我们知道,SPA前端渲染存在两大痛点:(1)SEO。搜索引擎爬虫难以抓取客户端渲染的页面meta信息和其他SEO相关信息,使网站无法在搜索...
内容概述 multer是常用的Express文件上传中间件。服务端如何获取文件上传的进度,是使用的过程中,很常见的一个问题。在SF上也有同学问了类似问题《nodejs multer有没有查看文件上传进度的方法?》。稍微回答了下,这里顺便整理出来,有同样疑问的同学可以参考。 下文主要介绍如何利用progress-stream获取文件上传进度,以及该组件使用过程中的注意事项。 利用progress-stream获取文件上传进度 如果只是想在服务端获取上传进度,可...
我们很多同学在实施使用MUI框架的时候,在打开新的页面的时候常使用的方式是:mui.openwindow的方法,然而遇到网页需要从服务器或者是要嵌套外部的网页的时候,由于网速的问题会遇到加载时出现白屏,等待时间过长,导致用户体验不好. 页面加载的时候使用plus.webview.create方法就很好的解决了这个问题. 废话不多说直接贴代码 首先我们需要在创建一个父页面,以下是父页面的JS // H5 plus事件处理 function plusReady(){ var nwaiting =...
前言最近在写 koa 的时候想到,如果我部分代码提供api,部分代码支持ssr,那我应该如何写呢?(不想拆成 2个服务的情况下) 而且最近写的项目里面也用过一些服务端渲染,如nuxt,自己也搭过next的项目,确实开发体验都非常友好,但是友好归友好,具体又是如何实现的呢,诸位有没有考虑过? 本着求真务实的折腾态度,选了react作为研究对象(主要是vue写的有点多,恶心了),那下面就简单就以最小成本写一个react的服务端渲染 demo用...
关于SSR的文章网上很多,一开始看得我云里雾里。然后去Vue.js 服务器渲染指南和nuxt官网看了看,发现文章大多都是搬运官网的内容,真正讲的清晰明了的很少。所以想写篇文章学习下SSR,希望能够帮助大家快速理解Vue SSR。 什么是SSR?SSR,即服务器渲染,就是在服务器端将对Vue页面进行渲染生成html文件,将html页面传给浏览器。 优点: SEO 不同于SPA的HTML只有一个无实际内容的HTML和一个app.js,SSR生成的HTML是有内容的,这让搜...
1.问题描述: 本地vue-cli启动了一个项目只能通过localhost:8080访问到,同一局域网下其他的手机和电脑并不能通过ip地址访问调试, 2.原因:vue-cli项目是通过命令行一键生成的,配置文件中默认生成的是本地调试模式,默认访问地址是localhost:端口号 3.改正的方式 找到config文件夹下的index.js文件,修改host:“localhost”为 host:"0.0.0.0",此时同一局域网下的手机和其他电脑能通过ip查看到页面 PS:下面看下vue-cli起...
第一部分 基本介绍 1、前言服务端渲染实现原理机制:在服务端拿数据进行解析渲染,直接生成html片段返回给前端。然后前端可以通过解析后端返回的html片段到前端页面,大致有以下两种形式:1、服务器通过模版引擎直接渲染整个页面,例如java后端的vm模版引擎,php后端的smarty模版引擎。 2、服务渲染生成html代码块, 前端通过AJAX获取然后使用js动态添加。2、服务端渲染的优劣服务端渲染能够解决两大问题:1、seo问题,有利于搜索引...
前言本次分享一个提供设计稿与前端页面进行像素对比的node服务,旨在为测试或者前端人员自己完成一个辅助性测试。相信我,在像素级别的对比下,网页对设计稿的还原程度一下子就会凸显出来。下面话不多说了,来一起看看详细的介绍吧。效果预览前置知识本次用到了以下两个库作为辅助工具: casperjs:基于PhantomJS的编写。其内部提供了一个无界面浏览器,简单来说用它你可以以代码的形式来完成模拟人来操作浏览器的操作,其中涉及鼠...
本文实例讲述了nodejs简单实现TCP服务器端和客户端的聊天功能。分享给大家供大家参考,具体如下: 服务器端 var net = require(net); var server = net.createServer(); //聚合所有客户端 var sockets = []; //接受新的客户端连接 server.on(connection, function(socket){console.log(got a new connection);sockets.push(socket);//从连接中读取数据socket.on(data, function(data){console.log(got data:, data);//广播数据//每...
最近好多伙伴说,我用vue做的项目本地是可以的,但部署到服务器遇到好多问题:资源找不到,直接访问index.html页面空白,刷新当前路由404。。。现在我们一起讨论下单页面如何部署到服务器? 由于前端路由缘故,单页面应用应该放到nginx或者apache、tomcat等web代理服务器中,千万不要直接访问index.html,同时要根据自己服务器的项目路径更改react或vue的路由地址。 如果说项目是直接跟在域名后面的,比如:http://www.sosout.com ,...
准备条件 一台服务器SSL证书,小程序规定必须要https协议服务器后台 Node.js express mongodb pm2下面以腾讯云主机(centos)为例 安装Node.js yum install nodejs也可以安装nvm,用nvm管理nodejs版本 安装git yum install git 连接到远程代码库 以github为例: 配置用户信息 git config --global user.name youname git config --global user.email youemail生成ssh公钥 ssh -keygen -t rsa -C youemail默认生成目录为 /root/.ssh 在...
react-router作为react框架路由解决方案在react项目中举足轻重。 在react-router 4.0版本中,API与先前版本相比有了很大的修改,在2.0、3.0中常用的<Router>组件作为路由底层配置组件不再常用,取而代之的是四个各有不同的路由组件: <BrowserRouter>, <HashRouter>, <MemoryRouter>, <StaticRouter> 其中<MemoryRouter>组件在内存中保存“URL”信息,不会修改浏览器的地址栏,往往用于React Native或测试环境等非浏览器环境。 而<...
GET请求: var http = require(http); var qs = require(querystring); var data = { a: 123, time: new Date().getTime()};//这是需要提交的数据 var content = qs.stringify(data); var options = { hostname: 127.0.0.1, port: 10086, path: /pay/pay_callback? + content, method: GET }; var req = http.request(options, function (res) { console.log(STATUS: + res.statusCode); console.log(HEADERS: + JSON.strin...
OAuth是一种开发授权的网络标准,全拼为open authorization,即开放式授权,最新的协议版本是2.0。 举个栗子: 有一个"云冲印"的网站,可以将用户储存在Google的照片,冲印出来。用户为了使用该服务,必须让"云冲印"读取自己储存在Google上的照片。 传统方法是,用户将自己的Google用户名和密码,告诉"云冲印",后者就可以读取用户的照片了。这样的做法有以下几个严重的缺点。 "云冲印"为了后续的服务,会保存用户的密码,这样很不...
相信很多小伙伴在用Vue-cli安装的脚手架开发的时候,在开发环境中项目可以很正常的运行,但是进入到生产环境,编译打包后,放入服务器,项目就不正常了,会出现空白页或者路由跳转404等问题。遇到这些问题不要慌张,正确的配置加上后端的简单配合就可以解决。 如何打包基于Vue-Cli,通过npm run build来进行打包的操作如何部署 将打包出来的资源,基于Vue-Cli的一般是dist目录下有static目录和index.html文件,可以直接将这两个文件...