如何防止用户更改HTML或JavaScript中的值

我试图让用户可以改变他们正在改变的配置文件文本颜色和背景颜色

我从codepen.io创建了这个

在本演示中，您可以看到，当您选中任何单选按钮时，

。彩色文本

div-insidetext将自动更改

我只想允许这种颜色：

#fa743e、#323949、#0000、#d8dbdf

。但问题在于，如果用户使用开发人员控制台将数据库中的

#ffffff

颜色过帐更改为

#ffffff

，例如

#fa743e

。这不好

表格如下：

<form method="post" action="">
<!--Text Color-->
<div class="renk">
  <input type="radio" id="red" class="sr ja" name="change-text-color" value="#fa743e">
  <label for="red" class="llr"></label>
</div>
<!--Background Color-->
<div class="renk"> 
   <input type="radio" id="lr" class="lr ja" name="change-background-color" value="#000000">
   <label for="lr" class="llr"></label>
</div>

</form>

我正在使用这种ajax post方法：

$.ajax({
     type: "POST",
     url: 'change_theme.php',
     data: {change-text-color:$('input[name="change-text-color"]:checked').val(),change-background-color:$('input[name="change-background-color"]:checked').val()},
     beforeSend: function(){$("#posting").html('<img src="icons/ajaxloader.gif"/>'); },
     success: function(html) {
     $('.tduzalani, .temayi-degistir-alani').animate({'opacity':'0'}, 300, 'linear', function(){
     $('.tduzalani, .temayi-degistir-alani').css('display', 'none');});
        swal({   title: "Theme was changing succuesfully!",   text: ":)",   timer: 5000 });
      }
});

$.ajax({
类型：“POST”，
url:“change_theme.php”，
数据：{更改文本颜色：$（'input[name=“change text color”]：checked'）.val（），更改背景颜色：$（'input[name=“change background color”]：checked'）.val（），
beforeSend:function（）{$（“#posting”）.html（“”）；}，
成功：函数（html）{
$（'.tduzalani，.temayi degistir alani'）。动画（{'opacity'：'0'}，300，'linear'，function（）{
$（'.tduzalani，.temayi degistir alani'）.css（'display'，'none'）；}）；
swal（{标题：“主题成功改变！”，文本：“：”，计时器：5000}）；
}
});

这是change\u theme.php

<?php
include_once 'includes.php';
$colors = array( '#fa743e','#ffcc4d','#94d487','#4a913c','#89c9fa','#3b94d9','#abb8c2','#dd2e44','#f5abb5','#bfcfee','#be72ea','#ea729f','#000000','#0e1d40','#0e4034','#40310e','#451468','#ffffff','#006cff','#bb0707','#660202','#44404b','#422929','#323949');
if((isSet($_POST['change-text-color']) && in_array($_POST['change-text-color'], $colors)) || (isSet($_POST['change-change-background-color']) && in_array($_POST['change-background-color'], $colors)))
{
$text-color=mysql_real_escape_string($_POST['change-text-color']);
$background-color=mysql_real_escape_string($_POST['change-background-color']);

$data=$Suavi->change_theme($uid,$text-color,$background-color);

}
?>

您无法阻止用户更改控制台中的内容。所有前端代码（HTML、JS、CSS）都会发送到浏览器，然后任何人都可以查看并根据自己的意愿进行更改。如果您真的想限制允许的颜色，请进行服务器端检查。

底线是：永远不要信任来自客户端的任何东西。客户机可以根据需要更改任何内容，甚至可以编辑发送到服务器的数据。如果你想确保他们不能做一些事情，那么你必须检查他们唯一不能改变的事情（服务器）。这是一个很好的指南，解释了我提到的好处

请在下面回答您的评论：

Javascript

：

$.ajax({
     type: "POST",
     url: 'change_theme.php',
     data: {change-text-color:$('input[name="change-text-color"]:checked').val(),change-background-color:$('input[name="change-background-color"]:checked').val()},
     beforeSend: function(){$("#posting").html('<img src="icons/ajaxloader.gif"/>'); },
     success: function(html) {
        if ( html == "1" ) {
            $('.tduzalani, .temayi-degistir-alani').animate({'opacity':'0'}, 300, 'linear', function(){
            $('.tduzalani, .temayi-degistir-alani').css('display', 'none');});
            swal({   title: "Theme was changing succuesfully!",   text: ":)",   timer: 5000 });
        } else {
            alert('There was an error saving this!')
        }
      }
});

---

在服务器端代码change_theme.php中，应该有两个单独的文本颜色和背景颜色数组

<?php
    include_once 'includes.php';
    $bgcolors = array('#fa743e','#ffcc4d','#94d487','#4a913c','#89c9fa','#3b94d9','#abb8c2','#dd2e44','#f5abb5','#bfcfee','#be72ea','#ea729f','#000000','#0e1d40','#0e4034','#40310e','#451468','#ffffff','#006cff','#bb0707','#660202','#44404b','#422929','#323949');
    $textcolors = array('#fa743e','#323949','#000000','#d8dbdf');
    if((isSet($_POST['change-text-color']) && in_array($_POST['change-text-color'], $textcolors)) || (isSet($_POST['change-change-background-color']) && in_array($_POST['change-background-color'], $bgcolors)))
    {
        $text-color=mysql_real_escape_string($_POST['change-text-color']);
        $background-color=mysql_real_escape_string($_POST['change-background-color']);

        $data=$Suavi->change_theme($uid,$text-color,$background-color);

    }
?>

---

希望这对您有所帮助。

一切都可以在开发人员工具中完成。在服务器端。。将验证放在那里，如果中的设置不存在，则使用默认值。@OliSoproniB。我明白服务器必须执行它。我在change_theme.php中使用数组代码，如果您选中，那么您可以看到。但有一个问题。问题是：如果用户仅更改

input[name=“change text color”]：checked'）.val（）

color，则会发布它。但是如果用户更改两种颜色：

change text color:$（'input[name=“change text color”]：checked'）.val（），则更改背景颜色：$（'input[name=“change background color”]：checked'）.val（）

您的服务器端代码中已经有了验证，但只需要在

$colors

数组中设置允许的颜色。比如：

$colors=array（'fa743e'、'323949'、'000000'、'd8dbdf'）

@GopakumarGopalan我在

change\u theme.php

中执行此操作，但它只检查两个值。例如，如果用户仅将文本颜色（如

#fa743e

更改为

#555555

），则用户的颜色=

#555555

过账。但是我没有这个

#555555

颜色，我知道服务器必须强制执行它。我在change_theme.php中使用数组代码，如果您选中，那么您可以看到。但有一个问题。问题是：如果用户仅更改

input[name=“change text color”]：checked'）.val（）

color，则会发布它。但如果用户更改两种颜色：

change text color:$（'input[name=“change text color”]：checked'）.val（），则更改bac‌​kground color:$（'input[name=“change background color”]：checked'）.val（）

这只是if语句的一个问题。我会把它们分成两个if/else语句。检查我的答案。这是出了问题。若用户更改了两种颜色并发布了该颜色，那个么就可以成功发布了。我完全搞不懂你们想在这里实现什么。如果您正在处理两个不同的数组，请查看下面的Gopakumars答案，或者重新表述您的问题，以便我更好地理解它。我需要确切地知道用户提交表单时需要发生什么。我需要知道如果主题颜色无效，那么我想打开此警告。：/code>主题颜色值无效，请通过选择颜色重试我仍然会尝试几乎相同的方法

<?php
    include_once 'includes.php';
    $bgcolors = array('#fa743e','#ffcc4d','#94d487','#4a913c','#89c9fa','#3b94d9','#abb8c2','#dd2e44','#f5abb5','#bfcfee','#be72ea','#ea729f','#000000','#0e1d40','#0e4034','#40310e','#451468','#ffffff','#006cff','#bb0707','#660202','#44404b','#422929','#323949');
    $textcolors = array('#fa743e','#323949','#000000','#d8dbdf');
    if((isSet($_POST['change-text-color']) && in_array($_POST['change-text-color'], $textcolors)) || (isSet($_POST['change-change-background-color']) && in_array($_POST['change-background-color'], $bgcolors)))
    {
        $text-color=mysql_real_escape_string($_POST['change-text-color']);
        $background-color=mysql_real_escape_string($_POST['change-background-color']);

        $data=$Suavi->change_theme($uid,$text-color,$background-color);

    }
?>