Question

我正在构建一个Web应用程序，用户在其中搜索相机（位于具有dyndns域的远程网络上），并显示一个按钮来触发相机上的警报器。当用户单击按钮时，他们应该看不到页面刷新或发生任何事情（可能已禁用按钮）。该按钮正在向网站发送HTTP GET请求：

function n_points = BlueDotsDist() I = imread('BlueDots.png'); %Fix the image uploaded to the site - each dot will be a pixel. I = imresize(imclose(I, ones(3)), 1/6, 'nearest'); %Convert each color channel to a bynary image: R = imbinarize(I(:,:,1));G = imbinarize(I(:,:,2));B = imbinarize(I(:,:,3)); %figure;imshow(cat(3, double(R), double(G), double(B)));impixelinfo %Find blue dost: [blue_y, blue_x] = find((B == 1) & (R == 0)); %Compute distance map from first blue point P = CalcDistMap(R, blue_y(1), blue_x(1)); %Compute distance map from second blue point Q = CalcDistMap(R, blue_y(2), blue_x(2)); %Get 3x3 pixels around second blue point. A = P(blue_y(2)-1:blue_y(2)+1, blue_x(2)-1:blue_x(2)+1); dist_p = min(A(:)); %Minimum value is the shortest distance from first point (but not the number of white points). T = max(P, Q); %Each element of T is maximum distance from both points. T(T > dist_p) = 10000; %Remove points that are more far than dist_p. %Return number of white points between blue points. n_points = sum(T(:) < 10000); function P = CalcDistMap(R, blue_y, blue_x) %Each white pixel in R gets the distance from the blue dot in coordinate (blue_x, blue_y). %Initialize array with values of 10000 (high value - marks infinite distance). P = zeros(size(R)) + 10000; %P - distance from blue dot P(blue_y, blue_x) = 0; %Distance from itself. prvPsum = 0; while (sum(P(:) < 10000) ~= prvPsum) prvPsum = sum(P(:) < 10000); %Sum of "marked" dots. for y = 2:size(R, 1)-1 for x = 2:size(R, 2)-1 p = P(y, x); if (p < 10000) %If P(y,x) is "marked" A = P(y-1:y+1, x-1:x+1); %3x3 neighbors. A = min(A, p+1); %Distance is the minimum of current distance, and distance from p pixel + 1. A(R(y-1:y+1, x-1:x+1) == 0) = 10000; %Ignore black pixels. A(P(y-1:y+1, x-1:x+1) == 0) = 0; %Restore 0 in blue point. P(y-1:y+1, x-1:x+1) = A; %Update distance map. end end end end。

但是，我不确定用户刷新或单击后退按钮时如何处理，以及浏览器如何在历史记录中存储请求。我不希望用户能够按下“后退”按钮再次激活该请求，或者刷新页面并激活它。用户也不能将按钮请求另存为书签。本质上，只有在单击按钮后才能触发此事件，并且应该在整个网站上将按钮禁用30秒（所有用户都应该看到该按钮被禁用）。

这引发了一个问题：这应该是GET还是POST请求，如何通过按钮将其合并？

以下是相关代码：

example.com:port/file.xml?relay2State=2

<!-- siren_search.html -->

{% if cameras %}

<button id="trigger-all-btn" type="button" class="btn btn-outline-danger">Trigger all sirens</button>

<table id="camera-table" class="table table-hover">

    <thead>
        <tr class="header">
            <th scope="col" style="width:33%;">Asset Name</th>
            <th scope="col" style="width:33%;">Job Site</th>
            <th scope="col" style="width:33%;"></th>
        </tr>
    </thead>

    <tbody>
        {% for camera in cameras %}
        <tr>
            <td>{{ camera.asset_name }}</td>
            <td>{{ camera.site.name }}</td>
            <td><button id="{{ camera.asset_name }}-btn" type="button" class="btn siren-btn btn-outline-danger">Siren</button></td>
        </tr>
        {% endfor %}
    </tbody>

</table>

{% endif %}

Answer 1

您要问的不是一个简单的解决方案，实际上您有两个问题：

1）如何在不更改浏览器的情况下触发URL？

答案：异步执行。这需要Javascript，您可能会找到类似JQuery的库来简化此解决方案的创建。例如，考虑一下JQuery的$.get使用GET或POST对解决方案不重要

2）如果单击一个按钮，您如何与任何其他浏览器通信并禁用其按钮？

答案：这并不简单。浏览器到服务器的通信是由浏览器拉动的，而不是由服务器推动的。一种选择是使用异步Javascript轮询服务器，以便服务器轮询并提供有关按钮状态的更新。但是，然后您必须处理以下情况：在另一个浏览器上单击某个按钮之后，但在第二次单击的浏览器上，该按钮在最新的民意调查中获得了更新的按钮状态信息。

希望这个答案提供了一些有用的信息。

如何创建一个单击后将HTTP GET请求发送到安全URL的按钮？

1 个答案: