文档建议反馈控制台
首页
学习
活动
专区
圈层
工具
MCP广场
文章/答案/技术大牛
发布
    • 您找到你想要的搜索结果了吗？
    是的
    没有找到

    React项目配置5(引入MockJs,实现假接口开发)

    ---2018.01.15 4、React项目配置4(如何在开发时跨域获取api请求)---2018.01.16 5、React项目配置5(引入MockJs,实现假接口开发)---2018.01.17...6、React项目配置6(前后端分离如何控制用户权限)---2018.01.18 7、React项目配置6(ES7的Async/Await的使用)---2018.01.19(新增) 开发环境:Windows...具体的编写方法我就不讲了，大家可以去官网查看： http://mockjs.com/ 4、引入mock 修改apiManager.js import cookie from 'react-cookie'...token=' + token; 会返回 /todoList.mock地址，就会被 mock -> todoList.js 中的 假数据命中，ajax会被拦截！使用假数据！ ?...我们看下浏览器，没有获取到假数据 ? 我们把 todoList 改成0，让他获取mock假数据 ? 再看下浏览器 ? ok，请求被拦截，并获取到了mock假数据！！！ 所以调试完，记得把它改成1哦！

    5.2K62

    第二十九课 如何实现MetaMask签名授权后DAPP一键登录功能？

    1.签名导入-cancel.png 本文介绍下这个方法的原理和代码实现，使用MetaMask扩展的一键式加密安全登录流程，所有数据都存储在我们自己的后端。我们称为“使用MetaMask登录”。...但是，某些功能（如web3.eth.sendTransaction和web3.personal.sign）需要当前帐户使用其私钥对某些数据进行签名。...关于这一部分的最后一点说明：MetaMask将web3.js注入到您当前的浏览器中，但实际上还有其他独立的浏览器也会注入web3.js，例如Mist。...第5步：签名验证（后端） 当后端收到POST /api/authentication请求时，它首先根据请求消息体中publicAddress获取数据库中的对应用户，特别是它相关的随机数nonce。...为了本文的目的，我创建了一个小型演示应用程序。我正在使用的堆栈如下： Node.js，Express和SQLite（通过Sequelize ORM）在后端实现RESTful API。

    11.7K52

    React项目配置3(如何管理项目API接口)

    ---2018.01.15 4、React项目配置4(如何在开发时跨域获取api请求)---2018.01.16 5、React项目配置5(引入MockJs,实现假接口开发)---2018.01.17...6、React项目配置6(前后端分离如何控制用户权限)---2018.01.18 7、React项目配置6(ES7的Async/Await的使用)---2018.01.19(新增) 开发环境:Windows...8,node v8.9.1,npm 5.5.1,WebStorm 2017.2.2 上节课我们讲了如何自己封装ajax，那么我们请求的api接口应该怎么管理呢？...3、有时候需要验证用户身份，我们可以在这里api加上token 一般我们登录完之后，会把 token存在本地 cookie中 我们安装第三方依赖 npm i -S react-cookie@0.4.6...主要这里是要 -S ，我们需要把这个包，打进 vendor中 import cookie from 'react-cookie' let token = cookie.load('token'); export

    2.8K50

    前端运维部署那些事

    1.npm npm 是 Node.js 官方提供的包管理工具，主要用来管理项目依赖，发布等等，下面介绍几个比较常见的部署应用场景，常用的npm命令这里不作介绍了 1.1 nrm nrm(npm...sh "docker run --name frontend -p 80:80 frontend:latest" } 4.PM2 PM2是node进程管理工具，可以利用它来简化很多node应用管中繁琐任务...，是Nodejs应用程序守护进程必不可少的选择，方便管理基于nodejs平台下能够有独立运行访问的web服务，如nextjs、express、koa等前端应用 4.1 常见的应用场景 部署node...koa2 或 express 项目应用 部署 前端SSR（后端渲染）应用，如nuxt.js（Vue）和 next.js(React)等构建服务端渲染应用框架 4.2 如何使用 安装 ：npm install...，如果是规则复杂的话,可以结合nginx+lua 做一些些灰度的业务逻辑 1.根据Cookie实现灰度发布 通过获取cookie设置的版本号来区分 upstream test1 { server

    1.2K30

    前端食堂技术周刊第 36 期：pnpm v7.0.0、四月份登陆浏览器的新功能、VS Code April 2022

    四月份登陆浏览器的新功能 VS Code April 2022 React 官方团队出手，补齐原生 Hook 短板 Firefox 将在 102 中支持 Import Maps State of frontend...如：不再支持 Node.js 12、pnpm run 脚本名称后的所有命令行参数都会传递给 argv 等等，更多细节请前往如上链接的官方 release 页面查阅。...Node 对 ESM 的支持达到重要里程碑[4] Node.js 12 是最后一个非 ESM 版本，目前处于生命周期结束状态，这意味着 Node.js 对 ESM 的支持达到重要里程碑。...Chrome 101 中包含了更容易让人类使用的 hwb() 颜色函数、以及 Priority Hints 资源优先级加载控制。...Firefox 99 中包含 Navigator.pdfViewerEnabled，用于指示浏览器是否支持 PDF 文件的内联显示。

    1K20

    花椒前端基于容器的 Vue SSR 持续开发集成环境实践

    │ ├── entry-server.js // 运行在服务器端 │ └── entry-client.js // 运行在浏览器 └── server ├── app.js └── ssr.js...在服务器端asyncData预取数据时，不会把客户端请求中的cookie带上，所以需要手动将客户端中的cookie在预取数据时加到请求头部。...在之前的活动 SSR 改造中 ， 我们通过外部负载均衡到各服务器 ， 在各服务器上使用 PM2 对各个服务器上的 Node 进程进行管理 。这种方式在实际使用中存在一些问题 。 运行环境 人肉运维 。...在需要使用时将其挂载到指定目录下 ， 之后只需要将会影响到依赖下来的相关文件挂载到容器中 ， 将 node_modules 数据卷挂载到文件夹 。这样子就能持久化存储依赖文件 。...在依赖不变的情况下 ， 跳过依赖下载部分 ， 直接使用之前的缓存。 每次操作后清理不需要的文件 ， 如 yarn 生成的全局缓存 ，这些缓存不会影响到我们程序的运行 。

    2.1K50

    前端容器化部署：解决重启容器时的静态资源丢失问题

    前端容器化的基本流程包括： 构建前端应用：使用工具（如Webpack、Parcel）构建前端项目。 创建Docker镜像：在Dockerfile中定义如何将构建后的静态资源和依赖打包到一个镜像中。...以下是一个简单的Dockerfile示例，用于构建和运行一个前端应用： # 使用官方Node.js镜像作为基础镜像 FROM node:16-alpine # 设置工作目录 WORKDIR /app...my-frontend-app 在这个例子中，/path/to/static/resources是主机上的一个目录，用于存储静态资源。...使用对象存储 对于需要长期存储和访问静态资源的应用，使用对象存储服务（如Amazon S3、Google Cloud Storage）是一个理想的选择。...使用CI/CD管道 在CI/CD管道中构建前端应用，并将生成的静态资源打包到Docker镜像中： 构建阶段：使用CI/CD工具（如Jenkins、GitHub Actions）执行npm run build

    15700

    网易智慧企业 Node.js 实践一 : Node 应用架构设计和 React 同构

    另外一个比较重要的问题是用户的登录信息，我们使用了比较偏传统的方案，用户登录功能在 Java 端实现，当用户访问页面时，Node 会检查 cookie 里的登录 token，并进行校验，如果 token...一般前端框架是需要对 DOM 进行操作的，在浏览器环境当然没有问题，而在Node 是没有 DOM 这个概念的，那 React 是如何实现在 Node 端进渲染的呢？...在 Node 端 React 把虚拟 DOM 输出为字符串，而在浏览器端 React 把虚拟 DOM 映射为真实 DOM，完成页面渲染。 那么如何在 Node 端把 React 页面渲染为字符串呢？...其实整个服务端渲染的逻辑非常简单，把初始数据传给 React 组件使用 `renderToString` 进行渲染，得到一个字符串，把字符串放入页面模版中的 React 挂载节点内就行了。...controller： 对应的是 Egg.js 中的 controller，用来获取页面初始数据，然后使用`this.ctx.fishssr.renderPage(initData)`实现页面渲染。

    1.7K20

    前端应该知道的web调试工具——whistle

    作为一名前端，我们需要经常跟协议中的应用层打交道，Mock 数据、跨域问题、cookie 的修改、移动端调试等等，都是我们必备的技能，而 whistle 就能解决其中 90% 的问题 个人经常使用的一些场景如下...： 绑定 Host 替换请求（Mock 数据） 使用 Weinre 或者 vConsole 调试移动端页面 修改 cookie 往 HTML 中插入样式 往 HTML 中插入脚本 ......，如动图所示： ?...使用插件——利用whistle注入vConsole vConsole[10] 是微信团队开发的轻量、可拓展、针对手机网页的前端开发者调试面板，主要原理是通过在页面注入 js 实现模拟 PC 浏览器的...插件开发 上面提到了插件的使用，为了满足一些特定业务场景的需要，whistle 也提供了插件扩展能力，通过插件可以新增 whistle 的协议实现更复杂的操作、也可以用来存储或监控指定请求、集成业务本地开发调试环境等等

    2.6K20

    前端存储除了 localStorage 还有啥

    另外，数据在客户端之间是同步的，因此用户可以随时随地保持最新状态。 PouchDB 也在 Node.js 中运行，可以用作与 「CouchDB」 兼容的服务器的直接接口。...https://github.com/louischatriot/nedb ❞ NeDB 是一个 JavaScript 数据库，能够运行在 Node.js、nw.js、Electron 和浏览器环境。...为了便于开发者接入 Dexie.js，在 Dexie.js 官网中提供了丰富的示例： React + Dexie React + Redux + Dexie Dexie with Typescript...通常，它用于告知服务端两个请求是否来自同一浏览器，如保持用户的登录状态。...Cookie 主要用于以下三个方面： 会话状态管理（如用户登录状态、购物车、游戏分数或其它需要记录的信息）； 个性化设置（如用户自定义设置、主题等）； 浏览器行为跟踪（如跟踪分析用户行为等）。

    2.8K30

    玩转 Chrome DevTools，定制自己的调试工具

    Chrome DevTools 是我们每天都用的工具，它可以查看元素、网络请求、断点调试 JS、分析性能问题等，是辅助开发的利器。 今天不讲怎么使用它，而是讲一个好玩的方向：定制自己的调试工具。...上图中，UI 的部分叫做 frontend，解析网页、执行 JS 的部分叫做 backend。 backend 是集成在 Chrome 中的，但是 frontend 的部分是独立的。...content script 是可以获取 DOM 的，但是不能访问用户的 JS。这很容易理解，获取 DOM 是插件需要的功能，但是为了安全，又限制了只能访问 DOM。...很容易想到可以这样实现： devtools page 像页面注入 backend.js，用来获取运行时的信息，然后传递给 devtools page。...然后用自己实现的 frontend 连接上，通过 CDP 来控制它。 这就是 puppeteer 自动化测试的原理，只不过它是在 node 环境下的。 浏览器环境能实现这种控制么？

    4.2K30

    Pown-CDB：用于自动化执行Chrome调试协议任务的工具

    的一部分使用，但你也可以作为独立的工具来单独调用。.../node_modules/.bin/pown-cli cdb 你还可以使用全局pown在本地调用该工具： $ POWN_ROOT=. pown cdb 使用 警告：此pown命令当前正处在开发阶段，因此后续将可能出现重大更改的情况...[boolean] [default: false] 教程 Web 应用安全评估 让我们探讨如何在典型的Web应用中使用Own CBD。...使用key-combo shift + ?获取可用快捷方式列表： ? 一旦开始使用浏览器，Pown CDB将在用户界面中记录并显示流量。要拦截请求，请使用key-combo ctrl + t。 ?...在默认的shell编辑器（$EDITOR）中捕获并打开请求。进行所需的更改，然后保存并退出。原始请求将会被替换为你的更改。

    86820

    【原创】前端面试知识体系（一）

    nodejs） 浏览器中JS执行和DOM渲染共用一个线程 异步 宏任务 和 微任务 宏任务，如 setTimeout setInterval 网络请求 微任务，如 promise async / await...、传递cookie withCredentials 前端设置跨域cookie共享 cookie本地存储 HTML5之前cookie常被用于本地存储 HTML5之后推荐使用localStorage和sessionStorage...是常见登录验证解决方案 HTTP请求中token和cookie有什么区别-token token vs cookie cookie是HTTP规范，而token是自定义传递 cookie会默认被浏览器存储...体积一般大于cookie，会增加请求的数据量 如有严格管理用户信息的需求（保密，快速封禁）推荐session 如没有特殊要求，则使用jwt 如何实现SSO单点登录 基于cookie cookie默认不可跨域共享...网站的API发现有cookie，认为是用户自己操作的 CSRF预防手段 严格的跨域请求限制，如判断referrer(请求来源) 为cookie设置SameSite，禁止跨域传递cookie 关键接口使用短信验证码

    40011

    见识过的坑

    比如：vue使用了定时器，需要在beforeDestroy 中做对应销毁处理。js也是一样的。...这个我就说了等边三角形每个角是60度，哈哈，具体不知道怎么实现 ⑦、原生js读取cookie 一般读写cookie的时候我都是用 js-cookie 这个库的，所以对于原生忘得七七八八了 因为原生js获取...cookie只能通过 document.cookie 然后获得的是所有cookie集合在一起的字符串，需要使用正则什么的对此解析 二面： 从一面完到二面起码等了半个小时以上吧，面试我的又是另外一个面试官...⑤、跨域 我说一般都是用CORS比较多 CORS原理：使用自定义的HTTP头部让浏览器和服务器沟通 如添加一个额外的Origin头部，包含请求页面的的地址信息（协议、域名、端口号） 在后台设置 Access-Control-Allow-Origin...）的条件： 1、请求为GET、HEAD、POST其一 2、请求字段满足CORS安全集合的字段 3、Content-Type 有限制 ⑥、node.js的知识 对node不太了解，涉及到websocket

    76521

    Web应用中基于Cookie的授权认证实现概要

    其中，前后端通过Cookie进行授权认证是一种常见的实现方式。正文内容一、Cookie在授权认证中的作用在Web应用中，Cookie是一种用于在客户端（通常是浏览器）存储少量数据的机制。...在授权认证场景中，Cookie通常用于存储用户的认证信息，如会话令牌（Session ID）或JWT（JSON Web Token）。...携带Cookie：在后续的请求中，客户端浏览器会自动从本地获取并携带之前保存的Cookie，将其作为HTTP请求的一部分发送给服务器。...以下是一个基于Node.js和Express框架的示例：1.生成Cookie：使用cookie-parser中间件解析请求中的Cookie，并使用express-session或自定义逻辑生成会话令牌（...，而是使用浏览器提供的API（如localStorage、sessionStorage或IndexedDB）来存储和获取用户认证信息。

    87521
    点击加载更多

    相关资讯

    热门标签

    更多标签

    活动推荐

      运营活动

      活动名称
      广告关闭

      腾讯云开发者

      扫码关注腾讯云开发者

      扫码关注腾讯云开发者

      领取腾讯云代金券

      热门产品

      热门推荐

      更多推荐

      Copyright © 2013 - 2025 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有

      深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 深公网安备号 44030502008569

      腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号 | 京公网安备号11010802020287

      领券