1. HTTP service for returning random pictures
Implement the configuration environment: python, flask package (install with pip command or directly search for it in the ide and install it directly)
Create a flask project directly in python and put the code
from flask import Flask
app = Flask(__name__)
import os
import random
from flask import send_
@app.route('/')
def serve_image():
dir_path = 'C:\Use
all_files = os.list
image_file = random
return send_file(os
if __name__ == '__main_
app.run(host="0.0.0.0", port=5000)
If you only need local access, you can only fill in your own IP address in the host. If you need to access the service from the external network, fill in 0.0.0.0. The port number flask defaults to 5000. You can change it to something else if necessary.
Of course, you can also fill in nothing in app.run and directly add –host=0.0.0.0 in the other option boxes in the edit configuration of the run.
This is what it looks like after running
The two generated addresses can be accessed on the local browser. Of course, if you want to access the external network, you need to penetrate the internal network (because most of the connections we connect are local area networks rather than public networks, such as campus networks)
Intranet penetration requires a small tool ngrok (directly search on Baidu to download, it is a small application, its probably function is to assign a public network address to the port service you open, for example, we used port 5000 above)
After downloading, click on the program directly and enter ngrok http 5000. The results are as follows
In the forwarding line, you can see that you have obtained a public network address, so that you can access this service on devices connected to other networks. For example, I deployed this service on the Alibaba Cloud server, and then on my local machine Access (of course, deploy this service locally, mobile phone access is also possible), the effect is as follows
2. HTML Web page design
Realize the configuration environment: install lls server (windows control panel installation, online tutorial is quite simple and detailed)
Put the html file you wrote in a directory. My HTML file is as follows (it belongs to me if I learn it now)
<!DOCTYPE html>
<html>
<head>
<title>Table example</title>
<style>
table {
border-collapse: collapse;
}
th, td {
border: 1px solid black;
padding: 10px;
text-align: center;
}
</style>
<script>
function generateValues() {
var voltage = Math.floor(Math.random() * 1010)/10; // Generate random numbers from 0-100
var tan = (Math.floor(Math.random() * 2010000) - 1000000)/10000; // Generate a random number between -100-100
var point = Math.floor(Math.random() * 90000000) + 10000000; // Generate a random number from 10000000-99999999
var temperature = Math.floor(Math.random() * 1010)/10; // Generate a random number from 0-100
var time =Math.floor(Math.random() * 11) * 100 + 100 + Math.floor(Math.random() * 31) + 20230000; //
var shidu = Math.floor(Math.random() * 1010)/10; //
var ao1 = Math.floor(Math.random() * 10000)/10000; //
var bo1 =Math.floor(Math.random() * 10000)/10000; //
var co1 =Math.floor(Math.random() * 10000)/10000; //
var ao2 =-Math.floor(Math.random() * 10000)/10000; //
var bo2 =-Math.floor(Math.random() * 10000)/10000; //
var co2 =-Math.floor(Math.random() * 10000)/10000; //
var ao3 = Math.floor(Math.random() * 10000)/10000; //
var bo3 =Math.floor(Math.random() * 10000)/10000; //
var co3 =Math.floor(Math.random() * 10000)/10000; //
var ao4 = Math.floor(Math.random() * 101000)/1000; //
var bo4 = Math.floor(Math.random() * 101000)/1000; //
var co4 = Math.floor(Math.random() * 101000)/1000; //
var ao5 = Math.floor(Math.random() * 101000)/1000; //
var bo5 = Math.floor(Math.random() * 101000)/1000; //
var co5 = Math.floor(Math.random() * 101000)/1000; //
var r = Math.floor(Math.random() * 10000)/1000; //
var r1 = Math.floor(Math.random() * 10000)/1000; //
var r2 = Math.floor(Math.random() * 10000)/1000; //
var r3 = Math.floor(Math.random() * 60000)/10; //
var r4= Math.floor(Math.random() * 10000)/1000; //
document.getElementById("voltage").innerText = voltage + "U";
document.getElementById("tan").innerText = tan;
document.getElementById("point").innerText = point;
document.getElementById("temperature").innerText = temperature + "℃";
document.getElementById("time").innerText = time;
document.getElementById("shidu").innerText = shidu + "%";
document.getElementById("ao1").innerText = ao1;
document.getElementById("bo1").innerText = bo1;
document.getElementById("co1").innerText = co1;
document.getElementById("ao2").innerText = ao2;
document.getElementById("bo2").innerText = bo2;
document.getElementById("co2").innerText = co2;
document.getElementById("ao3").innerText = ao3;
document.getElementById("bo3").innerText = bo3;
document.getElementById("co3").innerText = co3;
document.getElementById("ao4").innerText = ao4;
document.getElementById("bo4").innerText = bo4;
document.getElementById("co4").innerText = co4;
document.getElementById("ao5").innerText = ao5;
document.getElementById("bo5").innerText = bo5;
document.getElementById("co5").innerText = co5;
document.getElementById("r").innerText = "r%" + r;
document.getElementById("result").innerText = "End of measurement" + " " + r1 + " " + r2 + " " + r3 + " " + r4;
}
setInterval(generateValues, 1000); // Update the value every second
</script>
</head>
<body>
<table>
<tr>
<th>Secondary voltage</th>
<td id="voltage"></td>
<th>tan</th>
<td id="tan" colspan="2"></td>
</tr>
<tr>
<th>Measuring point number</th>
<td id="point"></td>
<th>Temperature</th>
<td id="temperature" colspan="2"></td>
</tr>
<tr>
<th>Test date</th>
<td id="time"></td>
<th>Humidity</th>
<td id="shidu" colspan="2"></td>
</tr>
<tr>
<th> </th>
<th> ao </th>
<th> bo </th>
<th> co </th>
<td rowspan="2">PT side does not have self-calibration</td>
</tr>
<tr>
<th> f(x) </th>
<td id="ao1"></td>
<td id="bo1"></td>
<td id="co1"></td>
</tr>
<tr>
<th> d(points) </th>
<td id="ao2"></td>
<td id="bo2"></td>
<td id="co2"></td>
<td rowspan="3">Press 1 to measure and 2 to save </td>
</tr>
<tr>
<th> dU(x) </th>
<td id="ao3"></td>
<td id="bo3"></td>
<td id="co3"></td>
</tr>
<tr>
<th>Upt:U </th>
<td id="ao4"></td>
<td id="bo4"></td>
<td id="co4"></td>
</tr>
<tr>
<th>Uyp:U </th>
<td id="ao5"></td>
<td id="bo5"></td>
<td id="co5"></td>
<td id="r"></td>
</tr>
<tr>
<td id="result" colspan="5"></td>
</tr>
</table>
</body>
</html>
After downloading the lls server, enter the add website
The name of the website is arbitrary (differentiate it for yourself). The physical address is the folder where your html file is located, and change the name of html to index.html. Just choose a usable port (usually 8080, 8000 or something) ), after the addition is completed, this html web page will be published, and this machine can access the service through the local IP as above.
In the same way, if you need external network access, you also need internal network penetration. I used another internal network penetration tool, natapp (just to get a permanent domain name for free. The ngrok mentioned above can also be used), but the operation method is very different. Not bad, detailed online tutorials
Just get a public network address and access it.
The knowledge points of the article match the official knowledge files, and you can further learn related knowledge. Network Skill TreeHomepageOverview 42325 people are learning the system