订阅http get调用-为什么我需要刷新我的前端页面来获取修改后的数据？ - 腾讯云开发者社区 - 腾讯云

开发者社区

文档建议反馈控制台

文章/答案/技术大牛

发布

从开发一款基于Vue技术栈的全栈热重载生产环境脚手架，我学到了什么？

我先拆分解释下：全栈的意思是支持前后端；热重载这个名词相信大家很熟悉，就是页面每次改动，不需要手动去刷新，可自动刷新；生产环境这里你可以理解成线上环境，用户使用的环境。...缘起为什么会想到开发这样的一款项目呢？我们平时可能更多地使用VueCLI或者Vite来开发Vue项目，但是如果就单纯开发一个简单的网页，未免有点小题大作了。...这里，我们主要使用它创建几个API接口，供前台调用。body-parser是在处理程序之前在中间件中解析传入的请求体，可以在request.body中获取从前台传来的数据。...在找它之前，我也找到其他可以实现自动刷新浏览器的插件，如：LiveReload，它也可以自动刷新页面，实时预览html效果。但是，我为什么没用LiveReload呢？...这里需要注意的是，如果是修改了服务端的js文件，会先通过nodemon重启应用，这时浏览器不会刷新，要再保存一下修改的文件，browser-sync才会显示出修改后的效果。

9942 0

耽误你的十分钟，让MVVM原理还给你

时间在嘀嗒嘀嗒的走着既然来了就继续看看吧这篇文章其实没有什么鸟用，只不过对于现在的前端面试而言，已经是一个被问烦了的考点了既然是考点，那么我就想简简单单的来给大家划一下重点众所周知当下是MVVM...$el.appendChild(fragment); // 再将文档碎片放入el中 } 看到这里在面试中已经可以初露锋芒了，那就一鼓作气，做事做全套，来个一条龙现在数据已经可以编译了，但是我们手动修改后的数据并没有在页面上发生改变...现在我们要订阅一个事件，当数据改变需要重新刷新视图，这就需要在replace替换的逻辑里来处理通过new Watcher把数据订阅一下，数据一变就执行改变内容的操作 function replace...this.a.b，默认就会调用get方法 + }); + Dep.target = null; } 当获取值的时候就会自动调用get方法，于是我们去找一下数据劫持那里的get方法 function...如：sum() {return this.a + this.b;},他们获取a和b的值就会调用get方法 // 所以不需要new Watcher去监听变化了

1.2K3 0

您找到你想要的搜索结果了吗？

是的

没有找到

前端Vue框架面试题大全

它是Model for View 为什么会出现MVVM 前端开发中暴露出了三个痛点问题：开发者在代码中大量调用相同的 DOM API，处理繁琐，操作冗余，使得代码难以维护。...不需要关注数据状态的同步问题，复杂的数据状态维护完全由 MVVM 来统一管理。...他们的思想是每次更新 dom 都尽量避免刷新整个页面，而是有针对性的去刷新那被更改的一部分，来释放掉被无效渲染占用的 gpu，cup 性能。...，所以在获取的时候，我会调用到 get 方法；在这之前，我有实例化一个 dep 队列，把每次获取 name 属性的地方，做一个 push ；当我接下来要做数据修改的时候，比如把 zhangsan...$store.state.属性来调用公共状态中的state，进行页面的渲染。　　　　3、当组件需要修改数据的时候，必须遵循单向数据流。

2.3K6 0

小程序如何使用订阅消息（PHP代码+小程序js代码）

前景本次开发时又再次用到，结合之前的摸爬滚打的经验，我给大家整理下，做到一文就能让你明白[什么是订阅消息？]、[如何使用订阅消息]、[开发订阅消息]，还在等什么？小程序学习订阅本专栏不香嘛？！...简明扼要来说，就是用户授权一次可以获取一次消息，开发者不可以一直推送消息打扰用户订阅消息的格式订阅消息是不可以随便发送的，需要对应到格式，包括字数长度等等，可以看这个，这是一个签到模板看下他的详情...都由字数的规范，防止推送垃圾消息，引流之类的运行基本流程前端通过组件接口用户进行授权，后端通过定时触发，将模板消息触发可以通过宝塔的定时计划来进行触发，用到的各种鉴权，我们通过redis来存储...> 下载redis服务，记得开放6379端口 ---- 新建access_token.php文件通过定时任务对access_token的存储，在快过期时调用更新，这里说一次为啥不调用一次刷新一次...的存储至少要保留 512 个字符空间； access_token 的有效期目前为 2 个小时，需定时刷新，重复获取将导致上次获取的 access_token 失效；建议开发者使用中控服务器统一获取和刷新

1.8K3 1

微信公众号开发基本流程

我们前期开发测试只需要注册个人订阅号即可，真正开发使用的是开发者工具里的测试号，具体下面会说。真正生产的话，使用的都是经过微信认证的订阅号、服务号、企业号。...5.获取openid以及网页授权（重难点）注意，这是公众号开发的重难点之一，请把技术文档中的微信网页授权模块多读两遍，然后带着疑问来看我的解析。（1）先明确为什么需要网页授权？我们的目的是什么？...别高兴太早，这种通过消息交互获取用户信息的方式，用户占主动地位，我们项目后端服务被动接受，那么如果我有个基本需求：我想在自定义菜单 – 对应我们网站的前端页面上展示微信用户基本信息，能做到吗？...你如何把后台接收到的消息和前端用户关联绑定？可见，这种被动的方式并不能实现该功能，我们需要主动出击，在前端就能获取到当前操作用户的openid！...，然后前端获取code参数调用后端获取openid接口，将获取的openid缓存到客户端，以便后面使用。

6.3K3 1

前端vue面试题2021_vue框架面试题

我叫XXX,来自XXX,很荣幸能来我们公司面试,我从事前端开发有3年了,目前掌握的技术有html,css,js,ajax,vue,小程序,参与过各种类型的项目。...ID 可能是code，然后前端进行数据改动，然后通过后台提供的相关接口，把数据作为参数传递，当后台拿到我的数据后往数据库中修改这个标识相对应的数据，然后将修改后的数据响应给我们，之后再进行渲染查：不要参数...，不需要传递任何参数，直接调用接口获取所有数据需要参数，首先第一点我们需要获取到需要查询的关键字然后通过后台提供的相关接口，把这些关键字作为参数传递，当后台拿到这个关键字把相对应的数据响应给我们，...,是无法绑定事件,这个时候需要事件委派) 给父元素绑定事件,通过捕获的过程来获取事件,并通过etarget来获取目标元素 13.cookie/localstorage/session区别（重要） localstorage...(必背) 作用一（基本用法）:本页面获取dom元素作用二：获取子组件中的data 作用三：调用子组件中的方法作用四：子组件调用父组件方法 37.ES6的新特性有哪些?

2.4K4 1

【实战】Next.js + 云函数开发一个面试刷题网站

后, 为 http 的方式调用 } 云函数的入参使用 HTTP 访问云函数时，HTTP 请求会被转化为特殊的结构体，称之为集成请求，结构如下： { path: 'HTTP请求路径，如 /hello...) } // 每次页面刷新都会执行这个方法 export async function getServerSideProps() { // 从云函数请求数据 const res =...ssr 渲染方式需要在 2 个 Region 之间的请求数据，相对来说请求速度较慢。...我的这个网站也开源了，包含一些前端常用工具，还可以在线刷面试题。...前端工具箱 GitHub 代码以上就是本文全部内容，希望这篇文章对大家有所帮助，也可以参考我往期的文章或者在评论区交流你的想法和心得，欢迎一起探索前端。

5.3K3 0

Vue3入门笔记七----登录功能

首先要有一个登录页面让访问者输入账号密码，并且要有登录按钮后端要有一个认证相关的API用来给页面调用以检查访问者提供的账号密码是否正确上一步的认证检查通过之后，前端会获得一个token，这个token...在这个过程中会用到axios来调用API，另外后端的认证用的jwt，还需要vuex来做状态管理，我会在下面分别介绍这三个知识点。...access token，并且还要更新在上一步存存储的access token vue3中api的集中管理在前后端分离的情况下，前端一般都需要一个方法来管理被调用的API，这样比较便于后期的维护、更新和修改等工作...，这里介绍一种我比较喜欢的方法，这个方式使用于中小型的前端项目，调用的API不是非常多的情况。...，但是我们还缺少一个指向这个页面的路由，现在来配置，修改src/router/index.js的内容，修改后如下， import { createRouter, createWebHashHistory

4841 0

webpack 热更新（HMR）实现原理

（js）和一个（或多个）updated chunk（js），将结果存储在内存文件系统中，通过websocket通信机制将重新打包的模块发送到浏览器端，浏览器动态的获取新的模块补丁替换旧的模块，浏览器不需要刷新页面就可以实现应用的更新...webpack 相比location.reload() 更新方式，不需要刷新页面，可以保存应用的当前状态 HMR相关的中间件 webpack-dev-middleware 本质上是一个容器，将webpack...在webpack第一次打包的时候，除了代码本身之外，还包含一部分HMRruntime订阅服务代码，HMRruntime 订阅服务端的更新变化，触发HMR runtime API拉取最新的资源模块。...http服务，底层利用websocket代替EventSource实现了webpack-hot-middleware提供的客户端和服务器之间的通信机制。...，源文件被修改后，浏览器自动更新是什么原理？

3.6K2 0

ajax面试题及答案_javase面试题

文本已收录至我的GitHub仓库，欢迎Star：https://github.com/ZhongFuCheng3y/3y AJAX常见面试题什么是AJAX，为什么要使用Ajax AJAX是“Asynchronous...传统的web前端与后端的交互中，浏览器直接访问Tomcat的Servlet来获取数据。Servlet通过转发把数据发送给浏览器。...服务器并不是以转发的方式响应，而是以流的方式把数据返回给浏览器 XMLHttpRequest异步对象会不停监听服务器状态的变化，得到服务器返回的数据，就写到浏览器上【因为不是转发的方式，所以是无刷新就能够获取服务器端的数据...(5)获取异步调用返回的数据. (6)使用JavaScript和DOM实现局部刷新....所以基于这一点，可以动态创建script标签，使用标签的src属性访问js文件的形式获取js脚本，并且这个js脚本中的内容是函数调用，该函数调用的参数是服务器返回的数据，为了获取这里的参数数据，需要事先在页面中定义回调函数

1.2K1 0

【前端面试分享】-2019“银十”面试题记录

）组成一个外壳页面和多个页面片段组成多个完整页面构成资源共用(css,js) 共用，只需在外壳部分加载不共用，每个页面都需要加载刷新方式页面局部刷新或更改整页刷新 url 模式 a.com...这里是典型的发布订阅模式，在这个模式下：数据是发布者（Observer），依赖对象是订阅者（Watcher），他们需要一个中间人来传递，那就是订阅器（Dep）。...总结：实现数据的双向绑定，首先要对数据进行劫持监听，所以我们需要设置一个监听器Observer，用来监听所有属性。如果属性发生变化了，就需要告诉订阅者Watcher看是否需要更新。...因为订阅者Watcher是有很多个，所以我们需要有一个消息订阅器Dep来专门收集这些订阅者，然后在监听器Observer和订阅者Watcher之间进行统一管理。...$nextTick $nextTick 是在下次 DOM 更新循环结束之后执行延迟回调用，在修改数据之后使用nextTick,则可以在回调中获取更新后的怎么理解：看下面这个例子就豁然开朗 DOM

3181 0

教你玩转Vue和Django的前后端分离

前后端半离不离 AJAX 的出现，让网页局部刷新成为可能。这一特性可以让用户留在当前页面中，同时发出新的HTTP请求，数据却可以不断地更新。解决了服务器每次请求都返回整个网页这种低效的机制。...2.局部性能提升通过前端路由的配置，我们可以实现页面的按需加载，无需一开始加载首页便加载网站的所有的资源，服务器也不再需要解析前端页面，在页面交互及用户体验上有所提升。...另外，学会前端可以自己建站获取流量，帮别人建站获取报酬，收获都是非常大的。因此，我建议后端工程师学点前端知识，不求精通，至少可以使用前端技术栈为自己服务。...axios 类似于 AJAX 的功能，主要为了访问后端 api 来获取数据。 mockjs 主要用于模拟后端的 api 接口返回数据。...当前端工程师需要独立于后端并行开发时,后端接口还没有完成,那么前端怎么获取数据？这时可以考虑前端自己模拟假数据,mockjs 可用来生成随机数据，拦截 Ajax 请求。

3.5K2 2

bootstrap + requireJS+ director+ knockout + web API = 一个时髦的单页程序

通常的说法是它通过避免页面刷新大大提高了网站的响应性，像操作桌面应用程序一样。...体验当然是最不好的，同时对服务器来说也需要处理的更多。 2. 页面局部刷新至从Ajax火起来之后，大家就想起了这一点。...具体的例子，我最早接触到的是Gmail，当然最简单的单页其实很简单比如说某Q邮箱，整了个Frame在页面里面，不管你怎么点，它懒是感觉没有刷新呀。...用Knockout作前端MVVM框架用requireJS来加载远程模板用director来作前端route model数据是直接和web api交互的，包括验证和授权模板是一个Controller...WEB API的验证　　基本上任何系统都避免不了与验证打交道，除非那个系统压根不从用户那里获取数据。

1.5K5 0

进阶 | 一份详细的AJAX与跨域处理讲解

如何发请求在前端的世界里也逛荡了不少日子了，目前已经get到大约5种发起请求的方式，主流的、非主流的。...可是 1.我们可能想用GET POST PUT DELETE 方法 2.不想刷新整个页面，想用一种更易于理解的方式来响应 AJAX出现浏览器和服务器交互模式 V1.0 在AJAX未出现之前，浏览器想从服务器获得资源...，注意是获取资源，会经过如下一个过程：浏览器发起请求->服务器接到请求响应给你HTML文档->浏览器收到资源，刷新页面，加载获得的的HTML。...后来随着时代的发展，人们日益增长的文化需求成为了社会的主要矛盾……有一天，小明看了一篇报道，他只是想在下面评论一下，发表对实事的亲切问候，问候完了，唉，你给我刷新页面干啥，我只是想评论一下啊。...上述请求响应都没有问题然而对于AJAX就不行这是为什么呢,因为因为原页面用 form 提交到另一个域名之后，原页面的脚本无法获取新页面中的内容,所以浏览器认为这是安全的。

9661 0

前端路由简介以及vue-router实现原理

前端路由 1. hash 模式随着 ajax 的流行，异步数据请求交互运行在不刷新浏览器的情况下进行。而异步交互体验的更高级版本就是 SPA —— 单页应用。...单页应用不仅仅是在页面交互是无刷新的，连页面跳转都是无刷新的，为了实现单页应用，所以就有了前端路由。...但因为没有 # 号，所以当用户刷新页面之类的操作时，浏览器还是会给服务器发送请求。为了避免出现这种情况，所以这个实现需要服务器的支持，需要把所有路由都重定向到根页面。...，所以我们只需要监听current.route的变化来动态render页面便可。...接着我么需要监听不同的路由变化，做相应的处理。以及实现hash和history模式。数据驱动这里我们延用vue数据驱动模型，实现一个简单的数据劫持，并更新视图。

1.8K6 0

看完就懂的Hybrid框架设计方案

场景三：打开了两个 Webview 页面 A B，B 页面向 A 页面传递一些数据对于 JS 来说，只能获取到当前 Webview 上下文，单纯通过 JS 是不能感知到其他 Webview 存在的。...Webview A 订阅事件，不同于场景二的订阅模式，订阅结果需要维护在 Native，所以这里需要有一次 JS -> Native 调用。...实际构建时需要根据一定的规则，比如根据页面路由来决定当前页面包含哪些代码。这种方案会侵入到打包流程，可能需要通过 loader 和规则来做一些删除代码的工作，相对来说会复杂一些。...这里最核心的问题是，在 App 内我们希望有统一的交互体验，尽管前端有自己的刷新控件，但主刷新控件包含一定复杂度的动画，前端很难和 Native 动画做到统一，所以最好直接使用 Native 控件。...通过约定 API 来达到使用 Native 控件的目的： class BridgeNameSpace { /** * 启用下拉刷新（默认关闭），前端仍然可以决定是否使用 Native 刷新控件

3.9K3 1

前端面试题ajax_前端性能优化面试题

HTTP请求 (5)获取异步调用返回的数据 (6)使用JavaScript和DOM实现局部刷新 ajax是一种创建交互式网页的计算 2，同步和异步的区别?...(3)设置响应HTTP请求状态变化的函数. (4)发送HTTP请求. (5)获取异步调用返回的数据....XSS是获取信息，不需要提前知道其他用户页面的代码和数据包。CSRF是代替用户完成指定的动作，需要知道其他用户页面的代码和数据包。...GET方式需要使用Request.QueryString来取得变量的值，而POST方式通过Request.Form来获取变量的值，也就是说Get是通过地址栏来传值，而Post是通过提交表单来传值。...更稳定也更可靠 15、前端需要注意哪些SEO 合理的title、description、keywords：搜索对着三项的权重逐个减小，title值强调重点即可，重要关键词出现不要超过2次，而且要靠前，

3.1K1 0

174道JavaScript 面试知识点总结（中）

使用 pushState 来实现有两个问题，一个是打开首页时没有记录，我们可以使用 replaceState 来将首页的记录替换，另一个问题是当一个页面刷新的时候，仍然会向服务器端请求数据，因此如果请求的...优点：用户体验好，不需要每次都从服务器全部获取，快速展现给用户缺点：单页面无法记住之前滚动的位置，无法在前进，后退的时候记住滚动的位置前端路由一共有两种实现方式，一种是通过 hash 的方式，一种是通过使用...我了解过一点双向数据绑定的原理，比如 vue 是通过使用数据劫持和发布订阅者模式来实现的这一功能。...vue 通过使用双向数据绑定，来实现了 View 和 Model 的同步更新。vue 的双向数据绑定主要是通过使用数据劫持和发布订阅者模式来实现的。...谈谈你对 webpack 的看法我当时使用 webpack 的一个最主要原因是为了简化页面依赖的管理，并且通过将其打包为一个文件来降低页面加载时请求的资源数。

9973 0

bootstrap + requireJS+ director+ knockout + web API = 一个时髦的单页程序

通常的说法是它通过避免页面刷新大大提高了网站的响应性，像操作桌面应用程序一样。...体验当然是最不好的，同时对服务器来说也需要处理的更多。 2. 页面局部刷新至从Ajax火起来之后，大家就想起了这一点。...具体的例子，我最早接触到的是Gmail，当然最简单的单页其实很简单比如说某Q邮箱，整了个Frame在页面里面，不管你怎么点，它懒是感觉没有刷新呀。...用Knockout作前端MVVM框架用requireJS来加载远程模板用director来作前端route model数据是直接和web api交互的，包括验证和授权模板是一个Controller...WEB API的验证　　基本上任何系统都避免不了与验证打交道，除非那个系统压根不从用户那里获取数据。

1.2K5 0

nodejs微信公众号开发

:调⽤微信接⼝所需的凭证，每个接⼝调用都需要，可通过AppID和AppSecret获取 URL白名单:增加获取accesstoken的安全性，当密码泄露时，通过白名单过滤⾮法请求（官方说明：https...公众平台的API调用所需的access_token的使用及生成方式说明： 1、建议公众号开发者使用中控服务器统一获取和刷新accesstoken，其他业务逻辑服务器所使用的accesstoken均来自于该中控服务器...，所以中控服务器不仅需要内部定时主动刷新，还需要提供被动刷新accesstoken的接口，这样便于业务服务器在API调用获知accesstoken已超时的情况下，可以触发accesstoken的刷新流程...公众号和小程序均可以使用AppID和AppSecret调用本接口来获取access_token。...api接口于api调用，是微信验证我们的服务器。 Co-wechat工具库下更多api的调用我想在index.html实现以下功能： - 实际工作中，通常是用库来实现的。

6.9K9 1

点击加载更多

相关资讯

热门标签

活动推荐

运营活动

活动名称

广告关闭