我有一个 NextJS 站点,它是在构建时静态生成的(SSG)。
接下来我需要实现两件事
第一个很容易做到,但是我正在努力使其符合 GDPR。问题是当我的网站是静态生成时,我无法访问服务器端的 cookie。这意味着,在不知道用户是否同意服务器上的 cookie 的情况下,我无法与页面的其余部分一起提供(或不提供)分析脚本。
可能的解决方案:
在客户端处理所有事情 - 请求同意,然后动态地将 GA 标签添加到<head>. 然而我担心这会对分析产生负面影响,或者完全破坏它。有人知道吗?
将我的网站更改为服务器端呈现 (SSR)。如果可能的话我很想避免这种情况。我对 SSG 网站的运行速度感到非常满意。它本质上只是一个基本的博客,因此为了分析而必须进行转换将是一种耻辱。
还有其他想法吗?...
如果有人有这方面的经验,无论他们使用 Next 还是 Nuxt 等,您的意见将不胜感激!
提前致谢
google-analytics static-site reactjs server-side-rendering next.js
我有一个页面,用户可以在其中创建标签(很像 stackoverflow 中的此处),然后将其发送(POST)到后端以存储在数据库中。用户可以创建标签,也可以在最终点击“提交”之前删除它们。
在 DOM 中,标签是与“x”按钮一起生成的。“x”按钮从 DOM 中删除元素,但从数组中删除时会出现麻烦。我能找到的最接近的解决方案是这个问题,但是我无法让它对我很有用。
这是 javascript (我正在使用 JQuery)
window.tag_array = [];
$( "#addtag" ).click(function() {
var tag = $("#input-tag").val();
//if tag is empty
if(!$('#input-tag').val()) {
alert("can't be empty");
} else {
//put tag.val into an array
tag_array.push(tag);
//add to DOM
$( "#tagsbox" )
.append( "<div class='displaytag'><i>"+tag+"</i><input type='hidden' class='tag' value="+tag+"><button onClick='return false;' class='removetag'>x</button></div>" );
//reset value in text area to null
$("#input-tag").val("");
//remove tag onclick
$('.removetag').click(function() {
$(this).parent().remove(); //remove tag from DOM
//splice from …Run Code Online (Sandbox Code Playgroud) 我正在使用Laravel框架,使用eloquent与我的数据库进行交互.
我有一个表格,我发布到我的控制器.此表单包含由用户添加的"标记".用户可以根据需要添加任意数量的标签.
我想POST标签,然后在我的控制器中,将每个标签插入一个新的表行,如下所示:
$tag = new Tag;
$tag->user_id = Input::get('user_id');
$tag->tag_name = Input::get('tag_name');
$tag->save();
Run Code Online (Sandbox Code Playgroud)
我该怎么处理?起初我想把每个标签放到一个数组中,POST数组,然后在控制器中我循环遍历每个元素,将它们插入数据库.
但经过一番搜索,我得出的结论是你不能发布一个数组.
所以另一种方法是将每个数组值作为隐藏表单类型POST.问题在于如何告诉我的控制器要插入多少个标签(以及它们的行).
我希望这很清楚,在此先感谢.
编辑:仍有一些麻烦
编辑2:更改了代码以在javascript中包含'i'变量以及POST时使用的新数组.
这是用户生成的输入标签的样子
$("#tagsbox")
.append("<div class='displaytag'><i>"+tag+"</i><input type='hidden' name='tags["+i+"]["+user_id+"]' value="+user_id+"><input type='hidden' name='tags["+i+"]["+tag+"]'value="+tag+">")
Run Code Online (Sandbox Code Playgroud)
这是提交后POST数据的样子
Array
(
[user_id] => 12
[lat] => 50.80589
[lng] => -0.02784
[spot_name] => test spot
[tags] => Array
(
[1] => Array
(
[12] => 12
[tag1] => tag1
)
[2] => Array
(
[12] => 12
[tag2] => tag2
)
[3] => Array
(
[12] => 12
[tag3] …Run Code Online (Sandbox Code Playgroud) 复选框输入的行为不是很可靠。
我正在根据商店的状态设置复选框的状态。这很好用。然而,有时选中该复选框不会触发onchange. 第二次选中该框将会触发,但是 UI 将显示错误的状态,因为第一次失败。
我正在使用 NextJS。这通常发生在第一次加载页面或硬刷新时。
import { useDispatch, useSelector } from 'react-redux';
import _cloneDeep from 'lodash/cloneDeep';
export default function Privacy() {
const consentObj = useSelector((state) => state.cookieOptions);
const dispatch = useDispatch();
const analyticsConsent = useSelector(
(state) => state.cookieOptions.analytics
);
function toggleConsentAnalytics() {
// this function will not fire on first input onchange
const newSettings = _cloneDeep(consentObj);
newSettings.analytics = !consentObj.analytics;
dispatch({ type: 'SET_COOKIE_OPTIONS', payload: newSettings });
}
return (
<div>
<div className={css.settingContainer}>
<strong>Analytics cookie</strong>
<label>
<div className={css.switchWrap}> …Run Code Online (Sandbox Code Playgroud)