标签: web-frontend

我正在关注warning我first load的应用程序。

lockdown-install.js:1 Removing intrinsics.%ArrayPrototype%.toReversed
intrinsics.%ArrayPrototype%.@@unscopables.toSpliced
intrinsics.%ArrayPrototype%.@@unscopables.toSorted

我真的不知道这是怎么回事，所以我之前没有尝试过任何东西。

我进入尝试node_modules找到与之相关的东西......一直在互联网上甚至在 chatGPT 上搜索，但我发现的信息很模糊。

我正在开发一个 Next.js 项目，并尝试在我的应用程序中实现多个中间件。虽然我发现了使用该包在 Next.js 中使用单个中间件的示例next-connect，但我更喜欢在不依赖任何外部包的情况下实现此目的。

我有一个middleware.ts文件，我想在其中定义和使用多个中间件。这是我的文件中的代码片段middleware.ts：

import { NextResponse, NextRequest } from 'next/server';

export function middleware(request: NextRequest) {

  const userId = request.cookies.get('userId')

  if (!userId) {
    return NextResponse.redirect(new URL('/auth/login', request.nextUrl.origin).href);
  }
  return NextResponse.next();
}

export const config = {
    matcher:'/profile/:path*',
};

她是我尝试过的：

import { NextResponse, NextRequest } from "next/server";

export function profileMiddleware(request: NextRequest) {
  const userId = request.cookies.get("userId");

  if (!userId) {
    return NextResponse.redirect(
      new URL("/auth/login", request.nextUrl.origin).href
    );
  }
  return NextResponse.next();
}

export function authMiddleware(request: NextRequest) …

我最近想知道如何通过电子邮件即服务应用程序(如sendgrid或mandrill等)发送只有Javascript等前端语言的电子邮件.

Sendgrid和mandrill有Curl APIS,所以基本上我只能向他们的API发送一个AJAX发布请求来发送邮件,但问题是,我将把我的API密钥放在JS文件中,这意味着它将是公开的. ..虽然它应该是秘密的.

在这两个应用程序中,有关前端使用的文档中没有任何内容,除了拥有自己的将使用API​​的服务器,但我目前正在基于前端的项目.没有服务器编程,服务器只渲染资产.

你们知道这种方法或应用程序能够实现这一目标吗？谢谢

我有这样的数据结构: -

WorkHistory{
    List<Jobs> jobs;
}
Jobs{
   List<String> workDoneSentences;
}

基本上,我正在努力收集一个人工作的所有过去的工作以及他在那里完成的工作.所以这是一个列表结构列表.我想知道如何在UI中为Thymeleaf/Spring mvc处理这个问题.

我正在尝试创建UI,如图所示.有一个表格可以输入数据.要输入workDoneSentence,我想打开另一个模态.并且句子列表应该绑定到正确的工作索引.

"完成工作"打开模式以输入完成工作句子的列表.

我对此的html代码如下: -

                                            <tbody>
                                            <tr id='addr_work0' th:each="workRow, rowStat : *{workHistoryDetails.allWorkHistoryData}">
                                                <td th:text="${rowStat.index + 1}"></td>
                                                <td><input type="text" name='work_name0'
                                                    placeholder='Company Name'  class="form-control" th:field="*{workHistoryDetails.allWorkHistoryData[__${rowStat.index}__].companyName}"/></td>
                                                <td><input type="text" name='work_city0'
                                                    placeholder='Company city' class="form-control" th:field="*{workHistoryDetails.allWorkHistoryData[__${rowStat.index}__].city}"/></td>
                                                <td><input type="text" name='work_title0'
                                                    placeholder='Job Title' class="form-control" th:field="*{workHistoryDetails.allWorkHistoryData[__${rowStat.index}__].jobTitle}"/></td>
                                                <td><input name="is_current0" type="checkbox"
                                                    value="" class="form-control" style="text-align: center;" th:field="*{workHistoryDetails.allWorkHistoryData[__${rowStat.index}__].currentJob}">
                                                </td>
                                                <td><input type="text" name='work_start0'
                                                    placeholder='Start Date' class="form-control" th:field="*{workHistoryDetails.allWorkHistoryData[__${rowStat.index}__].startDate}"/></td>
                                                <td><input type="text" name='work_end0'
                                                    placeholder='End Date' class="form-control" th:field="*{workHistoryDetails.allWorkHistoryData[__${rowStat.index}__].endDate}"/></td>
                                                <td><a class="btn btn-primary btn-md" id="work_done0"
                                                    name="work_done0">Work done</a></td>


                                            </tr>
                                            <tr …

我们使用Dojo(1.9.3)作为构建单页面应用程序的JS框架.然而,我们在Dojo的怪癖上花费了太多时间,所以即使是简单的任务也需要很长时间才能实现.由于缺乏适当的文档,我们经常不得不求助于阅读源代码然后实现变通方法.

我觉得如果我们转移到其他框架,我们会加快开发速度,并且更容易维护代码.我们的代码库相当大,因为它是一个复杂的应用程序,所以我们没有时间重新编写整个事物.因此,我希望将Dojo与其他框架结合起来是可能的,这样我们就可以逐步远离Dojo.我在业余时间只涉及这些其他框架,并且只编写了一些小的示例应用程序,所以我觉得我不能真正说出它们是否能与其他框架很好地配合,所以我希望有些你在那里可以.

我一直在研究的框架 - 根据我的简短调查按照我喜欢的顺序,但我可以自由地说服我.

1. 烬
2. 应对
3. 聚合物
4. Angular(最后因为我害怕主要的2.0大修)

虽然主要的问题是它是否可行,但如果您认为这样做是个坏主意,请提供建议.

最近有人问我前端用户身份验证和后端用户身份验证之间的区别（在采访中）。我无法回答他的问题。他问我你在网上看到的认证是在前端还是后端完成的，我回答后端。然后他问什么是前端认证，我无法回答。我用谷歌搜索找出答案，但无法获得两者之间的确切区别，即前端完成的操作与后端完成的操作。它们各自的使用方式、地点和原因是什么？

任何帮助，将不胜感激。

编辑：我在这里读到了一些相关内容。它谈到了一种称为双重身份验证的东西。尽管如此，我还是无法理解前端身份验证的概念。

我有一个日期选择器，当用户单击字段中的任意位置而不仅仅是日历图标时，我想显示该日期选择器。

这是选择器

export function DatePickerField(props) {
  ......

  return (
      <Grid container>
          <MuiPickersUtilsProvider utils={DateFnsUtils}>
              <KeyboardDatePicker
                  {...field}
                  {...props}
                  disableToolbar
                  inputVariant="outlined"
                  value={selectedDate}
                  onChange={_onChange}
                  error={isError}
                  autoOk
                  invalidDateMessage={isError && error}
                  helperText={isError && error}
              />
          </MuiPickersUtilsProvider>
      </Grid>
  );
}

我需要这样做，因为如果手动输入日期，它不会抛出任何错误，但我会获取invalid date表单数据。

单击字段时如何显示选择器？

我正在寻找一种在Windows服务中托管Web UI的方法,以便我可以在浏览器中配置和控制它.我想要一个简单轻量级的解决方案,我不想使用IIS.

我可能手动滚动大部分但是我想知道是否有一些东西可以简化这个过程.

显然,"交互时间"是在测量网页感知速度时使用的新指标.我有兴趣了解它实际上是什么.

这个术语显然是由Radware创造的,并且正在被推动为最有意义的性能测量(与Time to First/Last Byte,Time to Render等相比).

它被描述为:

页面显示其主要交互式(想想可点击)内容的点,而不是整页加载.

这对我来说似乎很主观; 例如,网页的"主要互动内容"是什么？

有报道引用测量结果,因此有些测量结果如何,而且必须自动化,因为结果集非常大(测试了约500个站点).

除了以上引用之外,我找不到有关如何衡量这一点的更多信息.

由于谷歌更加重视折叠内容(或可见内容),我想知道这个指标是否实际上更像是"第一次有意义渲染的时间",即它是当前页面目标的上下文.例如,在电子商务网站的产品页面上,这可能是主要图像,以及添加到购物篮链接.

我很想理解这个指标,对我而言,它似乎是最有用的指标.因此,我的问题是,是否有人在测量这一点,如果是这样,他们是如何做到的？

我认为Haskell提供了出色的功能.也适用于Web开发.但是,我想念的一个功能.服务器端呈现.原因是Google索引抓取工具和预渲染以提高移动设备的性能.

服务器端是否可以使用Ghcjs,Haste,Elm或其他一些Haskell-> JS编译器渲染Haskell前端？